ECharts的legend显示异常和dataZoom不显示

新晋coder 发布于 2016/06/01 12:31
阅读 2K+
收藏 0


@Kener-林峰 你好,想跟你请教个问题:

我使用的ECharts在html中构建折线图时

legend全部显示为灰色,而且dataZoom不显示,麻烦看看我哪里有写的不对的地方

如下图,toolbox的dataZoom可以用



代码:

var option = {
            title: {
                text: "各组渠道统计趋势\n",
                x: "center",
                y: "top"
            },
            grid: {
                x: 80,
                y: 60,
                x2: 80,
                y2: 180
            },
            tooltip: {
                trigger: 'axis',
                show: true
            },
            legend: {
                data: allRefer,
                x: "center",
                y: "bottom",
                itemGap: 20,
                selected: a
            },
            toolbox: {
                show: true,
                feature: {
                    mark: { show: true },
                    dataView: { show: true, readOnly: true },
                    magicType: { show: true, type: ['line', 'bar'] },
                    restore: { show: true },
                    saveAsImage: { show: true },
                    dataZoom:{ show:true}
                }
            },
            xAxis: [
                {
                    type: 'category',
                    boundaryGap: false,
                    data: allDateList
                }
            ],
            yAxis: [
                {
                    type: 'value'
                }
            ],
            dataZoom:[
                {
                    type:"slider",
                    start:0,
                    end:20
                }
            ],
            series: function() {
                var serie = [];
                for (var i = 0; i < referDetailStr.length; i++) {
                    var item = {
                        name: referDetailStr[i].series,
                        data: referDetailStr[i].yAxis,
                        type: "line"
                    };


                    if (referDetailStr[i].series == 10) {
                        item.markLine = {
                            data: [
                                [
                                    { name: '全局平均', yAxis: @avg, value: @avg },
                                    { yAxis: @avg, xAxis: allDateList[allDateList.length - 1] }
                                ]
                            ]
                        };
                    }
                    else if(referDetailStr[i].series >= 100) {
                        item.markLine = {
                            data: [{ name: '全局平均', type: 'average' }]
                        };
                    }


                    serie.push(item);
                }
                return serie;
            }()
        };
        chart.setOption(option);

加载中
0
hyjiacan
hyjiacan
为灰色肯定是你的 legend 和 series 的name 设置不同导致的
hyjiacan
hyjiacan
回复 @新晋coder : 我没有用过 dataZoom 哈。。
新晋coder
新晋coder
bingo,非常感谢。我没注意到,我的代码中他俩的数据类型让我转的面目全非。datazoom一般是什么原因会引起不显示问题,我的写法有问题?
返回顶部
顶部