HighCharts基本用法

var options={
chart: {type: 'column',renderTo: 'ChartDesigner1'},//type :图表类型(柱状图,饼状图),renderTo :指向页面的div容器或图表控件
title: {text: '企业检验提交次数统计'}, //标题
subtitle:{text: ''},//子标题
credits: {enabled: false},//底部版权不显示
exporting:{enabled:false},//右上角导出图标不显示
tooltip: {},//鼠标移上去显示信息
xAxis: {categories: []},//X轴显示的数据
yAxis: { 

min: 0,       //Y轴最小值
title: {text: ''}    //Y轴单位信息 比如 分钟,秒,公里/小时
},
plotOptions: {
column: {
pointPadding: 0.1,
borderWidth: 0
}
},
legend: { //图例信息
layout: 'vertical', //水平对齐
align: 'right',     //右侧显示
verticalAlign: 'middle', //居中
},
series: [] //Y轴数据集合(数组类型)

}

//异步获取数据 返回 JSON串,动态给xAxis.categories和series动态赋值  值得注意的是:结果集必须是数组即用 push()方法赋值。

var $dataServiceProxy = this.context.injector.get('$dataServiceProxy');
$dataServiceProxy.invokeMethod(
"Genersoft.BA.Xbrl.XbrlReportView.ViewBIXPCompanyAndXbrl",
"selectJsonCompanyChart",
[NM],
$.proxy(function(result) {
var jsonData = eval("(" + result + ")");
for(var i=0,len=jsonData.length;i<len;i++){
var str0=jsonData[i].VALUES;
if(i==0){
var strXs=str0.split(',');
$.each(strXs, function(strXNo, strX) {
  options.xAxis.categories.push(strX);
});
}else{
var series = {
data: []
};
var strYs=str0.split(',');
$.each(strYs, function(strYNo, strY) {
if(strYNo==0){
  series.name=jsonData[i].NAME; //图例信息
}
  series.data.push(parseFloat(strY));//每个分类信息(X轴要显示的信息)
});
options.series.push(series);//把数组信息 赋值给 series对象中
}
}
var chart = new Highcharts.Chart(options);//页面动态赋值后,再次初始化后,图表才会显示出来。
}, this),
$.proxy(function(error) {
$.notify.error("加载图表数据失败!");
},
this)
);
var chart = new Highcharts.Chart(options);//页面加载时第一次初始化

原文地址:https://www.cnblogs.com/wangyuru/p/3712365.html