Echarts基本用法_动力节点Java学院整理

前端之家收集整理的这篇文章主要介绍了Echarts基本用法_动力节点Java学院整理前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

echarts太完美了:

1,开源软件,无私的为我们提供漂亮的图形界面;

2,使用简单,默默的为我们封装了重要的js,只要会引用就会使用echarts;

3,种类多,echarts为我们提供了各种图标,其中最具象征的就是地图了;

4,兼容性好,基于html5动画渲染超棒。

echarts官网提供了源码和说明文档,使用echarts需要先到官网下载需要的js源文件

官网上的demo中夹杂着很多我们用不到的东西,想使用饼状图就得从demo中把不用的去掉,劈植斩叶留下最原始的功能实现。这样毕竟比较费时,我就在裁剪后的代码中加以总结于是乎新的使用教程如下所示:

1,在简单的html中引入js文件

<Meta charset="utf-8"> Charts demo

<div id="picturePlace">

就是在html中添加一个div给定id,图表就会显示在div中。

3,模块导入js

<Meta charset="utf-8"> Charts demo

4,添加显示数据

<Meta charset="utf-8"> Charts demo

5,运行程序显示结果

以上是饼状图的实现步骤,柱状图散点图跟这个类似就是引用js时饼状图是pie,柱状图是bar,对应的option里面的数据不同,程序的架子是一样的。

原文链接:https://www.f2er.com/js/37228.html

猜你在找的JavaScript相关文章