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

  • 相关阅读:
    爬虫相关
    进程、线程、协程
    经典排序算法详细介绍
    Pyhton学习-Python与中间件之Memcache(4)
    Python学习-Python操作数据库之MongoDB(2)
    Python学习-Python操作数据库之MySQL(1)
    人工智能安全(一)——初识人工智能
    Windows应急响应和系统加固(12)——SQL Server/MySQL/Oracle日志提取和安全分析
    Windows应急响应和系统加固(11)——Weblogic各类漏洞的日志分析和调查取证
    Windows应急响应和系统加固(10)——Nginx日志分析以及JBoss日志分析
  • 原文地址:https://www.cnblogs.com/ljysy/p/9211181.html
Copyright © 2011-2022 走看看