1

我正在使用ng2charts基于chartjs的构建（我认为）。我想将我的 y 轴设置为从特定值开始。我怎样才能做到这一点？来自打字稿的动态会很棒，用 HTML 硬编码是可以接受的。

我的图表组件 html

<div>
  <div style="display: block">

    <canvas baseChart
            [datasets]="barChartData"
            [labels]="barChartLabel"
            [options]="barChartOptions"
            [legend]="barChartLegend"
            [chartType]="barChartType"
            (chartHover)="chartHovered($event)"
            (chartClick)="chartClicked($event)"></canvas>

    <div align="center">{{barChartTitle}}</div>
  </div>
</div>

我的组件打字稿

import { Component, Input, OnInit, NgZone, OnChanges, ViewChild } from '@angular/core';
import { BaseChartDirective } from 'ng2-charts/ng2-charts';
@Component({
  selector: 'app-bar-chart-demo',
  templateUrl: './bar-chart-demo.component.html',
  styleUrls: ['./bar-chart-demo.component.css'],
  inputs:['chartLabel', 'chartData', 'chartType', 'chartTitle', 'chartLarge']
})
export class BarChartDemoComponent{
  @ViewChild(BaseChartDirective) chart: BaseChartDirective;

  public barChartOptions:any = {
    scaleShowVerticalLines:false,
    responsive:true
  };

  //Labels
  public barChartLabel:string[];
  @Input() chartLabel:string[];

  //Type
  public barChartType:string;
  @Input() chartType:string;

  //Legend
  public barChartLegend:boolean = true;
  @Input() chartLegend:boolean;

  //Data
  public barChartData:any[];
   @Input() chartData:any[];

  //Title
  public barChartTitle:string;
  @Input() chartTitle:string;

  //Legend
  public barChartLarge:boolean = true;
  @Input() chartLarge:boolean;

  ngOnChanges(){

  }

  ngOnInit(){
    //Init the sub componenets
     this.barChartLabel=this.chartLabel;
     this.barChartData=this.chartData;
     this.barChartType=this.chartType;
     this.barChartTitle=this.chartTitle;
  }

  // events
  public chartClicked(e:any):void {
    //console.log(e);
  }

  }
4

1 回答 1

1

知道了。它在图表选项中......

  public barChartOptions:any = {
    scaleShowVerticalLines:false,
    responsive:true,
    scales: {
      yAxes: [{
        ticks: {
          beginAtZero: true
        }
      }]
    }
  };
于 2017-04-20T16:54:42.640 回答