echarts

最新推荐文章于 2024-03-15 16:45:46 发布

m0_56381561

最新推荐文章于 2024-03-15 16:45:46 发布

阅读量275

点赞数

文章标签： echarts javascript ecmascript

本文链接：https://blog.csdn.net/m0_56381561/article/details/126471905

版权

本文详细介绍了Echarts的基本用法，包括如何初始化图表、配置样式以及绘制图表。同时，探讨了Echarts的特性，如拖拽重计算、数据视图和动态类型切换等。此外，针对echarts图表在div resize时的自适应问题，提出了利用echarts内置的resize函数解决的方法。

摘要由CSDN通过智能技术生成

echarts的基本用法

初始化类
Html里面创建一个id为box1的div，并初始化echarts绘图实例 var myChart = echarts.init(document.getElementById(‘box1’))

样式配置
title ：标题
tooltip ：鼠标悬停气泡
xAxis : 配置横轴类别，type类型为category类别
series：销量数据，data参数与横轴一一对应，如果想调样式，也可以简单调整，比如每个条形图的颜色可以通过函数进行数组返回渲染
渲染图展示表
myChart.setOption(option);

Echarts特性介绍

拖拽重计算数据视图，满足用户对数据的需求动态类型切换，尝试不同类型的图表展现值域漫游，聚焦到你所关心的数值上数据区域缩放，聚焦到你所关心的数值上多图联动，更友好的关联数据分析百搭时间轴，时间维度拓展大规模散点，展现大数据的魅力力导向布局，复杂关系网络的最美呈现动态数据的添加，实时展现数据的变化多维度图例开关，切换你所关心的数据系列多维度堆积图，展现更具内涵的统计图表商业BI,一些广泛应用的商务图表混搭，用最佳的组合方式展现你独特的数据高度个性化能力，释放你的创造力特效，吸引眼球的能力