我不熟悉 VB,但您可以使用与 Java 类似的方法:
- 创建一个包含 jquery 1.7 或更高版本和 hightcharts 的 plaholder HTML 页面
- 包括一些包装 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 序列化程序。
阿兰