在这里,我正在使用highcharts库创建向下钻取的饼图,我已经使用click事件进行过滤,并使用了向上钻取来进行反向过滤,但是任何人都不能对我进行检查。.
这里分享了我的一些代码:
创建图表功能
createChart(chartData) {
this.chartData = chartData;
let currencySign = this.currencySign;
let options = {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'pie',
// backgroundColor: bgColor
},
title: {
text: '',
},
plotOptions: {
pie: {
series: {
borderWidth: 0,
dataLabels: {
enabled: true
}
},
cursor: 'pointer',
events: {}
}
},
series: [{
name: "Plant Types",
id: "plant_types",
data: chartData.series
}],
tooltip: {
formatter: function() {
let title = this.series.name;
if(title == 'Products') {
title += " ("+ this.point['rate_unit'] + ")";
}
let pointcolor = this.point.color;
let pointName = this.point.name;
let pointY = numeral(this.point.y).format('0,0');
let pointPercentage = numeral(this.point.percentage).format('0,0.00');
let pointTotal = numeral(this.point.total).format('0,0');
return '<span style="font-size:11px">'+title+'</span><br><span style="color:'+pointcolor+'">'+pointName+':</span> '+currencySign+'' + pointY +'<b>('+pointPercentage+'%)</b><br/>Total: '+currencySign+''+pointTotal;
}
},
drilldown: {
series: []
}
};
options['plotOptions']['pie']['events'] = this.chartClickHandler();
// set theme options if dark theme enabled.
if(this._localStorageService.getIsDarkTheme()) {
Highcharts['theme'] = this._chartThemeOptions.getSearchScreenDarkThemeOptions();
Highcharts.setOptions(Highcharts['theme']);
}
this.chart = new Chart(options);
}
事件处理程序方法
chartClickHandler() {
let clickObj = {
click: (e) => {
let userOptions = e.point.series.userOptions;
let key = "";
if(userOptions['id'] == "plant_types") {
this.chart.ref.showLoading('Loading Technologies...');
this.loadTechnologyByPlantType(e.point);
key = "plant_plant_type";
} else if (userOptions['id'] == "technologies") {
this.chart.ref.showLoading('Loading Prime Movers...');
this.loadPrimeMoversByTechnologies(e.point);
key = "generator_technology";
} else if (userOptions['id'] == 'prime_movers') {
let nameArr = (e.point.name).split(' - ');
let primeMoverCode = nameArr[0];
key = "prime_mover";
}
let filterData = {
type: key,
selectedValues: e.point.name
};
this.onSelectFilter.emit(filterData);
},
drillUp: (e) => {
console.log("revert event");
}
};
return clickObj;
}
如果未使用向上追溯事件进行还原,那么哪个事件用于还原任何建议?