Echarts入门（二）| 散点图地图雷达图

最新推荐文章于 2025-05-09 10:45:03 发布

秃头崽崽

最新推荐文章于 2025-05-09 10:45:03 发布

阅读量2.1k

点赞数 1

分类专栏：数据可视化文章标签： js 数据可视化 python 大数据 Echarts

本文链接：https://blog.csdn.net/SartinL/article/details/106996502

版权

这里写目录标题

PS：所用数据纯属虚构

散点图

散点图是指在回归分析中，数据点在直角坐标系平面上的分布图，散点图表示因变量随自变量而变化的大致趋势，据此可以选择合适的函数对数据点进行拟合。

用两组数据构成多个坐标点，考察坐标点的分布，判断两变量之间是否存在某种关联或总结坐标点的分布模式。散点图将序列显示为一组点。值由点在图表中的位置表示。类别由图表中的不同标记表示。散点图通常用于比较跨类别的聚合数据。

参数含义：

series-scatter. symbolSize = 10

number Array Function

标记的大小，可以设置成诸如 10 这样单一的数字，也可以用数组分开表示宽和高，例如 [20, 10] 表示标记宽为20，高为10。

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="/static/js/echarts.min.js"></script>
    <!-- cdn -->
    <!-- <script src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js"></script> -->
</head>
<body>
    <div id="scatter" style="width: 600px; height: 400px;"></div>
    <script>
        var scatter_chart = echarts.init(document.getElementById("scatter"));
        var scatter_option = {
   
            title:{
   
                text:"Echart scatter 入门"
            },
            xAxis:{
   },
            yAxis:{
   },
            series:[{
   
                symbolSize:20,
                data:[
                    [10.0, 8.04],
                    [8.0, 6.95],
                    [13.0, 7.58],
                    [9.0, 8.81],
                    [11.0, 8.33],
                    [14.0, 9.96],
                    [6, 7.24],
                    [4.2, 4.62],
                    [12.0, 10.84],
                    [7.0, 4.82],
                    [5.0, 5.58],
                ],
                type:'scatter'
            }]
        };
        scatter_chart.setOption(scatter_option);
    </script>
</body>
</html>