echarts 动态线图addData 数据问题

saintzag 发布于 2014/04/10 16:18
阅读 4K+
收藏 0

@Kener-林峰 你好,想跟你请教个问题:我现在想利用echarts实现类似股票走势图效果。

准备:给定x轴坐标值,代表一天的 24小时

xAxis: [
            {
                  type: 'category',
                  boundaryGap: false,
                  data : ['00', '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11'
                        , '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23']
            }
       ]

目标:从坐标[0,0]开始每3秒钟增加一个点,从队列尾部加点,不删除头部数据。

        // 动态数据接口 addData
        myChart.addData([[0, // 系列索引
        Math.round(Math.random() * 1000), // 新增数据
        false, // 新增数据是否从队列头部插入
        true // 是否增加队列长度,false则自定删除原有数据,队头插入删队尾,队尾插入删队头
        ]]
        );

问题:这里的 Math.round(Math.random() * 1000), // 新增数据 代表y轴的值,当addData的时候,x轴不知道如何指定,默认的是和xAxis:data 一一对应的,所以3秒钟add一次的话,24个点72秒图形就绘制完了。

我现在想要自己指定x轴坐标和y轴坐标,令xAxis:data中的值每个点代表一个小时,所以每3秒钟add一次的话,x轴的一个间隔应该add 1200个点。请问这个在echarts中如何实现呢?

或者有更好的方法实现 股票实时走势图,能给一个思路或者例子吗?


以下是问题补充:

@saintzag:数据点能否支持二维填充呢? (2014/04/10 17:26)
返回顶部
顶部