Echarts

  • 用于制作数据统计图表，一个纯 Javascript 的图表库，快捷简便的生成统计图表。
  • 官网：https://www.echartsjs.com/

效果

html

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>ECharts</title>

	<!-- 引入 ECharts 文件 -->

    <script src="echarts.min.js"></script></script>

</head>

<body>

    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->

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

    <script type="text/javascript">

        // 基于准备好的dom，初始化echarts实例

        var myChart = echarts.init(document.getElementById('main'));

        // 指定图表的配置项和数据

        var option = {

            title: {

                text: 'ECharts 入门示例'

            },

            tooltip: {},

            legend: {

                data:['销量']

            },

            xAxis: {

                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]

            },

            yAxis: {},

            series: [{

                name: '销量',

                type: 'bar',

                data: [5, 20, 36, 10, 10, 20]

            }]

        };

        // 使用刚指定的配置项和数据显示图表。

        myChart.setOption(option);

    </script>

</body>

</html>

js统计图表插件 Echarts的更多相关文章

  1. 数据图表插件Echarts（一）

    一.引言 最近做一个智慧城市项目,项目中需要图表和报表进行数据分析,从网上找了很多,最后找到了百度开放的echarts,一个很强大的插件. 二.介绍 ECharts,缩写来自Enterprise Ch ...

  2. 数据图表插件echarts（二）

    前言 上一篇文章简单介绍了一下百度公司前端部门写的一个js插件echarts,这是一款很强大的图表插件,里面的地图控件也是很强大的,支持离线的使用,并且数据也是离线的,使用很方便.下面我就简单介绍一下 ...

  3. 百度开源插件echarts介绍及如何使用

    前言 如果你想要用较少的代码实现比较酷炫的数据统计表,echarts是值得你考虑的一种实现方式.官网提供了很多实例供参考:http://echarts.baidu.com/examples.html. ...

  4. 可能是史上最强大的js图表库——ECharts带你入门

    PS:之前的那篇博客Highcharts——让你的网页上图表画的飞起 ,评论中,花儿笑弯了腰 和 StanZhai 两位仁兄让我试试 ECharts ,去主页看到<Why ECharts ?&g ...

  5. Sublime Text 2 JS 格式化插件 JsFormat的配置使用

    (转自http://www.jb51.net/softjc/178401.html) 这里下载这插件包 https://github.com/jdc0589/JsFormat ,点油下角的zip就能下 ...

  6. 史上最强大的js图表库——ECharts带你入门(转)

    出处:http://www.cnblogs.com/zrtqsk/p/4019412.html PS:之前的那篇博客Highcharts——让你的网页上图表画的飞起 ,评论中,花儿笑弯了腰 和 Sta ...

  7. Django 的css和js压缩插件：django_compressor

    今天尝试了django_conpressor,一个在django框架中压缩css和js的插件,灰常有用 我把它加载在我的base的HTML template中,原来未经压缩的css和js是: < ...

  8. knob.js进度插件

    关于knob.js进度插件的使用 关于这个插件,妹的,第一次使用坑死爹了,各种不会,幸亏我有持之以恒的精神,最终还是让其臣服于我的胯下.... 1.  引入 head  部分添加knob.js,同时引 ...

  9. Sublime Text 2 JS 格式化插件 JsFormat

    这里下载这插件包 https://github.com/jdc0589/JsFormat ,点油下角的zip就能下载插件包放到sublime安装目录的DataPackages目录中重新打开sublim ...

随机推荐

  1. cocos2d-x 求相交矩阵

    cocos2d-x有推断矩阵相交的方法 CCRect::intersectsRect(CCRect& rect)但可惜没有提供求两个相交矩阵的方法,我作了总结,代码例如以下: CCRect T ...

  2. Bootstrap 过渡效果 transition.js源码分析

    前言: 阅读建议:去github下载一个完整dom然后把,本篇代码复制进去然后运行就好了以地址 Bootstrap 自带的 JavaScript 插件的动画效果几乎都是使用 CSS 过渡实现的,那么判 ...

  3. 蓝桥 PREV-30 历届试题 波动数列 【动态规划】

      历届试题 波动数列   时间限制:1.0s   内存限制:256.0MB      问题描述 观察这个数列: 1 3 0 2 -1 1 -2 ... 这个数列中后一项总是比前一项增加2或者减少3. ...

  4. 洛谷T51924 忘情

    二分上界有多大开多大 二分上界有多大开多大 二分上界有多大开多大 重要的事情说三遍 又被bright神仙带着做题了 先无脑上wqs二分 我们可以把这个柿子画一下,区间的花费就变成((sigema(l~ ...

  5. forceStopPackage与killBackgroundProcesses方法

    最近了解一键清理功能,需要实现强制关闭进程的功能.下面介绍下killBackgroundProcesses()方法和forceStopPackage()方法. killBackgroundProces ...

  6. P4460 [CQOI2018]解锁屏幕

    算是我比较擅长的类型,自己想想就会了.普通小状压,状态傻子都能想出来.一开始裸的枚举T了,30.后来与处理之后跑的飞起,就是不对,还是30分.后来看讨论版...mod竟然是1e8+7!!!这不有毒吗. ...

  7. python-----tuple用法

    有一种有序列表叫元组:tuple.tuple和list非常类似,但是tuple一旦初始化就不能修改,比如同样是列出同学的名字: >>> classmates = ('Michael' ...

  8. UVa10288 Coupons 分数模版

    UVa10288 题目非常简单, 答案就是 n/n+n/(n-1)+...+n/1; 要求分数输出.套用分数模板.. #include <cstdio> #include <cstr ...

  9. 配置文件git config介绍

    Git有一个工具被称为git config,它允许你获得和设置配置变量:这些变量可以控制Git的外观和操作的各个方面. 一. 配置文件的存储位置 这些变量可以被存储在三个不同的位置: 1./etc/g ...

  10. POJ 2452 Sticks Problem (暴力或者rmq+二分)

    题意:给你一组数a[n],求满足a[i] < a[k] < a[j] (i <= k <= j)的最大的 j - i . 析:在比赛时,我是暴力做的,虽然错了好多次,后来说理解 ...