精华内容
下载资源
问答
  • 通过echarts官网学习后,根据项目的需要,对echarts进行扩充和整理,发现可支持多个x轴,多个y轴,比想象中简单,echarts的确是很强大的资源,希望大家能有启发。
  • xAxis:[ { type:'category', boundaryGap:true, data:xAxis_2, axisTick:{ length:25 }, axisLabel:{ interval:0, ...

     

    xAxis_1 = () => {

        const arr = [];

        for (let i = 0; i < e.data.length; i++) {

            for (let j = 0; j < 2; j++) {

                if (j === 0) arr.push('新增');

                if (j === 1) arr.push('升级');

            }

        }

        return arr;

    };

    xAxis_2 = () => {

        const arr = [];

        for (let i = 0; i < e.data.length; i++) {

            arr.push(e.data[i][0]);

        }

        return arr;

    };

    xAxis: [

     

            {

     

                type: 'category',

                boundaryGap: true,

                data: xAxis_2,

                axisTick: {

                    length: 25

                },

                axisLabel: {

                    interval: 0,

                    lineHeight: 56,

                },

            },

            {

                type: 'category',

                boundaryGap: true,

                data: xAxis_1,

                axisTick: {

                    show: false

                },

                axisLabel: {

                    interval: 0,

                    lineHeight: 45,

                    inside: true

                },

                axisLine: {

                    show: false,

                },

                position: 'bottom',

                offset: 45,

            },

        ],

    展开全文
  • 想了两天终于想到了办法,那就是添加多个X轴的数据就可以,在这记录一下,如果哪位有更好的办法,请告知: 效果图: 代码: app.configParameters = { rotate: { min: -90, max: 90 }, align: { ...

    echarts 柱状图 x轴多维度显示不同数据源

    在这里插入图片描述
    echarts 柱状图 x轴数据某个值为空时就会出现柱状图不显示并且占位现象,如上图,那怎么解决呢?

    想了两天终于想到了办法,那就是添加多个X轴的数据就可以,在这记录一下,如果哪位有更好的办法,请告知:
    效果图:
    在这里插入图片描述
    代码:

    <!DOCTYPE html>
    <html style="height: 100%">
       <head>
           <meta charset="utf-8">
       </head>
       <body style="height: 100%; margin: 0">
           <div id="container" style="height: 100%"></div>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.min.js"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
           <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=xfhhaTThl11qYVrqLZii6w8qE5ggnhrY&__ec_v__=20190126"></script>
           <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>
           <script type="text/javascript">
    var dom = document.getElementById("container");
    var myChart = echarts.init(dom);
    var app = {};
    option = null;
    var posList = [
        'left', 'right', 'top', 'bottom',
        'inside',
        'insideTop', 'insideLeft', 'insideRight', 'insideBottom',
        'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
    ];
    
    app.configParameters = {
        rotate: {
            min: -90,
            max: 90
        },
        align: {
            options: {
                left: 'left',
                center: 'center',
                right: 'right'
            }
        },
        verticalAlign: {
            options: {
                top: 'top',
                middle: 'middle',
                bottom: 'bottom'
            }
        },
        position: {
            options: echarts.util.reduce(posList, function (map, pos) {
                map[pos] = pos;
                return map;
            }, {})
        },
        distance: {
            min: 0,
            max: 100
        }
    };
    
    app.config = {
        rotate: 90,
        align: 'left',
        verticalAlign: 'middle',
        position: 'insideBottom',
        distance: 15,
        onChange: function () {
            var labelOption = {
                normal: {
                    rotate: app.config.rotate,
                    align: app.config.align,
                    verticalAlign: app.config.verticalAlign,
                    position: app.config.position,
                    distance: app.config.distance
                }
            };
            myChart.setOption({
                series: [{
                    label: labelOption
                }, {
                    label: labelOption
                }, {
                    label: labelOption
                }, {
                    label: labelOption
                }]
            });
        }
    };
    
    
    var labelOption = {
        show: true,
        position: app.config.position,
        distance: app.config.distance,
        align: app.config.align,
        verticalAlign: app.config.verticalAlign,
        rotate: app.config.rotate,
        formatter: '{c}  {name|{a}}',
        fontSize: 16,
        rich: {
            name: {
                textBorderColor: '#fff'
            }
        }
    };
    
    option = {
        color: ['#003366', '#006699', '#4cabce', '#e5323e'],
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            },
             // 进行数据处理
            formatter: function (params) {
                var html = '';
                if (params.length != 0) {
                    // 可以自己打印一下console.info(params[0]);
                    var getName = params[0].name;
                    html += getName + '<br/>';
                    for (var i = 0; i < params.length; i++) {
                        // 如果为0 为空的数据我们不要了(你们可以直接判断 > 0)
                        if (params[i].value != null && params[i].value != 0
                            && params[i].value != '') {
                            html += params[i].marker;
                            html += params[i].seriesName + ': ' + params[i].value + '<br/>';
                        }
                    }
                }
                return html;
            }
        },
        legend: {
            data: ['Forest', 'Steppe', 'Desert', 'Wetland', 'www']
        },
        toolbox: {
            show: true,
            orient: 'vertical',
            left: 'right',
            top: 'center',
            feature: {
                mark: {show: true},
                dataView: {show: true, readOnly: false},
                magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
                restore: {show: true},
                saveAsImage: {show: true}
            }
        },
        xAxis: [
            {
                type: 'category',
                axisTick: {show: false},
                position: 'bottom',
                data: ['2012', '', '', '', '']
            },
            {
                type: 'category',
                axisTick: {show: false},
                position: 'bottom',
                data: ['', '2013', '', '', '']
            },
            {
                type: 'category',
                axisTick: {show: false},
                position: 'bottom',
                data: ['', '', '2014', '', '']
            },
            {
                type: 'category',
                axisTick: {show: false},
                position: 'bottom',
                data: ['', '', '', '2015', '']
            },
            {
                type: 'category',
                axisTick: {show: false},
                position: 'bottom',
                data: ['', '', '', '', '2016']
            }
        ],
        yAxis: [
            {
                type: 'value'
            }
        ],
        series: [
            {name: 'Forest',type: 'bar',barGap: 0,label: labelOption,xAxisIndex: 0,data: [320]},
            {name: 'Steppe',type: 'bar',label: labelOption,xAxisIndex: 0,data: [220]},
            {name: 'Desert',type: 'bar',label: labelOption,xAxisIndex: 0,data: [332]},
            {name: 'Wetland',type: 'bar',label: labelOption,xAxisIndex: 0,data: [98]},
            {name: 'Forest',type: 'bar',barGap: 0,label: labelOption,xAxisIndex: 1,data: ['',320]},
            {name: 'Steppe',type: 'bar',label: labelOption,xAxisIndex: 1,data: ['',220]},
            {name: 'Desert',type: 'bar',label: labelOption,xAxisIndex: 1,data: ['',232]},
            {name: 'Wetland',type: 'bar',label: labelOption,xAxisIndex: 1,data: ['',98]},
            {name: 'www',type: 'bar',label: labelOption,xAxisIndex: 1,data: ['',345]},
            {name: 'Forest',type: 'bar',barGap: 0,label: labelOption,xAxisIndex: 2,data: ['','',320]},
            {name: 'Steppe',type: 'bar',label: labelOption,xAxisIndex: 2,data: ['','',420]},
            {name: 'Desert',type: 'bar',label: labelOption,xAxisIndex: 2,data: ['','',232]},
            {name: 'Wetland',type: 'bar',label: labelOption,xAxisIndex: 2,data: ['','',98]},
            {name: 'Forest',type: 'bar',barGap: 0,label: labelOption,xAxisIndex: 3,data: ['','','',320]},
            {name: 'Wetland',type: 'bar',label: labelOption,xAxisIndex: 3,data: ['','','',98]},
            {name: 'Forest',type: 'bar',barGap: 0,label: labelOption,xAxisIndex: 4,data: ['','','','',620]},
            {name: 'Steppe',type: 'bar',label: labelOption,xAxisIndex: 4,data: ['','','','',290]},
            {name: 'Wetland',type: 'bar',label: labelOption,xAxisIndex: 4,data: ['','','','',98]}   
        ]
    };
    if (option && typeof option === "object") {
        myChart.setOption(option, true);
    }
           </script>
       </body>
    </html>
    
    展开全文
  • 最近写了一些数据方面的需求,...在显示一柱状图的时候,x轴的数据是隔一显示的,但是hover的时候却能显示出当前轴x轴的名称,如下图: 刚开始有点奇怪,看代码是没有任何毛病的,后来就试了官网的例子...

    转载:https://www.jianshu.com/p/c387b769a928

     

    最近写了一些数据方面的需求,所以免不了使用echarts,因为没怎么用过,所以遇到的问题还是比较多,先记录一些简单的问题叭。

    在显示一个柱状图的时候,x轴的数据是隔一个显示的,但是hover的时候却能显示出当前轴x轴的名称,如下图:

     

    刚开始有点奇怪,看代码是没有任何毛病的,后来就试了官网的例子,也就是把最好一个柱子的x轴名称改为周天,则显示就没毛病了:

     

    那就只能说明这个轴的名称太长了,所以导致它默认就隔一个显示,找了半天才发现控制它的属性是axisLabel,

     xAxis : [
            {
                type : 'category',
                data : ["周一", "周二", "周三", "周四", "周五", "周六", "周天"],
                axisTick: {
                    alignWithLabel: true
                },
                axisLabel: {
                    interval:0 
                }
            }
        ],
    

    该属性设置成0则表示强制显示所有标签,设置为1的话,隔一个标签显示一个标签,以此类推。
    但是设置为0的话,如果数据再长点,它会把这个数据直接不显示,还是没有解决问题,后来发现,可以让这个数据倾斜,那么就不会有不显示的问题了,

      axisLabel: {
                    interval:0,
                    rotate:45, //代表逆时针旋转45度
                }
    

    rotate表示倾斜显示,-是顺时针旋转多少度,+或不写表示逆时针旋转多少度,默认值为90,那么显示就如下了:

     

     

     

    展开全文
  • Echarts实现多个x轴或y轴曲线图

    千次阅读 2020-10-30 20:23:39
    Echart实现多个x轴或y轴曲线图 效果图如下: 1.1 配置option对象 option:{ // 设置 x 轴的样式 xAxis:{}, // 设置 y 轴的样式 yAxis:[], // 设置每条曲线的数据和样式 series:[], // 设置鼠标hover时的提示...

    Echarts实现多个x轴或y轴曲线图

    效果图如下:
    在这里插入图片描述

    1.1 配置option对象

    option:{
        // 设置 x 轴的样式
        xAxis:{},
        // 设置 y 轴的样式
        yAxis:[],
        // 设置每条曲线的数据和样式
        series:[],
        // 设置鼠标hover时的提示信息
        tooltip:{},
        // 调整表格两边的空白的区域
        grid:{},
        // 调整图样的名称
        legend:{}
        // 定义图样和每条曲线的颜色
        color:[]
    }
    
    • yAixs 用来配置 y 轴的数据,样式和名称,当把 yAxis 设置为一个数组,且给数组添加多个对象时,就可以实现多个 y 轴的效果。

    • 但是这些 y 轴都是重叠的,我们可以通过每个 y 轴的 offset 属性来调整 y 轴使它们到达合适的位置

    • 通过 axisTickaxisLabel 属性可以分别设置 y 轴上的刻度和刻度值的位置,是在左侧显示还是在右侧

    • 如果表格左右的留白空间不足以放下多个 y 轴,可以通过设置 grid 属性来调整空白和图像的比例

    • 具体实现代码如下:

    option = {
     yAxis: [
                  {
                    name: '指标参数一(单位)',
                    type: 'value',
                    // max: 700,
                    // min: 0,
                    // 让表格的刻度向靠里侧显示
                    axisTick: {
                      inside: true
                    },
                    axisLabel: {
                      inside: true
                    },
                    // 设置刻度线的颜色等样式
                    axisLine: {
                      lineStyle: {
                        color: 'red',
                        width: 3
                      }
                    },
                    splitLine: {
                      show: true, //想要不显示网格线,改为false
                      lineStyle: {
                        // 设置网格为虚线
                        type: 'dashed'
                      }
                    }
                  },
                  {
                    name: '指标参数二(单位)',
                    // max: 800,
                    // min: 0,
                    type: 'value',
                    axisLine: {
                      lineStyle: {
                        color: 'orange',
                        width: 3
                      }
                    },
                    splitLine: {
                      show: false //想要不显示网格线,改为false
                    },
                    // 设置坐标轴偏移位置
                    offset: -1060
                  },
                  {
                    name: '指标参数三(单位)',
                    // max: 900,
                    // min: 0,
                    type: 'value',
                    axisLine: {
                      lineStyle: {
                        color: 'green',
                        width: 3
                      }
                    },
                    offset: -1160,
                    splitLine: {
                      show: false //想要不显示网格线,改为false
                    }
                  },
                  {
                    name: '指标参数四(单位)',
                    // max: 1000,
                    // min: 0,
                    type: 'value',
                    axisTick: {
                      inside: true
                    },
                    axisLabel: {
                      inside: true
                    },
                    axisLine: {
                      lineStyle: {
                        color: 'blue',
                        width: 3
                      }
                    },
                    splitLine: {
                      show: false //想要不显示网格线,改为false
                    }
                  },
                  {
                    name: '指标参数五(单位)',
                    // max: 1100,
                    // min: 0,
                    type: 'value',
                    offset: 100,
                    axisTick: {
                      inside: true
                    },
                    axisLabel: {
                      inside: true
                    },
                    axisLine: {
                      lineStyle: {
                        color: 'purple',
                        width: 3
                      }
                    },
                    splitLine: {
                      show: false //想要不显示网格线,改为false
                    }
                  },
                  {
                    name: '指标参数六(单位)',
                    // max: 700,
                    // min: 0,
                    type: 'value',
                    offset: 200,
                    axisTick: {
                      inside: true
                    },
                    axisLabel: {
                      inside: true
                    },
                    axisLine: {
                      lineStyle: {
                        color: 'pink',
                        width: 3
                      }
                    },
                    splitLine: {
                      show: false //想要不显示网格线,改为false
                    }
                  }
                ],
        // 调整表格两边空白的区域
        grid: {
                  // 左侧
                  x: '20%',
                  // 上部
                  // y: 25,
                  // 右侧
                  x2: '20%'
                  // 下部
                  // y2: 35
               },
    }
    
    • xAxis,配置 x 轴数据、样式、名称,如果想设置多个 x 轴和上述 y 轴同理

    • 当 x 轴的 type 是 ‘time’ 类型时,刻度值需要在series 属性中设置具体见下文

      xAxis: {
                    name: '时间',
                    type: 'time',
                    // boundaryGap: false, //x下标在刻度处显示
                    splitLine: {
                      show: true, //想要不显示网格线,改为false
                      lineStyle: {
                        // 设置网格为虚线
                        type: 'dashed'
                      }
                    },
                    // splitArea: { show: true }, //保留网格区域
                    // 设置刻度线的颜色等样式
                    axisLine: {
                      lineStyle: {
                        color: 'black',
                        width: 3
                      }
                    }
                  }
      
    • series,用于配置每条曲线的名称、曲线中点的值,和 x 轴的时间刻度值

      • series 为一个数组时,里面的每一个对象都是一条曲线,所以可以配置多条曲线。
      • 通过 yAxisIndex 可以设置每个曲线对应的上面的 yAxis 中的 y 轴的索引,把曲线和不同的 y 轴匹配起来
      • smooth 为 true 时,则可以折线变成曲线
      series: [
                    {
                      // 曲线数据配置
                      data: [
                        {
                          // value[0] 为时间  value[1] 为值
                          value: ['1997-10-1', 300]
                        },
                        {
                          value: ['1997-10-2', 200]
                        },
                        {
                          value: ['1997-10-3', 500]
                        },
                        {
                          value: ['1997-10-4', 600]
                        },
                        {
                          value: ['1997-10-5', 400]
                        },
                        {
                          value: ['1997-10-6', 200]
                        }
                      ],
                      // 曲线名
                      name: '参数1',
                      // 设置参数对应的y坐标轴的索引
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    },
                    {
                      data: [
                        {
                          value: ['1997-10-1', 180]
                        },
                        {
                          value: ['1997-10-2', 250]
                        },
                        {
                          value: ['1997-10-3', 50]
                        },
                        {
                          value: ['1997-10-4', 450]
                        },
                        {
                          value: ['1997-10-5', 400]
                        },
                        {
                          value: ['1997-10-6', 200]
                        }
                      ],
                      // 曲线名
                      name: '参数2',
                      // 设置所在曲线对应的y坐标轴的索引
                      yAxisIndex: 1,
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    },
                    {
                      data: [
                        {
                          value: ['1997-10-1', 100]
                        },
                        {
                          value: ['1997-10-2', 800]
                        },
                        {
                          value: ['1997-10-3', 250]
                        },
                        {
                          value: ['1997-10-4', 350]
                        },
                        {
                          value: ['1997-10-5', 360]
                        },
                        {
                          value: ['1997-10-6', 500]
                        }
                      ],
                      name: '参数3',
                      // 设置参数对应的y坐标轴的索引
                      yAxisIndex: 2,
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    },
                    {
                      data: [
                        {
                          value: ['1997-10-1', 200]
                        },
                        {
                          value: ['1997-10-2', 400]
                        },
                        {
                          value: ['1997-10-3', 600]
                        },
                        {
                          value: ['1997-10-4', 800]
                        },
                        {
                          value: ['1997-10-5', 1000]
                        },
                        {
                          value: ['1997-10-6', 1100]
                        }
                      ],
                      name: '参数4',
                      // 设置参数对应的y坐标轴的索引
                      yAxisIndex: 3,
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    },
                    {
                      data: [
                        {
                          value: ['1997-10-1', 1100]
                        },
                        {
                          value: ['1997-10-2', 800]
                        },
                        {
                          value: ['1997-10-3', 600]
                        },
                        {
                          value: ['1997-10-4', 500]
                        },
                        {
                          value: ['1997-10-5', 400]
                        },
                        {
                          value: ['1997-10-6', 200]
                        }
                      ],
                      name: '参数5',
                      // 设置参数对应的y坐标轴的索引
                      yAxisIndex: 4,
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    },
                    {
                      data: [
                        {
                          value: ['1997-10-1', 700]
                        },
                        {
                          value: ['1997-10-2', 600]
                        },
                        {
                          value: ['1997-10-3', 500]
                        },
                        {
                          value: ['1997-10-4', 400]
                        },
                        {
                          value: ['1997-10-5', 300]
                        },
                        {
                          value: ['1997-10-6', 200]
                        }
                      ],
                      name: '参数6',
                      // 设置参数对应的y坐标轴的索引
                      yAxisIndex: 5,
                      type: 'line',
                      // 曲线平滑设置
                      smooth: true
                    }
                  ]
      
    • tooltip 属性用于配置鼠标放到曲线图上展示的数据展示样式

    tooltip: {
                  trigger: 'axis', // 有3个属性值 axis   item   none
                  axisPointer: {
                    type: 'cross',
                    label: {
                      backgroundColor: '#6a7985' //配置展示方块的背景颜色
                    }
                  }
                }
    

    在这里插入图片描述

    • 通过 legend 属性配置图样的文字信息和样式
    legend: {     // 调整图样文字
                 data: ['参数1', '参数2', '参数3', '参数4', '参数5', '参数6']
           }
    
    • 通过 color 属性定义图样和曲线的颜色
     // 定义图例和曲线颜色
     color: ['red', 'orange', 'green', 'blue', 'purple', 'pink']
    

    1.2 创建HTML元素

    设置要放入曲线的div的宽度和高度

    // 曲线图显示在这个div中,
    <div id="myChart"></div>
    // 这里设置的是高为600px ,宽为1600px
    <style>
    #myChart {
      width: 1600px;
      height: 600px;
    }
    </style>
    

    1.3 渲染曲线图

    let myChart = echarts.init(document.getElementById('myChart'))
    myChart.setOption(this.option)
    

    记录了开发过程中的一个Echart曲线图的需求问题,希望能够帮到大家。

    展开全文
  • 记录一下,备查 先上代码: <!DOCTYPE html> <head> <meta http-equiv=”Content-Type” content=”...ECharts<...-- 为ECharts准备一具备大小(宽高)的Dom --> <div id="main" style="h
  • Echarts.setOption(option,true); option默认是合并,加了true就可以防止合并
  • echarts中,横轴数据如果非常,会自动隐藏一部分数据,我们可以通过属性interval来进行调整。默认会采用标签不重叠的策略间隔显示标签,则需要在xAxis 属性加上axisLabel:{interval: 0}。可以设置成 0 强制显示...
  • echarts多级X轴

    2020-09-06 19:38:04
    基本思路是通过使用多个柱状图重叠在X轴 实现效果: HTML代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src=...
  • 由于X轴下标和柱形图实际上是一对一的,正常情况如下图 最初的想法是通过官方文档提供的对外参数,来修改X轴下标的位置,试了很参数,很无奈,都不行 solution 使用两坐标轴,原坐标轴放在上面,不显示;下面一...
  • 需求:显示8地级市,一周投诉数变化趋势图。 views.py: def city(request): x_data = ['合肥', '合肥', '合肥', '合肥', '合肥', '合肥', '合肥', '芜湖', '芜湖', '芜湖', '芜湖', '芜湖', '芜湖', '芜湖', '...
  • Echarts曲线设置X轴和Y轴

    千次阅读 2019-06-27 15:04:00
    Echarts曲线设置条X轴和Y轴效果图如下: 1. 2. xAxis 是一个数组,当横坐标数量小于等于2的时候,默认显示下上两个坐标轴,如果大于2,则可以指定位置,并使用 offset ... 但是我只希望其中一个x轴触发toolti...
  • 公司业务需要需要做一双X双Y的图形报表,之前研究过很例子结合把双X轴不等分显示; 1、有曲线图、有柱状图 2、X轴分组合并显示 3、可自行修改显示数值和比例在一图上
  • 说明:直角坐标系 grid 中的 x ,一般情况下单个 grid 组件最多只能放上下两个 x ,多于两个 x 需要通过配置offset属性防止同个位置多个 x 的重叠。 1 xAxis.show 说明:是否显示 x 。 默认值:true。 ...
  • Echarts调整X轴字体大小

    千次阅读 2020-06-18 00:49:53
    例如我要调整X轴上的字体大小,但是发现官方的demo上是没有的,那么只能去查阅文档,但是发现官方文档里面内容太,查起来很费劲。最后我发现,官方提供的测试工具很方便,带有代码提示功能,所以以后需要一些属性...
  • Echarts图表X轴数据每隔指定数量显示

    千次阅读 2020-09-04 18:06:32
    X轴上的单位非常,可能有上百条的数据,X轴放不下,Echarts会自动的在X轴隐藏部分数据,间隔一定的数据量显示X轴的单位,但有时自动设定的间隔数量不满足我们的需求,需要自定义间隔的数量,很简单,找到xAxis这属性,...
  • endValue: 9//x轴少于10数据,则显示全部,超过10数据则显示前10。 }] } 效果图 柱状图下方就是滑动条,可以选择选择滑动条长度范围(根据百分比显示) 官方dataZoom配置手册 在里面还有更的属性可以...
  • EchartsX轴只显示最大值和最小值

    千次阅读 2018-03-03 13:32:46
    本篇文章是介绍使用Echarts时设置X轴上的刻度只显示最大值和最小值,不显示其他的刻度。这我在做项目的过程中遇到的一需求,我花费了很长的时间才找到的一种解决办法,希望对后面遇到此坑的朋友有些许帮助,废话...

空空如也

空空如也

1 2 3 4 5 ... 8
收藏数 149
精华内容 59
关键字:

echarts多个x轴