2

尝试使用 highchart javascript 代码将 RegisterClientScriptBlock 实现到我的 vb.net 代码。

到目前为止我有这个。

      Dim script As String
    script = _
    "var chart = $('#container1').highcharts();" & _
    "chart.redraw();"

    ScriptManager.RegisterClientScriptBlock( _
        Me, _
        GetType(Page), _
        "container1", _
        script, _
        True)

我需要刷新数据。

我正在尝试使用上述方法使用我的数组重新更新数据:

    hidden.Value = arrayJson
    hidden1.Value = arrayJson1
    hidden2.Value = arrayJson2
    hidden3.Value = arrayJson3
    hidden4.Value = arrayJson4
    hidden5.Value = arrayJson5
    hidden6.Value = arrayJson6
    hidden7.Value = arrayJson7

不知道如何链接起来

4

3 回答 3

1

我不熟悉 VB,但您可以使用与 Java 类似的方法:

  1. 创建一个包含 jquery 1.7 或更高版本和 hightcharts 的 plaholder HTML 页面
  2. 包括一些包装 javascript,这将简化与您的代码的交互:

见:http: //jsfiddle.net/avitry/5bZ6n/2/

var chartList = new Array();
function newChart(properties, cid) {
    $("#container").append("<div id ='" + cid + "' class='chart'></div>");
    var jprops = properties.data; // adapt to your data storage
    var defaultOptions = {
        chart: {
            renderTo: cid,
        },
        plotOptions: {
            line: {
                enableMouseTracking: true,
                allowPointSelect: true
            }
        }
    };

    // Merge options from the properties object provided and defaultOptions
    $.extend(jprops, defaultOptions);
    // Create chart
    var nChart = new Highcharts.Chart(jprops);
    // Add to the list
    chartList[cid] = nChart;
}

// Remove all charts and empty the container
function clear() {
    chartList.length = 0;
    $("#container").empty();
}

// Redraw this chart
function refresh(cid) {
    chartList[cid].redraw();
}

3. 调用 javascript 包装函数您应该从您的代码中调用“newchart(ChartDataObject, String/id)”:

// Call newChart(json object, string) from your code
// This is called automatically onload for this demo
$(function () {
    newChart({
        data: {
            chart: {
                type: 'line',
                inverted: true
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            series: [{
                data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
            }]
        }
    }, "chart-1");

    refresh("chart-1");
    //clear();
});

您基本上将 json 数据传递给函数 newChart(),该函数负责调用 Highcharts 函数并设置默认选项。这使得在浏览器中设计页面变得更容易,并从代码中删除样板。

如果像我在小提琴中那样生成一个对象太难了,你可以根据需要添加尽可能多的辅助函数,使用字符串 id 来引用你的图表对象: newChart("chart1); setTitle("chart1", "My Title ")、setData("[1, 2, 3]") 等等。

.Net 框架内置了 Json 序列化程序:http: //msdn.microsoft.com/en-us/library/bb412179.aspx。您将有更好的机会使用现有的 json 序列化程序。

阿兰

于 2013-07-09T07:26:58.443 回答
1

一种更简单的方法是使用 Highcharts 的包装器,例如http://dotnethighcharts.codeplex.com/

于 2013-07-09T07:32:42.797 回答
1

RegisterClientScriptBlock 使用需要<script>标签传递的脚本:

Dim script As String
script = _
"<script type='text/javascript'>var chart = $('#container1').highcharts();" & _
"chart.redraw();</script>"

ScriptManager.RegisterClientScriptBlock( _
    Me, _
    GetType(Page), _
    "container1", _
    script, _
    True)
于 2013-07-10T17:54:37.507 回答