Incubator-echarts: 10台车,每350ms每台车就会进来一个轨迹点,当轨迹点达到一定数量时,页面很卡

Created on 24 May 2018  ·  9Comments  ·  Source: apache/incubator-echarts

One-line summary [问题简述]

10台车,每350ms每台车就会进来一个轨迹点,当轨迹点达到一定数量时,页面很卡。
数据来的比较快,过不了几分钟就会卡死,目前的做法是shift 一些旧的点。但是希望能保留比较多的轨迹数据。 加入数据 用的setOption 。 是否有别的方法可以解决这个性能问题,我看到api 里有一个appendData的方法,不知道是否适合,能否提供一些思路。非常感谢!

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]:

  • Browser version [浏览器类型和版本]:

  • OS Version [操作系统类型和版本]:

Expected behaviour [期望结果]

ECharts option [ECharts配置项]


option = {

}

Other comments [其他信息]


support author

Most helpful comment

在绘制行为轨迹点的时候 数据量 图层过多,可以采用 降采样策略,开启后可以有效的优化图表的绘制效率,默认关闭 ,或者清理历史数据点,定时清空这样内存压力会小很多 希望有用 查看帮助   💪💪
例如:

option = {
    dataset: {
        source: [
            // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:
            // 'date', 'open', 'close', 'highest', 'lowest'
            [12, 44, 55, 66, 2],
            [23, 6, 16, 23, 1],
            ...
        ]
    },
    series: {
        type: 'xxx',
        // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。
        dimensions: ['date', 'open', 'close', 'highest', 'lowest']
    }
}
series: {
    type: 'xxx',
    dimensions: [
        null,                // 如果此维度不想给出定义,则使用 null 即可
        {type: 'ordinal'},   // 只定义此维度的类型。
                             // 'ordinal' 表示离散型,一般文本使用这种类型。
                             // 如果类型没有被定义,会自动猜测类型。
        {name: 'good', type: 'number'},
        'bad'                // 等同于 {name: 'bad'}
    ]
}

All 9 comments

我也在做类似的功能,也是清除旧的数据:joy:

如果你找到更好的办法,一定要分享一下啊
我目前改用散点采用了appendData,large, largeThreshold ,情况要好了不少,但是很有局限性,比如我的热力图就不能这么用,因为appendData,large, largeThreshold ,不能对单个的数据进行设置,从而无法变更每个点的颜色,除非把数据来进行分组,每一组一个颜色值。

我单独.setOption,一个指定的series,echart居然把整个series里所有的系列全都重绘一遍,这不是浪费性能吗?就不能只单独的绘制我指定的series,其他的保持不变吗? 还是有什么设置API 是我没有找到的。
setOption({
series: {
name: "实时"
data:.......
})

@dandeXiong 那个setOption就是全量更新的,绘制指定的series可以用appendData吧,有seriesIndex参数来确定更新哪个,但这个方法是追加数据

@Shadowzeng 采用appendData 确实能大大提高效率,但是很有局限性啊,像我的散点图,要配合visualMap来做颜色变更,就无法使用appendData。他无法对单独的数据项进行设置。large, largeThreshold ,的开启后也是无法配合使用visualmap的

试试采样 http://echarts.baidu.com/option.html#series-line.sampling

老铁,这个问题你解决了吗

老铁,这个问题你解决了吗

时间隔得有点久了,我当时的做法,1.轨迹点的设置:showSymbol:false (刚开始是需求需要,后来阉割),这个设置就提高了不少的性能。 2. 每隔两个小时彻底清理一次数据点(这个时间点是根据自己项目监控服务内存峰值来设定的),清空完一般不到半分钟内存就降下来了。 期间也尝试过分层,比如过去多长时间累积的点,就分出一个图表绘制好静置不动放哪里,与用来动态绘点的图表进行联动

在绘制行为轨迹点的时候 数据量 图层过多,可以采用 降采样策略,开启后可以有效的优化图表的绘制效率,默认关闭 ,或者清理历史数据点,定时清空这样内存压力会小很多 希望有用 查看帮助   💪💪
例如:

option = {
    dataset: {
        source: [
            // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:
            // 'date', 'open', 'close', 'highest', 'lowest'
            [12, 44, 55, 66, 2],
            [23, 6, 16, 23, 1],
            ...
        ]
    },
    series: {
        type: 'xxx',
        // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。
        dimensions: ['date', 'open', 'close', 'highest', 'lowest']
    }
}
series: {
    type: 'xxx',
    dimensions: [
        null,                // 如果此维度不想给出定义,则使用 null 即可
        {type: 'ordinal'},   // 只定义此维度的类型。
                             // 'ordinal' 表示离散型,一般文本使用这种类型。
                             // 如果类型没有被定义,会自动猜测类型。
        {name: 'good', type: 'number'},
        'bad'                // 等同于 {name: 'bad'}
    ]
}
Was this page helpful?
0 / 5 - 0 ratings