无法在高亮图工具提示中检索系列对象的值

时间:2018-03-27 15:35:35

标签: angular highcharts

我正在尝试为whisker bloxplotchart highchart实现工具提示,并且无法在我的工具提示中检索该系列的值。工具提示中的插值对我来说很好看。 不确定我做错了什么?请在下面找到我的代码。

bloxplot组件

import { Component, Input } from '@angular/core';

@Component({
    selector: 'app-box-plot-chart',
    template: '<chart [options]="options" (load)="getInstance($event.context)"></chart>',
    styles: [`
        chart{
              display: block;
              width: 100% !important;
              padding:0;
        }
    `]
})
export class BoxPlotChartComponent {

    public options: any;
    chart: any;

    @Input() public series: any;
    @Input() public moduleName: string;

    constructor() {

        this.options = {

            chart: {
                type: 'boxplot'
            },
            title: {
                text: ''
            },
            legend: {
                enabled: false
            },
            credits: {
                enabled: false
            },
            yAxis: {
                title: {
                    text: ''
                }, plotLines: false
            },
            tooltip: {
                shared: true,
                useHTML: true,
                headerFormat: '<strong style="font-size:12px;color:{point.color}">{point.key}</strong><br><br><table>',
                pointFormat: '<tr><td>low : </td>' +
                                 '<td style="text-align: right"><b>{series.low} </b></td></tr>' +
                              '<tr><td>q1 : </td>' +
                                 '<td style="text-align: right"><b>{series.q1} </b></td></tr>' +
                               '<tr><td>median: </td>' +
                                 '<td style="text-align: right"><b>{series.median} </b></td></tr>' ,
                footerFormat: '</table>',
                valueDecimals: 0
            },
            series: []
        };
    }

    getInstance(chartInstance): void {
        this.chart = chartInstance;
        this.redraw();
    }


    ngOnChanges(data: any) {
        if (!data.series.currentValue || !this.chart) return;
        data.series.currentValue.map(s => {
            this.chart.addSeries(s);
        });
        this.chart.reflow();
    }

    redraw() {
        if (!this.chart) return;
        this.chart.addSeries(this.series);

        if(this.moduleName == 'npv')
            this.options.tooltip.valueDecimals = 0;
    }

}

这是我绑定的系列

 export interface BoxPlotSeriesData  {

        low: number;
        q1: number;
        median: number;
        q3: number;
        high: number;
        color: string;
        name: string;
    }

0 个答案:

没有答案