使用Echarts制作散点图(Excel导入数据方式)

最新推荐文章于 2023-03-10 15:01:59 发布

weixin_34209851

最新推荐文章于 2023-03-10 15:01:59 发布

阅读量5.8k

点赞数 2

文章标签： javascript 数据库 python ViewUI

原文链接：https://my.oschina.net/u/1258323/blog/471910

版权

2019独角兽企业重金招聘Python工程师标准>>>

Echarts相当于一款JS插件，可以制作出绚丽多彩的图表，其支持制作的图表类型和可以使用的样式都非常丰富。本文以Echarts制作散点图为例，向大家展示该工具的实用性。

Echarts的使用门槛非常简单，但使用条件必须符合规则，在官网（http://echarts.baidu.com/）上下载开发包之后，自己准备一个项目主文件夹，在该文件夹新建一个js文件夹（名称自选），将开发包下的build文件夹下的dist文件夹拷贝到js文件夹下，便可以开始使用了。

Echarts的使用方式可以分为AMD模块化导入和单文件导入方式，本文介绍一种简单的单文件导入方式，首先准备好一个html文件，导入echarts.js文件即可。当然你还需要准备一个div控件用于安放图表位置，也可以认为是要为Echarts实例化的Dom对象，这里JavaScript代码也放在body标签下。

<!DOCTYPE html>
<head>    
    <meta charset="GBK"> 
    <title>Echarts of scatter</title>  
</head>
<body>
    <!--为Echarts准备一个大小为600*400的div-->
    <div id="main" style="width:600px;height:400px"></div> 
    <!--Echarts单文件导入-->     
    <script type="text/javascript" src="./js/dist/echarts.js"></script> 
</body>

至此，echarts文件已完成导入，在使用之前&