zoukankan      html  css  js  c++  java
  • echarts引用的简单步骤

    首先导入echarts的包   <script src = "js/echarts.min.js"></script>

    <style>
       .box{                  
       300px;
       height:300px;
       background:lightgreen;
       }
    </style>
     <body >
     <div class="box"></div>      //设置一个div用来做放置图表的容器。
    <script>
    //1.echarts初始化。
    var myChart = echarts.init(document.querySelector(".box"));
    //2.设置图表配置项
    var option = {
       xAxis: {
              type: 'category',                                                         //该部分可从echarts官网来获得option内的代码。
              data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
          },
          yAxis: {
              type: 'value'
          },
          series: [{
              data: [120, 200, 150, 80, 70, 110, 130],
              type: 'bar',
              showBackground: true,
              backgroundStyle: {
                  color: 'rgba(220, 220, 220, 0.8)'
              }
          }]
    };
    myChart.setOption(option);         //配置
    </script>
     </body>

  • 相关阅读:
    树形视图和列表视图中的HitTest
    VC++中隐藏代码
    C++指针&引用简笔
    自动化流程学习笔记
    xampp for linux遇见的几个问题
    django用户验证模块核心
    win+r 快捷
    python 获取桌面路径
    我的linux常用操作
    个人悟出的一些观点
  • 原文地址:https://www.cnblogs.com/yangqqq/p/13353318.html
Copyright © 2011-2022 走看看