请教下echarts 改变时间轴让坐标轴重置问题。

各位大神，请教下，改变时间轴如何让坐标轴重置。如时间轴为月份，我改变月份，X轴要改为相应的天数，这应该怎么写？
我之前用 TIMELINE_CHANGED 点击事件，但是要如何改变xAxis的data值？

12 个解决方案

#1

1.先获取：var option = myChart.getOption();
2.option.xAxis[0]["data"]=[];//改变坐标值
3.myChart.setOption(option);//设置图表对象的所有参数属性

#2

@rong1999

现在坐标轴已经该看但是又出现这个错误请问该怎么解决？

#3

echarts 2.2.7 没有你说有错提示问题，你可以在
http://echarts.baidu.com/doc/example/dynamicLineBar.html 中改一下：
var lastData = 11;
var axisData;
clearInterval(timeTicket);
timeTicket = setInterval(function (){
    lastData += Math.random() * ((Math.round(Math.random() * 10) % 2) == 0 ? 1 : -1);
    lastData = lastData.toFixed(1) - 0;
    axisData = (new Date()).toLocaleTimeString().replace(/^\D*/,'');

  //myChart.setOption(option);
  var v_opto=myChart.getOption();
   v_opto.xAxis[0].data=["1","2","3","4","6"];
   v_opto.series[0]. data=[11,9,12,5,9]
   myChart.setOption(v_opto,true);

}, 2100);

#4

3.myChart.setOption(option);//设置图表对象的所有参数属性
这个要增加个参数true：myChart.setOption(option,true);
如果不增加的话，原来参数会合并，那如果原来选择7月份31天，那现在选择2月份28天，那图上还会保留7月的29,30,31的坐标和数据

#5

引用 4楼rong1999 的回复:

MyChart

#6

引用 4楼rong1999 的回复:

初始的option包含timeline和options，但是用getoption得到的并没有显示那两个属性，所以加上ture参数后，改变时间轴后坐标轴重置了但同时也丢失了timeline了，请问这是什么原因

#7

建议好好读一下echarts文档。
文档的“实例方法”中： {self} setOption
万能接口，配置图表实例任何可配置选项（详见option），多次调用时option选项默认是合并（merge）的，merge的设计可以让setOption很方便的成为更新任何属性的万能方法，比如你仅需要改title文字，则仅需要：
    setOption({title : {text : '新标题'}});
如果不需要，可以通过notMerger参数为true阻止与上次option的合并，如多次setOption间数据改变、长度不一致等的场景。

2.0.0起支持timeline组件，option中包含timeline（详见timeline）时每一个独立的option应该放置到命名为options的数组内，如
myCharts.setOption({
    timeline : {...},
    options : [
        {                // option1
            title : {...},
            series : [...]
        },
        {...},           // option2
        ...
    ]
});

{Object} getOption {void} 返回内部持有的当前显示option克隆（拷贝）。
这两个就回答了你的疑问，
getOption获得当前显示option克隆，就是当前显示的图表内容了，
如果获取timeline和options，你可以初始的option获取

#8

怎么能让x轴也就是时间轴能够动起来呢。我这是静态的。每次去刷新才动

#9

//重置x轴
    function reline(){
        var echartstype=$('#threat_file_time').val();
        if(echartstype=='day'){
           // alert(1);
           var option = barChart.getOption();
           var option1 = barChart1.getOption();
           var option2 = barChart2.getOption();
           option.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24];
           barChart.setOption(option,true);
           //第二个图形重置
           option1.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24];
           barChart1.setOption(option1,true);
           option2.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24];
           barChart2.setOption(option2,true);
    }else if(echartstype=='week'){
        var option = barChart.getOption();
           option.xAxis[0]["data"]=['周一','周二','周三','周四','周五','周六','周日'];
           barChart.setOption(option,true);
           var option1 = barChart1.getOption();
           option1.xAxis[0]["data"]=['周一','周二','周三','周四','周五','周六','周日'];
           barChart1.setOption(option1,true);
           var option2 = barChart2.getOption();
           option2.xAxis[0]["data"]=['周一','周二','周三','周四','周五','周六','周日'];
           barChart2.setOption(option2,true);
    }else if(echartstype=='month'){
        var months=[1,3,5,7,8,10,12];
        var nowtime=new Date();
        var month=nowtime.getMonth()+1;
        var year=nowtime.getFullYear();
        if(months.indexOf(month)!=-1 &&month!=2){
           var option = barChart.getOption();
           var option1 = barChart1.getOption();
           var option2 = barChart2.getOption();
           option.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31];
           barChart.setOption(option,true);
           //第二个图形重置
           option1.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31];
           barChart1.setOption(option1,true);
           option2.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31];
           barChart2.setOption(option2,true);
        }else if(month==2){
               if((year%4==0 && year%100!=0)||year%400==0){
                var option = barChart.getOption();
                var option1 = barChart1.getOption();
                var option2 = barChart2.getOption();
           option.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29];
           barChart.setOption(option,true);
           //第二个图形重置
           option1.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29];
           barChart1.setOption(option1,true);
           option2.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29];
           barChart2.setOption(option2,true);
               }else{
                var option = barChart.getOption();
                var option1 = barChart1.getOption();
                var option2 = barChart2.getOption();
           option.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28];
           barChart.setOption(option,true);
           //第二个图形重置
           option1.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28];
           barChart1.setOption(option1,true);
           option2.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28];
           barChart2.setOption(option2,true);
               }
        }else{
           var option = barChart.getOption();
           var option1 = barChart1.getOption();
           option.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30];
           barChart.setOption(option,true);
           //第二个图形重置
           option1.xAxis[0]["data"]=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30];
           barChart1.setOption(option1,true);
        }
       // alert(month);
    }
}

#10

引用 4 楼 rong1999 的回复:

大兄弟，你是我哥，亲哥，太几把叼了，，研究了一天，乱七八糟的回答都有，只有你，画龙点睛之笔，简直完美，让我特地申请个号来感谢你

#11

4楼正解，已解决

#12

引用 10 楼 qq_34042516 的回复:

引用 10 楼 qq_34042516 的回复:

Hi 哥们，请问下你是怎么解决的，myChart.setOption(option,true) 放在什么位置才能让timeline重置x轴呢

#1

1.先获取：var option = myChart.getOption();
2.option.xAxis[0]["data"]=[];//改变坐标值
3.myChart.setOption(option);//设置图表对象的所有参数属性

#2

@rong1999

现在坐标轴已经该看但是又出现这个错误请问该怎么解决？

#3

#4

#5

引用 4楼rong1999 的回复:

MyChart

#6

引用 4楼rong1999 的回复:

#7

#8

怎么能让x轴也就是时间轴能够动起来呢。我这是静态的。每次去刷新才动

#9

#10

引用 4 楼 rong1999 的回复:

大兄弟，你是我哥，亲哥，太几把叼了，，研究了一天，乱七八糟的回答都有，只有你，画龙点睛之笔，简直完美，让我特地申请个号来感谢你

#11

4楼正解，已解决

#12

引用 10 楼 qq_34042516 的回复:

引用 10 楼 qq_34042516 的回复:

Hi 哥们，请问下你是怎么解决的，myChart.setOption(option,true) 放在什么位置才能让timeline重置x轴呢

秒客网

请教下echarts 改变时间轴让坐标轴重置问题。

12 个解决方案

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

相关文章

请教下echarts 改变时间轴 让坐标轴重置问题。

12 个解决方案

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

相关文章

请教下echarts 改变时间轴让坐标轴重置问题。