写一个echarts的小例子

一个echarts的小例子

首先要在echarts官网上找一个图

之后要改成

第一步 提供一个容器

<div id="main" style="width: 350px;height:300px;">
        <script src="../static/Echarts1.js"></script>
    </div>

第二步 建立一个js文件，我这个文件建立在src那个目录下

Echarts1.js

var chartData; //声明全局变量利用ajax赋值，方便给option赋值
        //利用ajax方法获取数据
        $.ajax({
            url:"/cx",
            async:false,   //ajax请求是同步还是异步，默认是异步，如果设置为同步,该方法必须是得到响应值做完响应的处理才会往下面执行
            success:function(data){


                chartData=eval(data);


            }
        });

使用jquery的ajax 去调取数据

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

        // 指定图表的配置项和数据
        var option = {

            title: {
                text: '统计报表'
            },
            tooltip: {},
            // legend: {
            //     data:['销量']
            // },
            xAxis: {
                data: ["累计确诊","累计治愈","境外输入","累计死亡"]
            },
            yAxis: {},
            series: [{
                name: '人数',
                type: 'bar',
                data: [chartData.lj_Diag.toString(),chartData.lj_cure.toString(),chartData.jwsr.toString(),chartData.dead.toString()]
            }]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);

把数据塞到data[ ] 里面就行