• 大小: 0.24M
    文件类型: .rar
    金币: 1
    下载: 0 次
    发布日期: 2021-01-30
  • 语言: JavaScript
  • 标签:

资源简介

echarts折线图曲线图分段用不同颜色显示,Y轴超过某一数值变色,echarts曲线改变颜色例子,x轴和y轴数据可以自己定义,曲线默认显示黑色(black),400以上900以下显示成金色(gold)。

核心代码
visualMap: {
    show: false,
    dimension: 1,
    pieces: [],  //pieces的值由动态数据决定
    outOfRange: {
         color: 'black'
    }
//上面是按官方文档固定格式,主要是配置样式布局,实际的x轴和y轴数据可以通过ajax在后台取得
//x轴数据
var datax = ['1月', '2月', '3月', '4月', '5月','6月', '7月', '8月', '9月','10月'];  //模拟动态数据
option.xAxis.data = datax; 
//y轴数据
var datay = [160, 280, 350, 500, 200, 250, 800, 600, 550, 200];  
option.series[0].data = datay; 
//400以上,900以下显示成金色(gold)
option.visualMap.pieces[0] = {gte: 400, lte: 900, color: 'gold'};

资源截图

代码片段和文件信息

 属性            大小     日期    时间   名称
----------- ---------  ---------- -----  ----

     文件     717611  2018-05-04 11:03  echarts曲线颜色折线分段颜色\echarts.min.js

     文件      64000  2018-05-04 11:02  echarts曲线颜色折线分段颜色\echarts折线图分段用不同颜色显示,超过某一数值变色.doc

     文件       2243  2018-05-04 11:01  echarts曲线颜色折线分段颜色\linedemo.html

     目录          0  2018-05-04 11:03  echarts曲线颜色折线分段颜色

----------- ---------  ---------- -----  ----

               783854                    4


评论

共有 条评论