当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript c3.generate函数代码示例

本文整理汇总了TypeScript中c3.generate函数的典型用法代码示例。如果您正苦于以下问题:TypeScript generate函数的具体用法?TypeScript generate怎么用?TypeScript generate使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。


在下文中一共展示了generate函数的7个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: ngAfterViewInit

 ngAfterViewInit(){
   var chart = c3.generate({
       data: {
           // iris data from R
           columns: [
               ['data1', 30],
               ['data2', 120],
           ],
           type : 'pie',
           onclick: function (d, i) { console.log("onclick", d, i); },
           onmouseover: function (d, i) { console.log("onmouseover", d, i); },
           onmouseout: function (d, i) { console.log("onmouseout", d, i); }
       }
   });
   setTimeout(function () {
       chart.load({
           columns: [
               ["setosa", 0.2, 0.2, 0.2, 0.2, 0.2, 0.4, 0.3, 0.2, 0.2, 0.1, 0.2, 0.2, 0.1, 0.1, 0.2, 0.4, 0.4, 0.3, 0.3, 0.3, 0.2, 0.4, 0.2, 0.5, 0.2, 0.2, 0.4, 0.2, 0.2, 0.2, 0.2, 0.4, 0.1, 0.2, 0.2, 0.2, 0.2, 0.1, 0.2, 0.2, 0.3, 0.3, 0.2, 0.6, 0.4, 0.3, 0.2, 0.2, 0.2, 0.2],
               ["versicolor", 1.4, 1.5, 1.5, 1.3, 1.5, 1.3, 1.6, 1.0, 1.3, 1.4, 1.0, 1.5, 1.0, 1.4, 1.3, 1.4, 1.5, 1.0, 1.5, 1.1, 1.8, 1.3, 1.5, 1.2, 1.3, 1.4, 1.4, 1.7, 1.5, 1.0, 1.1, 1.0, 1.2, 1.6, 1.5, 1.6, 1.5, 1.3, 1.3, 1.3, 1.2, 1.4, 1.2, 1.0, 1.3, 1.2, 1.3, 1.3, 1.1, 1.3],
               ["virginica", 2.5, 1.9, 2.1, 1.8, 2.2, 2.1, 1.7, 1.8, 1.8, 2.5, 2.0, 1.9, 2.1, 2.0, 2.4, 2.3, 1.8, 2.2, 2.3, 1.5, 2.3, 2.0, 2.0, 1.8, 2.1, 1.8, 1.8, 1.8, 2.1, 1.6, 1.9, 2.0, 2.2, 1.5, 1.4, 2.3, 2.4, 1.8, 1.8, 2.1, 2.4, 2.3, 1.9, 2.3, 2.5, 2.3, 1.9, 2.0, 2.3, 1.8],
           ]
       });
   }, 1500);
   setTimeout(function () {
       chart.unload({
           ids: 'data1'
       });
       chart.unload({
           ids: 'data2'
       });
   }, 2500);
 }
开发者ID:abrjpyAlmbrand,项目名称:ionicv2-c3js,代码行数:32,代码来源:home.ts

示例2: generateChart

 private generateChart(gem: GemVersion[]) {
   this.chart = c3.generate({
     bindto: `#chart-${this.gemname}`,
     size: {
       height: 375,
     },
     data: {
       json: gem,
       keys: { value: ['number', 'downloads_count'] },
       x: 'number',
       labels: true,
       names: { downloads_count: 'downloads/version' }
     },
     axis: {
       x: {
         type: 'category',
         tick: { rotate: 90, multiline: false },
       }
     },
     grid: { y: { show: true } },
     line: { connectNull: true },
     area: { zerobased: false },
     bar:  { zerobased: false, width: { ratio: 0.4 } },
   });
 }
开发者ID:k-ta-yamada,项目名称:k-ta-yamada,代码行数:25,代码来源:rubygems-chart.component.ts

示例3: generateChart

export function generateChart(node){
  let chart = c3.generate(
  {
    bindto: node,
    data: {
      columns: []
    },
    zoom: {
      enabled: true,
      rescale: true
    },
  });
  return chart;
}
开发者ID:Islandman93,项目名称:NeuralNetLog,代码行数:14,代码来源:Events.ts

示例4: ngOnInit

  ngOnInit() {
    // c3のグラフを準備する。
    this.chart = c3.generate({
      bindto: '#chart',
      data: {
        columns: [
          ['diff_time'],
        ]
      },
      axis: { x: { type: 'category' } }
      // transition: { duration: 100 }
    });
    // リプレイ用のc3のグラフを準備する。
    this.chartReplay = c3.generate({
      bindto: '#chartreplay',
      data: { columns: [['diff_time']] },
      axis: { x: { type: 'category' } },
    });


    this.service.SC.initializeWatchingSubscriptionsBeforeRegisterOnInit(this.cd); // 登録済みの変更監視Subscriptionを全て破棄する。
    this.registerWatchingSubscriptionsAfterInitializeOnInit(); // ページ遷移入の度に変更監視Subscriptionを登録する。
  }
开发者ID:ovrmrw,项目名称:shuttle-store-sample,代码行数:23,代码来源:page4.component.ts

示例5: constructor

    constructor(bindTo: string, used: number, max: number) {
        this.chart = c3.generate({
            bindto: bindTo,
            size: {
                width: 220,
                height: 220
            },
            data: {
                columns: [["Used", used], ["Free", max]],
                type: "donut"
            },
            donut: {
                title: "Memory"
            }

        });
    }
开发者ID:infinispan,项目名称:infinispan-management-console,代码行数:17,代码来源:MemoryChart.ts

示例6: ngAfterViewInit

    ngAfterViewInit(){
      this.drawThermometer(80, 180, 500, 50, 220, 100, "#thermo1");
      this.drawThermometer(80, 180, 500, 50, 350, 100, "#thermo2");

      //this.redrawThermometer(80, 180, 500, 50, 120, 100, "#thermo1");
      //this.redrawThermometer(80, 180, 500, 50, 450, 100, "#thermo2");

      var chart = c3.generate({
        data: {
          x: 'x',
          // xFormat: '%Y%m%d', // 'xFormat' can be used as custom format of 'x'
          columns: [
            ['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06', '2013-01-07', '2013-01-08'],
            ['inferior', 30, 200, 100, 400, 150, 250, 300, 250] //,
            //['data2', 130, 340, 200, 500, 250, 350]
          ],
          types: {
            inferior: 'area-spline'//,
            //data2: 'area-spline'
          },
          colors: {
            inferior: '#7df538'
          }
        },
        size: {
          height: 200,
          width: 350
        },
        axis: {
          x: {
            type: 'timeseries',
            tick: {
                //format: '%Y-%m-%d'
                rotate: 90,
                format: '%Y-%m-%d'
                //format: function (x) { return x.getFullYear(); }
            },
            height: 80
          },
          y: {
            //max: .1,
            //min: 0,
            padding: { top: 10, bottom: 0, left:0, rigth:0 }
          }

        }
      });

      setTimeout(function () {
        //this.redrawThermometer(80, 180, 500, 50, 120, 100, "#thermo1");
        //this.redrawThermometer(80, 180, 500, 50, 450, 100, "#thermo2");
        chart.load({
          columns: [
            ['superior', 400, 500, 450, 700, 600, 500, 450, 550]
          ],
          types: {
            superior: 'area-spline'
          },
          colors: {
            superior: '#f5387d'
          }
        });
      }, 1000);
    }  
开发者ID:adomenech73,项目名称:FirePrevent_app,代码行数:64,代码来源:dashboard.ts

示例7: makeGraph

  private makeGraph(data: any): void {
    /*
       Create the y axis values since c3 likes to use decimals
       when creating tick marks
    */
    let miny = Math.min(...data[1].slice(1));
    let maxy = Math.max(...data[1].slice(1));
    let yvalues = [];
    for ( var i = miny; i <= maxy; i++ ){
      yvalues.push(i);
    }

    this.graph = generate({
      bindto: '#boardgames-chart',
      padding: {
        left: 20,
        right: 15,
        top: 10
      },
      data: {
        x: 'x',
        columns: data,
        type: 'area'
      },
      grid: {
        y: {
          show: true
        }
      },
      legend: {
        show: false
      },
      tooltip: {
        show: false
      },
      point: {
        show: false
      },
      axis: {
        x: {
          type: 'timeseries',
          tick: {
            format: '%b %e'
          },
          padding: {
            left: 0,
            right: 0
          }
        },
        y: {
          tick: {
            count: 4,
            values: yvalues
          },
          min: 0,
          padding: {
            bottom: 0,
            top: 0
          }
        }
      },
      size: {
        width: 768,
        height: 188
      }
    });
  }
开发者ID:seanlw,项目名称:status-board,代码行数:67,代码来源:boardgames.component.ts


注:本文中的c3.generate函数示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。