基于Echarts的图表绘制

我们在做管理平台的时候，难免会做各式各样的可视化图表，当前市场上已经有很多开发好的js框架，我们今天来学习echart.js绘图。
首先将下载好的echart.js放入目录

然后在我们的前端页面style模块导入echart.js

接下来就是开始绘图了，绘图的主要代码

{% extends "blank.html" %}  //这里是我们继承的基础模板，这个是我们项目开发时需要做一个base页面用来代表大多数共同属性和方法

{% block title %}
    EchartsExample
{% endblock %}

{% block style %}
    
{% endblock %}

{% block label %}
    EchartsExample
{% endblock %}

{% block content %}
//设置一个画布

    


    
		//开始在画布上作图
    
{% endblock %}

echarts 需要定义画布，而且选择器最好用js
echarts主要有以下几种类型
1、bar 柱状图
2、line 折线图
3、gauge 仪表盘
4、pie 饼状图
5、island 孤岛图
6、funnel 漏斗图

bar柱状图效果如下：

funnel漏斗图效果如下：

还有更多的设置与方法等着你去发现！