HighCharts显示折线图
initChart:function(data){ //TCI指数初始化 var $screenWidth = $(window).width(); // if($screenWidth >= 1440){ //小于1600的不显示TCI指数 $(".jq-indexChart").each(function(){ var productType = $(this).attr("product-type"); //当前产品 var type = this; var xAxis=[]; var series = []; var indexArray=[]; $.each(data,function(key,value){ if(key == productType){ for(var i = value.length - 1; i >= 0 ; i--){ var row=value[i]; var time = new Date(Date.parse(row.indexTimeStr.replace(/-/g, "/"))).format("MM/dd"); xAxis.push(time); indexArray.push(row.indexNumber); } series.push({name:'数值',data:indexArray, animation: false}); //平均区间 = (最高指数值 - 最低指数值)÷7 //原点 = 最低指数值 - 平均区间 //最高点 = 最高指数值 + 平均区间 var maxIndexNumber = Math.max.apply(null, indexArray); var minIndexNumber = Math.min.apply(null, indexArray); //平均区间 var avgInterval = Math.round((maxIndexNumber - minIndexNumber) / 7); //原点 var originalPoint = minIndexNumber - avgInterval; //最高点 var maxPoint = maxIndexNumber + avgInterval; Highcharts.chart(type, { chart:{ type: 'area' }, title: { text: null }, xAxis: { categories: xAxis, labels:{enabled:true}, tickWidth:0, //设置刻度标签宽度 }, yAxis: { title: { text: '' }, labels:{ enabled:false, //不显示y轴 format:'{value}', style: { color: '#d1a45f' } }, tickPixelInterval : 2, tickInterval:1000, tickInterval:avgInterval, //刻度值 max : maxPoint, //最高点 min : originalPoint, //原点 plotLines: [{ value: 0, width: 1, color: '#808080' }], gridLineWidth: 0 //不显示网格线 }, tooltip: { valueSuffix: '', // enabled:false//鼠标移动不显示鼠标提示 }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'middle', borderWidth: 0, enabled: false }, series: series, lang : { noData : "暂无数据" },exporting:{ enabled:false//不显示导出 }, credits : { enabled : false//不显示版权 },plotOptions: { series : { fillColor: { linearGradient: [0, 0, 0, 80], stops: [ [0, Highcharts.getOptions().colors[0]], [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] ] }, marker: { radius: 3, //曲线点半径,默认是4 symbol: 'circle', }, }, }, }); } }); }); // } }