文字无法正确显示angular2

Question

我试图在angular2中绘制c3.js规格图，但规格值文字显示不正确。

我附上了图片。请帮忙找到错误。

c3gauge.component.html

<div  [style.width.px]="boxWidth" [style.height.px]="boxHeight">
    <div class='col-xs-12 rmpm boxBody text-center' [style.height.px]="boxBodyHeight" [style.width.px]="boxBodyWidth">
        <div #chart class="c3-chart" id="chart"></div>
    </div>
</div>

c3gauge.component.ts

public  margin = { top: 5, right: 5, bottom: 0, left: 5 };
  public  width = 300;
  public  height = 300;

ngOnInit() {
buildgaugeChart(jsonData)
}

buildgaugeChart(jsonData): any {
    console.log('building c3 gauge chart');

    this.boxWidth = this.width;
    this.boxHeight = this.height;
    this.boxTitleWidth = this.width;
    this.boxBodyHeight = this.height;
    this.boxBodyWidth = this.width;
    this.chartWidth = this.boxBodyWidth - this.margin.left - this.margin.right;
    this.chartHeight = this.boxBodyHeight - this.margin.top - this.margin.bottom;

   this.hpGaugeChart = c3.generate({

      color: {
        pattern: ['#F97600', '#FF0000', '#F6C600', '#60B044'], // the three color levels for the percentage values.
        threshold: {
          //            unit: 'value', // percentage is default
          //            max: 200, // 100 is default
          values: [30, 60, 90, 100]
        }
      },
      bindto: #chart,
      size: {
        width: this.chartWidth,
        height: this.chartHeight ,
      },

      data: {
    columns: [
        [ 'data', 91.4 ]
    ],
    type: 'gauge',
},
    });
  }