Echarts高级进阶教程(3):appendData大数据量分片加载数据增量渲染和常规思路异步加载数据的对比,对折线图是无效的

本文涉及的产品
云原生大数据计算服务MaxCompute,500CU*H 100GB 3个月
云原生大数据计算服务 MaxCompute,5000CU*H 100GB 3个月
简介: Echarts高级进阶教程(3):appendData大数据量分片加载数据增量渲染和常规思路异步加载数据的对比,对折线图是无效的

appendData对折线图起作用吗?在反复看官方的说明后,带着这样的怀疑,做了一下测试:

Echarts高级进阶教程(2):appendData异步加载大数据量分片加载数据和增量渲染的解决方案

模拟数据

    //模拟数据;
    var dataList = [], dataName = [];
    var newData = 1000000;
    for (var i = 1; i < newData; i++) {
        dataName.push(i);
        //dataList.push({name: i, value: i + parseInt(Math.random() * 100)});
        dataList.push([i, i + parseInt(Math.random() * 100)]);
    }


appendData大数据量分片加载数据和增量渲染代码:

    var option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: '#6a7985'
                }
            }
        },
        dataZoom: [{
            //show: true,
            //type: "inside",
            start: 50,
            end: 100,
            bottom: 10,
        }],
        xAxis: {
            data: dataName
        },
        yAxis: {},
        series: [{
            data: [],
            type: 'line',
        }]
    };
    myChart.setOption(option, true);
    window.addEventListener("resize", function () {
        myChart.resize();
    });
    myChart.appendData({
        seriesIndex: 0,
        data: dataList,
    });
    myChart.resize();


常规代码:

    //渲染图表;
    var myChart = echarts.init(document.getElementById("container"));
    var option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: '#6a7985'
                }
            }
        },
        dataZoom: [{
            //show: true,
            //type: "inside",
            start: 50,
            end: 100,
            bottom: 10,
        }],
        xAxis: {
            data: dataName
        },
        yAxis: {},
        series: [{
            data: dataList,
            type: 'line',
        }]
    };
    myChart.setOption(option, true);
    window.addEventListener("resize", function () {
        myChart.resize();
    });

效率对比

10万模拟数据时间

  • 常规加载
  • 分片加载数据增量渲染

100万模拟数据时间

  • 常规加载


  • 分片加载数据增量渲染

结论

1.对于折线图来说,appendData大数据量分片加载数据增量渲染和常规的方法没多大区别;

2.某种程序上来说,常规比appendData时间更优;

3.官方应该没骗我,appendData对折线图是无效的。

目前支持的图有:ECharts 基础版本的 散点图(scatter) 和线图(lines)。ECharts GL 的 散点图(scatterGL)、线图(linesGL) 和可视化建筑群(polygons3D)。


Done!

相关实践学习
基于MaxCompute的热门话题分析
本实验围绕社交用户发布的文章做了详尽的分析,通过分析能得到用户群体年龄分布,性别分布,地理位置分布,以及热门话题的热度。
SaaS 模式云数据仓库必修课
本课程由阿里云开发者社区和阿里云大数据团队共同出品,是SaaS模式云原生数据仓库领导者MaxCompute核心课程。本课程由阿里云资深产品和技术专家们从概念到方法,从场景到实践,体系化的将阿里巴巴飞天大数据平台10多年的经过验证的方法与实践深入浅出的讲给开发者们。帮助大数据开发者快速了解并掌握SaaS模式的云原生的数据仓库,助力开发者学习了解先进的技术栈,并能在实际业务中敏捷的进行大数据分析,赋能企业业务。 通过本课程可以了解SaaS模式云原生数据仓库领导者MaxCompute核心功能及典型适用场景,可应用MaxCompute实现数仓搭建,快速进行大数据分析。适合大数据工程师、大数据分析师 大量数据需要处理、存储和管理,需要搭建数据仓库?学它! 没有足够人员和经验来运维大数据平台,不想自建IDC买机器,需要免运维的大数据平台?会SQL就等于会大数据?学它! 想知道大数据用得对不对,想用更少的钱得到持续演进的数仓能力?获得极致弹性的计算资源和更好的性能,以及持续保护数据安全的生产环境?学它! 想要获得灵活的分析能力,快速洞察数据规律特征?想要兼得数据湖的灵活性与数据仓库的成长性?学它! 出品人:阿里云大数据产品及研发团队专家 产品 MaxCompute 官网 https://www.aliyun.com/product/odps&nbsp;
相关文章
|
4天前
|
存储 分布式计算 数据挖掘
数据架构 ODPS 是什么?
数据架构 ODPS 是什么?
50 7
|
4天前
|
存储 分布式计算 大数据
大数据 优化数据读取
【11月更文挑战第4天】
15 2
|
17天前
|
数据采集 监控 数据管理
数据治理之道:大数据平台的搭建与数据质量管理
【10月更文挑战第26天】随着信息技术的发展,数据成为企业核心资源。本文探讨大数据平台的搭建与数据质量管理,包括选择合适架构、数据处理与分析能力、数据质量标准与监控机制、数据清洗与校验及元数据管理,为企业数据治理提供参考。
58 1
|
11天前
|
存储 大数据 定位技术
大数据 数据索引技术
【10月更文挑战第26天】
28 3
|
11天前
|
存储 大数据 OLAP
大数据数据分区技术
【10月更文挑战第26天】
42 2
|
14天前
|
消息中间件 分布式计算 大数据
数据为王:大数据处理与分析技术在企业决策中的力量
【10月更文挑战第29天】在信息爆炸的时代,大数据处理与分析技术为企业提供了前所未有的洞察力和决策支持。本文探讨了大数据技术在企业决策中的重要性和实际应用,包括数据的力量、实时分析、数据驱动的决策以及数据安全与隐私保护。通过这些技术,企业能够从海量数据中提取有价值的信息,预测市场趋势,优化业务流程,从而在竞争中占据优势。
47 2
|
16天前
|
数据采集 分布式计算 大数据
数据治理之道:大数据平台的搭建与数据质量管理
【10月更文挑战第27天】在数字化时代,数据治理对于确保数据资产的保值增值至关重要。本文探讨了大数据平台的搭建和数据质量管理的重要性及实践方法。大数据平台应包括数据存储、处理、分析和展示等功能,常用工具如Hadoop、Apache Spark和Flink。数据质量管理则涉及数据的准确性、一致性和完整性,通过建立数据质量评估和监控体系,确保数据分析结果的可靠性。企业应设立数据治理委员会,投资相关工具和技术,提升数据治理的效率和效果。
49 2
|
18天前
|
存储 安全 大数据
大数据隐私保护:用户数据的安全之道
【10月更文挑战第31天】在大数据时代,数据的价值日益凸显,但用户隐私保护问题也愈发严峻。本文探讨了大数据隐私保护的重要性、面临的挑战及有效解决方案,旨在为企业和社会提供用户数据安全的指导。通过加强透明度、采用加密技术、实施数据最小化原则、加强访问控制、采用隐私保护技术和提升用户意识,共同推动大数据隐私保护的发展。
|
22天前
|
SQL 存储 大数据
大数据中数据提取
【10月更文挑战第19天】
48 2
|
1月前
|
NoSQL 大数据 测试技术
想从事大数据方向职场小白看过来, 数据方面的一些英文解释
想从事大数据方向职场小白看过来, 数据方面的一些英文解释
34 0