通過.NET Ajax調用加載HighCharts

我試圖通過.net Ajax調用加載jQuery Highcharts圖表，但沒有多少運氣。通過.NET Ajax調用加載HighCharts

我可以填充圖表如下，並與它顯示沒有問題：

function LoadTopActionsChartComplete() { 
      var chart1; 
      $g(function() { 
       chart1 = new Highcharts.Chart({ 
       chart: { 
          renderTo: 'divTopActionChart', 
          type: 'bar', 
          backgroundColor:'rgba(255, 255, 255, 0.1)' 
        }, 
        title: { 
          text: 'Top Performing Actions' 
        }, 
        credits: { 
          enabled: false 
        }, 
        xAxis: { 
          categories:["1","2","3","4","5"] 
        }, 
        yAxis: { 
          title: { 
          text: '' 
          } 
       }, 
        series:[ 
          {name: 'Link1',data:[703]}, 
          {name: 'Link2',data:[661]}, 
          {name: 'Link3',data:[649]}, 
          {name: 'Link4',data:[615]}, 
          {name: 'Link5',data:[611]} 
         ] 
       }); 

      }); 

     } 



</script> 
</head> 

<script type="text/javascript"> 
    window.onload = LoadTopActionsChartComplete(); 
</script>

爲了加載該上AJAX調用我實現以下內容：

$g(function PageLoad() {  
     LoadTopActionsChart(); 
    }); 

function LoadTopActionsChart() 
    { 
     CampaignResultsNew.LoadTopActionsChart(LoadTopActionsChart_Callback); 

    } 

    function LoadTopActionsChart_Callback(response) { 
     alert(response.value); 
     LoadTopActionsChartComplete(response.value) 
    } 


    function LoadTopActionsChartComplete(chartScript) { 
      var chart1; 
      $g(function() { 
       chart1 = chartScript; 
      }); 

     }

函數「 LoadTopActionsChartComplete「正在成功接收以下代碼，但這不允許在頁面上呈現任何內容。

new Highcharts.Chart({ 
       chart: { 
          renderTo: 'divTopActionChart', 
          type: 'bar', 
          backgroundColor:'rgba(255, 255, 255, 0.1)' 
        }, 
        title: { 
          text: 'Top Performing Actions' 
        }, 
        credits: { 
          enabled: false 
        }, 
        xAxis: { 
          categories:["1","2","3","4","5"] 
        }, 
        yAxis: { 
          title: { 
          text: '' 
          } 
       }, 
        series:[ 
          {name: 'Link1',data:[703]}, 
          {name: 'Link2',data:[661]}, 
          {name: 'Link3',data:[649]}, 
          {name: 'Link4',data:[615]}, 
          {name: 'Link5',data:[611]} 
         ] 
       });

如果有人可能指出我要出錯的地方，我將不勝感激。

謝謝。

來源

2012-04-24 JIbber4568

你不能以這種方式加載和執行Javascript。我將重新考慮設計，並查看jQuery ['jQuery.getScript（）']（http://api.jquery.com/jQuery.getScript/）函數。 – 2012-04-24 14:13:34

您也可以讓您的服務（'CampaignResultsNew.LoadTopActionsChart'）返回描述圖表選項的有效json字符串。 – jlaceda 2012-04-24 23:19:57

謝謝。認爲這聽起來像我最好的選擇。現在就看看它。 – JIbber4568 2012-04-26 10:03:38

隨着該吐出圖表選項的網址，你可以使用$.getJSON()做到這一點：

$(function() { 

    $.getJSON("url/of/webservice/that/returns/chartoptions", function(chartOptions){ 

    var chart = new Highcharts.Chart(chartOptions); 

    }); 

})();

您可以使用.NET JSON庫像JSON.NET爲Web服務。

您也可能想了解有關$(document).ready()。

來源

2012-04-24 23:30:47 jlaceda

通過.NET Ajax調用加載HighCharts

回答

相關問題