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上边就会找不到。

  • 相关阅读:
    collection系列用法-defaultdict()
    collection系列用法-namedtuple()
    collection系列用法-deque双向队列
    Python 拷贝对象(深拷贝deepcopy与浅拷贝copy)
    python 【第四篇】:面向对象(一)
    python之lambda表达式
    python 【第三篇】:函数及参数
    LeetCode 648. Replace Words (单词替换)
    LeetCode 953. Verifying an Alien Dictionary (验证外星语词典)
    LeetCode 970. Powerful Integers (强整数)
  • 原文地址:https://www.cnblogs.com/ljysy/p/9211181.html
Copyright © 2011-2022 走看看