【echarts】散点图+刷新

菜鸟的备忘录

于 2021-04-13 10:32:41 发布

阅读量454

点赞数

分类专栏：前端学习 html 文章标签： html 前端

本文链接：https://blog.csdn.net/hilary_front/article/details/115656386

版权

本文介绍如何使用Echarts创建散点图，并实现数据的动态刷新，适用于前端开发中实时数据展示的需求。

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

【echarts】散点图+刷新

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>effectScatter</title>
    <script src="https://cdn.jsdelivr.net/npm/echarts@4.9.0/dist/echarts.min.js"></script>
</head>
<body>

    <div id="main" style="width: 400px;height:400px;"></div>

    <script type="text/javascript">

        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'))

        function getRandomArr(n) {
            var arr = []
            for (var i = 0; i < n; i++) {
                var random = Math.floor(Math.random() * (999 - 100 + 1) + 100) //100-999的随机数
                arr.push({ coord: [], el