zoukankan      html  css  js  c++  java
  • ionic3使用echarts

    1.安装typings及echarts

    npm install typings echarts --global

    2.安装 ECharts 的 TypeScript 定义文件

    npm install @types/echarts --save

    3.在使用echarts的页面ts文件中引用echarts

    import * as echarts from 'echarts'; 

    4.在html页面添加div

    <ion-content> 
        <div id="chart"></div> 
    </ion-content> 

    5.在scss中配置样式

    page-home { 
        #chart { 
            position: absolute;
             100%; 
            height: 100%; 
        }
    } 

    6.在ts文件中初始化

    ionViewDidEnter() {
        const ec = echarts as any;
        const container = document.getElementById('chart');
        const chart = ec.init(container);
        chart.setOption({
          series: {
            type: 'pie',
            data: [{
              name: 'A', value: 10
            }, {
              name: 'B', value: 20
            }, {
              name: 'C', value: 30
            }]
          }
        });
      }
  • 相关阅读:
    Christmas Jump(k_push)
    cloudyarn(k_push)
    Eye sketch
    Candy Treasure Box
    Active Ball
    Lotus words
    Super Fish
    [POJ2436] Disease Management
    [bzoj3376] Cube Stacking 方块游戏
    [POJ3009] Curling 2.0
  • 原文地址:https://www.cnblogs.com/smartsensor/p/8126125.html
Copyright © 2011-2022 走看看