数据可视化技术基本组件83课件讲解.pptxVIP

数据可视化技术基本组件

设置网格组件设置坐标轴组件设置标题组件设置图例组件设置工具箱组件设置详情提示框组件设置标记点和标记线基本组件案例

设置网格组件

网格组件作用01网格组件常用配置项02操作演示03总结与思考04目录

01网格组件作用

网格组件作用准备工作1.获取Echarts.js文件。（1）直接从Echarts官网选择适合的版本下载（2）由CDN引入；无须下载文件（3）在Echarts的GitHub上下载最新版本2.在vscode中安装openinbrowser插件，右键选择edge浏览器打开。

grid的位置如下所示。我们通过配置grid组件，来调整图表在div容器里的位置，以及图表的背景样式。网格组件作用option={tooltip:{...},//提示框组件grid:{...},//要配置的网格组件xAxis:[{...}],//x轴yAxis:[{...}],//x轴series:[{...}]//你美丽的图表（数据和样式）}

单个grid内最多可以放置上下两个X轴，左右两个Y轴。可以在网格上绘制折线图，柱状图，散点图等。网格组件作用option={tooltip:{...},//提示框组件grid:{...},//要配置的网格组件x