棒移出x轴

时间:2018-06-18 12:53:58

标签: stacked-chart echarts

enter image description here enter image description here我在这个项目中使用了Echarts。一切正常但我的堆积条形图在缩放渲染后没有按预期工作,这增加了x轴刻度。条形移出了x轴,如屏幕截图所示。

这里是我的代码

        $scope.$watch(attrs.eData, function (newValue, oldValue, scope) { 
            var legend = [],
              sData = [],
              data = newValue,
              chartName = '';
            series = newValue;

            var totalSubtitle = 0;
            angular.forEach(data, function (val) {
                legend.push(val.name);
            });
            option = {
                name: seriesName,
                title: {
                    text: '',
                    subtext: totalSubtitle,
                    x: 'center'
                },
                tooltip: {
                    trigger: 'item',
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                xAxis: {
                    type: 'value',
                    min: 0,
                    axisTick: {
                        show: true
                    },
                    axisTick: {
                        alignWithLabel: false
                    }
                },
                yAxis: {
                    type: 'category',
                    scale: true,
                    data: [seriesName],
                    max: 100,
                    min: 100,
                    axisTick: {
                        show: false
                    }
                },
                legend: {
                    orient: 'horizontal',
                    bottom: -29,
                    order: true,
                    data: legend
                },
                series: series
            };
            myChart.setOption(option);
        }, true);
        $scope.$watch(attrs.eOptions, function (newValue, oldValue) {
            option.title.text = newValue.title.text;
            option.title.subtext = newValue.title.subtext;

            angular.forEach(newValue.series, function (val) {
                seriesName = val.name;
            });
            myChart.setOption(option);
        }, true);
        myChart.on('click', function (params) {
            $scope.SliceSelected(params);
        });
        $window.onresize = function () { 
            myChart.resize();
        };
    }
};

1 个答案:

答案 0 :(得分:0)

我从您的代码中得到了一些建议,这可能会帮助您解决此问题。

xAxis: { type: 'value', min: 0, axisTick: { show: true }, axisTick: { alignWithLabel: false } }

在上述代码轴中,重复两次提示音

然后将“ xAxis”类型更改为“ category”,将“ yAxis”类型更改为“ value”。

希望这可以解决您的问题