Highcharts TypeScript, nhãn trục y

Question

Vui lòng tham khảo cuộc thảo luận Highcharts text labels for y-axis cách thiết lập nhãn trục y.

Tôi đã sử dụng https://github.com/borisyankov/DefinitelyTyped/blob/master/highcharts/highcharts.d.ts trong định nghĩa TypeScript của mình, nhưng tôi không thể tìm thấy cách xác định định dạng trục y.

Có ai từng thử trước đây không?

- Cập nhật -

mã JavaScript origianl tôi là

var yearChartOptions = { 
    yAxis: { 
     plotLines: [{ 
      label: { 
       formatter: function() { 
        return '$' + Highcharts.numberFormat(this.value/1000, 0) +'k '; 
       } 
      }, 
     }] 
    }, 
}; 

// Create the chart 
var yearChart = new Highcharts.Chart(yearChartOptions); 

Trong đoạn code tôi có một this.value đó là mỗi thanh (tôi đã sử dụng biểu đồ thanh) giá trị. Trong TypeScript (tôi chưa thay đổi để loại bỏ mảng).

var yearChartOptions: HighchartsOptions = {}; 
    yearChartOptions.chart = {}; 
    yearChartOptions.yAxis = []; 
    yearChartOptions.yAxis[0] = {}; 
    yearChartOptions.yAxis[0].plotLines = {}; 
    yearChartOptions.yAxis[0].plotLines.label = {}; 
    yearChartOptions.yAxis[0].plotLines.label.style.formatter(() => "$" + Highcharts.numberFormat(this.value/1000, 0) + "k "); 

    // Create the chart 
    var yearChart = new Highcharts.Chart(yearChartOptions); 

Đầu ra là

/* 
Compile Error. 
See error list for details 
D:/MyProject/Scripts/test.ts(36,56): The property 'formatter' does not exist on value of type 'HighchartsCSSObject' 
D:/MyProject/Scripts/test.ts(36,107): The property 'value' does not exist on value of type 'Dashboard' 
*/ 

Và nó sẽ không biên dịch.

Answer 1

Cập nhật - Definitely Typed Highcharts definition hiện có bản sửa lỗi của tôi, vì vậy bạn có thể tải xuống phiên bản mới nhất và hy vọng nó sẽ giải quyết được sự cố của bạn.

Định nghĩa loại cho Highcharts cho thấy bạn cần phải chuyển mảng amd tùy chọn sang yAxis. Điều này biên dịch trong TypeScript.

var chart = new Highcharts.Chart({ 
    yAxis: [{ 
     labels: { 
      formatter: function(): string { 
       return 'My Label'; 
      } 
     } 
    }] 
}); 

Tuy nhiên, tôi không chắc chắn điều này khớp với the documentation, which suggests you pass the yAxis options as an object, không phải là một mảng của nhiều đối tượng này. Điều này cũng có ý nghĩa từ quan điểm rằng bạn có một yAxis duy nhất.

Để đạt được những gì tôi tin là phiên bản có giá trị (tức là không mảng):

/// <reference path="highchart.d.ts" /> 

var yearChartOptions: HighchartsOptions = { 
    yAxis: { 
     plotLines: { 
      label: { 
       formatter: function(): string { 
        return '$' + Highcharts.numberFormat(this.value/1000, 0) + 'k '; 
       } 
      }, 
     } 
    } 
}; 


// Create the chart 
var yearChart = new Highcharts.Chart(yearChartOptions); 

Bạn có thể điều chỉnh highchart.d.ts bạn nộp ở đây ...

interface HighchartsOptions { 
    chart?: HighchartsChartOptions; 
    // others... 
    yAxis?: HighchartsAxisOptions; // <-- remove the [] from this line 
} 

Tôi đã gửi một yêu cầu kéo đến Definitely Typed để sửa lỗi này.

dụ Hoàn toàn làm việc dựa trên mã của bạn: