横向柱状图手机端,点击最后一个柱子,其他的全部消失

soumns- 发布于 2017/06/06 17:19
阅读 71
收藏 0

@Kener-林峰 你好,想跟你请教个问题,我在手机端写的横向柱状图,都是动态获取数据,点击最后一个其他的全部消失,请问这是什么原因呢?

点击最后一个柱子后,显示

代码:

var color = ['rgb(9,180,231)']
var title = {padding: [0,10,0,24 ]}

xarr = ["2016", "2015", "2014", "2013", "2012"]
sarr = ["130", "58", "44", "33", "30"]
inint('fleet',title,color,xarr,sarr)

function inint(ChartId,title,color,xaxisData,seriesData){
    var myChart = echarts.init(document.getElementById(ChartId));
      option = {
        title:title,
        grid: {
            left: 0,
            right: 20,
            bottom: 0,
            containLabel: true,
            top:0,
            //x:70
        },
        xAxis: {
            type: 'value',
            //interval:0 ,//显示完全的数据
            axisLabel :{
                    interval:0 ,//显示完全的数据
                    textStyle: {
                        color: '#fff'
                    }
                },
            axisLine:{
                    lineStyle: {
                        color: '#fff',
                        width: 1,
                    }
                },
                splitLine : {
                    lineStyle: {
                        color: '#fff'
                    }
                }
        },
        yAxis: {
            type: 'category',
            data: xaxisData,
            axisLabel :{
                interval:0,    //显示完全的数据
                textStyle: {
                    color: '#666'
                }
            },
            axisLine:{
                lineStyle: {
                    color: '#e5e5e5'
                }
            },
            splitLine : {
                lineStyle: {
                    color: '#e5e5e5'
                }
            }
        },
        series: [
            {
                type: 'bar',
                data: seriesData,
                barWidth : 30,
                itemStyle: {
                      normal: {
                          label: {
                              show: true,      //柱状图数字显示
                              position: 'right'  //文字在右边显示
                          },
                          color: function (value){
                              //alert(value);
                              var colorList = color;
                              return colorList[value.dataIndex];
                              //return "#"+("00000"+((Math.random()*16777215+0.5)>>0).toString(16)).slice(-6);
                          }
                      }
                  },
            }
        ]
    };
    myChart.setOption(option);  
}

加载中
返回顶部
顶部