JavaScript

超轻量级php框架startmvc

echarts多条折线图动态分层的实现方法

更新时间:2020-08-28 20:54:01 作者:startmvc
1、关于Echarts大家可以到这个网址看一下,还是比较详细的。http://echarts.baidu.com/doc/example.htm

1、关于Echarts

大家可以到这个网址看一下,还是比较详细的。

http://echarts.baidu.com/doc/example.html

这个功能还是很强大的,对于喜欢做数据统计来说是美味的。

2、echarts多条折线图动态分层


var xData = param.xData;

 var data = param.yData
 let option = [];
 let num =param.num ? param.num : 0;
 let max = num ? num *100 : 100; //处理精度丢失问题 但不是最佳方案
option = {

 title: {
 left: 'center',
 text: param.title
 },
 tooltip: {
 trigger: 'axis',
 },
 legend: {
 right:0,
 data:param.tName,
 },
 grid: {
 left: '3%',
 right: '4%',
 bottom: '3%',
 containLabel: true
 },
 xAxis: {
 boundaryGap: false,
 data:param.xData
 },
 yAxis: {
 name: param.yName,
 splitLine: { show: false },
 
 },
 series: []
 }
 option[6].series.push(
 {
 name: '平行于y轴的趋势线',
 type: 'line',
 //data:[0],
 markLine: {
 silent: true,
 data: [{
 yAxis: num
 }]
 }
 }
 )
 if( param.option_type == 6){
 for( var item in param.yData){
 var obj ={
 name: param.yData[item].name,
 type: 'line',
 color:param.yData[item].color,
 data: param.yData[item].data
 }
 option[6].series.push(obj)
 }
 }

效果图

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

echarts 折线图动态分层 echarts多条折线图