zoukankan      html  css  js  c++  java
  • 读书笔记四

    用echart画图:

    首先,要先导入echart的jar包,下载地址如下:http://echarts.baidu.com/,然后放入自己的项目中,做一个简单的图的代码如下:

    放在body中的代码:

    <div id="main2" style=" 400px;height:400px;float:left"></div>

    然后便是js中的代码:

     var myChart = echarts.init(document.getElementById('main2'));
     
     
      // 指定图表的配置项和数据
                 option2 = {
                        title : {
                            text: '行业注册数量',
                            
                        },
                        tooltip : {
                            trigger: 'axis'
                        },
                        legend: {
                            data:['数量']
                        },
                        toolbox: {
                            show : true,
                            feature : {
                                dataView : {show: true, readOnly: false},
                                magicType : {show: true, type: ['line', 'bar']},
                                restore : {show: true},
                                saveAsImage : {show: true}
                            }
                        },
                        calculable : true,
                        xAxis : [
                            {
                                type : 'category',
                                data : ["2016","207","2018"],
                            }
                        ],
                        yAxis : [
                            {
                                type : 'value'
                            }
                        ],
                        series : [
                            {
                                name:'数量',
                                type:'bar',
                                data:[1,2,3,],
                                markPoint : {
                                    data : [
                                        {type : 'max', name: '最大值'},
                                        {type : 'min', name: '最小值'}
                                    ]
                                },
                                markLine : {
                                    data : [
                                        {type : 'average', name: '平均值'}
                                    ]
                                }
                            }
       
                        ]
                    };

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

    以上便是所有的js代码,当然,前提是要导入下载的echart.js包,还有值得注意的是,必须将js放在body下边,因为在网页执行的时候会按照顺序来执行,如果放在body上边就会找不到。

  • 相关阅读:
    A problem occurred evaluating project ':'. > ASCII
    算法------买卖股票的最佳时机
    源码解析:解析掌阅X2C 框架
    Java 基础------16进制转2进制
    2018年年度总结,以及2019年规划
    算法-----三数之和等于0
    算法--------数组类---------总结
    算法------长度最小的子数组
    算法--------数组--------容纳最多的水
    算法--------数组------反转字符串中的元音字母
  • 原文地址:https://www.cnblogs.com/ljysy/p/9211181.html
Copyright © 2011-2022 走看看