Notwithstanding Precautions, Misadventure

    @tiki.vn/tini-f2

    0.2.0 • Public • Published

    Tini F2

    Tini App component hỗ trợ vẽ biểu đồ sử dụng thư viện @antv/f2

    Cách sử dụng

    1. Cài đặt

    npm install @tiki.vn/tini-f2
    # or
    yarn install @tiki.vn/tini-f2

    2. Sử dụng

    pages/index/index.json
    {
      "usingComponents": {
        "tini-f2": "@tiki.vn/tini-f2/es/index"
      }
    }
    pages/column/index.txml
    <tini-f2
      chartId="chart-id"
      onDraw="handleDraw"
    />

    Các property của component:

    Props Kiểu dữ liệu Bắt buộc Mô tả
    chartId string x ID của chart, mỗi chart phải có một ID khác nhau.
    onDraw function x Ở đây ta sẽ configs UI cũng như nạp data để render chart. Bắt buộc return về chart.
    width number Chiều rộng của chart.
    height number Chiều cao của chart.
    pages/index/index.js
    Page({
      data: {
        chartData: [
          {
            date: '2020/02/01',
            value: 0
          },
          {
            date: '2020/02/02',
            value: 900
          },
          {
            date: '2020/02/03',
            value: 2300
          },
          {
            date: '2020/02/04',
            value: 800
          },
          {
            date: '2020/02/05',
            value: 1600
          },
          {
            date: '2020/02/06',
            value: 2900
          },
          {
            date: '2020/02/07',
            value: 3800
          }
        ]
      },
    
      handleDraw(chart) {
        chart.source(this.data.chartData, {
          date: {
            type: 'timeCat',
            mask: 'MM-DD'
          },
          value: {
            min: 0,
            tickCount: 5
          }
        });
    
        chart.tooltip({
          alwaysShow: true
        });
    
        chart.interval().position('date*value').color('#f00');
    
        chart.render();
    
        // Bắt buộc phải return về chart
        return chart;
      }
    });

    API

    Install

    npm i @tiki.vn/tini-f2

    DownloadsWeekly Downloads

    5

    Version

    0.2.0

    License

    ISC

    Unpacked Size

    506 kB

    Total Files

    7

    Last publish

    Collaborators

    • tri-tiki
    • anh.huynh5
    • huynguyen6tiki
    • nghoangvietvn
    • hungnguyentiki
    • kiennt-tiki
    • han.han