Echarts 中的散点图
作者:互联网
Echarts 中散点图的实现:
散点图可以帮助我们推断变量之间的相关性。 (根据散点图的分布)
1: 散点图的是实现步骤:
Echarts 最基本的代码结构:
引入js 文件, DOM 容器, 初始化对象, 设置option
2: x 轴 与 y 轴 的数据是二位数据即可。
3: 在图标类型:
在series 中设置类型为 type: scatter; (散点图)
xAis 和 yAis 的type 值都需要设置为 value;
4: x 轴 与y 轴 调整
将坐标轴都设置为 脱离 0 的比例;
--------------------------------------------------------------
1: 引入Echarts 文件
<script src="lib/echarts.min.js"></script>
2: 准备一个呈现图表盒子:
<div style="width: 600px; height: 400px"></div>
3: 初始化echarts 对象: 获取初始化对象
var mCharts = echarts.init(document.querySelector('div'));
4: var option = {
xAis: {
type: 'value',
scale: true // 脱离 0 缩放比
},
yAis: {
type: 'value',
scale: true // 脱离 0 缩放比
},
series: {
{
type: 'scattter';
data: axisData
}
}
}
------------------------------------------------------------------------
散点图常见的效果:
1: 常见效果 (气泡图效果)
a: 散点大小不同: symbolSize (控制散点的大小)
b: 三点颜色不同: itemStyle.color (控制散点颜色)
2: 涟漪动画效果:
设置类型: type ;
未完待续...
标签:散点图,value,散点,设置,type,Echarts 来源: https://blog.csdn.net/weixin_45677987/article/details/119356027