Incubator-echarts: echarts3 条形图,设置barWidth参数后,barMaxWidth不起作用

Created on 4 Aug 2016  ·  3Comments  ·  Source: apache/incubator-echarts

问题简述 (One-line summary)

echarts3 条形图,设置barWidth的大小后,再设置barMaxWidth的大小,当barWidth的大小超出barMaxWidth的大小之后,实际显示以barWidth为准,也就是说,这里设置的barMaxWidth限制不起作用

版本及环境 (Version & Environment)

  • ECharts 版本 (ECharts version):3.2.2
  • 浏览器类型和版本 (Browser version):chrome 版本 35.0.1916.114 m
  • 操作系统类型和版本 (OS Version):win7旗舰版

    重现步骤 (Steps to reproduce)

1.1.引入echart3.2.2的js包,
2.option属性见下面

期望结果 (Expected behaviour)

条形图中,设置barWidth后,再加上barMaxWidth的限制之后,如果barWidth超出范围,以barMaxWidth为准。

可能哪里有问题 (What went wrong)

ECharts配置项 (ECharts option)

option = {
title : {
                show : true,
                text : '城市天气预报',
                subtext : '杭州天气',
                left : 'center',
                top : 'bottom',
            },
            grid : {
                left : 50,
                top : 60,
                right : 150,
                bottom : 160,
                borderWidth : 0,
            },
            tooltip : {
                show : true,
                showContent : true,
                trigger : 'item',
                triggerOn : 'mousemove',
                formatter : '',
                islandFormatter : '{a} < br/>{b} : {c}',
            },
            legend : {
                show : true,
                orient : 'horizontal',
                left : 'center',
                top : "top",
                selectedMode : true,
                data : [ {
                    name : '蒸发量',
                }, {
                    name : '蒸发量2',
                } ],
            },
            toolbox : {
                show : false,
                orient : 'horizontal',
                feature : {
                    dataZoom : {
                        show : false,
                    },
                    dataView : {
                        show : false,
                        readOnly : false,
                    },
                    magicType : {
                        show : false,
                    },
                    restore : {
                        show : false,
                    },
                    saveAsImage : {
                        show : false,
                    },
                }
            },
            xAxis : [ {
                show : true,
                type : 'category',
                boundaryGap : true,
                name : '',
                nameLocation : '',
                axisLine : {
                    show : true,
                    onZero : true,
                },
                axisTick : {
                    show : true,
                    onGap : false,
                    inside : false,
                },
                axisLabel : {
                    show : true,
                },
                splitLine : {
                    show : true,
                },
                splitArea : {
                    show : false,
                },
                data : ["2:00", "2:15", "2:30", "2:45", "3:00", "3:15", "3:30", "3:45", "4:15", "4:00", "4:30", "4:45"],
            }, ],

            yAxis : [ {
                show : true,
                type : 'value',
                boundaryGap : true,
            }, ],

            series : [ {
                name : '蒸发量',
                z : 0,
                type : 'line',
                data : ["3", "5", "6", "13", "12", "13", "19", "17", "25", "13", "16", "11"],
                markPoint : {
                    data : [ {
                        type : 'max',
                        name : '最大值'
                    }, {
                        type : 'min',
                        name : '最小值'
                    } ]
                },
                markLine : {
                    data : [ {
                        type : 'average',
                        name : '平均值'
                    } ]
                },
            }, {
                name : '蒸发量2',
                z : 0,
                type : 'bar',
                barWidth : 10,
                                barMaxWidth : 30,
                data : [ 13, 15, 17, 23, 22, 23, 29, 27, 25, 28, 22, 27 ],
                markPoint : {
                    data : [ {
                        type : 'max',
                        name : '最大值'
                    }, {
                        type : 'min',
                        name : '最小值'
                    } ]
                },
                markLine : {
                    data : [ {
                        type : 'average',
                        name : '平均值'
                    } ]
                },
            }, ],
}

其他信息 (Other comments)

All 3 comments

barGap也没起作用

barWidth 优先级比 barMaxWidth 高

如果说barWidth 优先级比 barMaxWidth 高,感觉这点不能理解,只能默默接受barWidth 优先级比 barMaxWidth 高这个事实了

Was this page helpful?
0 / 5 - 0 ratings