Я использую функцию «handleLegendClick» ниже, чтобы скрыть оставшуюся часть серии при нажатии на одну из легенды, но я не уверен, как вызвать это событие в amcharts 4.
в amcharts 3 раньше было так:
"легенда": {
"clickMarker": handleLegendClick,
, которая вызывает функцию ниже.
</p>
<pre><code>am4core.useTheme(am4themes_animated);
// Themes end
// Create chart instance
var chart = am4core.create("chartdiv", am4charts.XYChart);
// Add data
chart.data = [ {
"year": "2003",
"europe": 2.5,
"namerica": 2.5,
"asia": 2.1,
"lamerica": 1.2,
"meast": 0.2,
"africa": 0.1
}, {
"year": "2004",
"europe": 2.6,
"namerica": 2.7,
"asia": 2.2,
"lamerica": 1.3,
"meast": 0.3,
"africa": 0.1
}, {
"year": "2005",
"europe": 2.8,
"namerica": 2.9,
"asia": 2.4,
"lamerica": 1.4,
"meast": 0.3,
"africa": 0.1
} ];
// Create axes
//chart.legend.horizontalGap=10;
var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
categoryAxis.dataFields.category = "year";
categoryAxis.title.text = "Local country offices";
categoryAxis.renderer.grid.template.location = 0;
categoryAxis.renderer.minGridDistance = 20;
categoryAxis.renderer.cellStartLocation = 0.1;
categoryAxis.renderer.cellEndLocation = 0.9;
var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.min = 0;
valueAxis.title.text = "Expenditure (M)";
// Create series
function createSeries(field, name, stacked, hidden) {
var series = chart.series.push(new am4charts.ColumnSeries());
series.dataFields.valueY = field;
series.dataFields.categoryX = "year";
series.name = name;
series.columns.template.tooltipText = "{name}: [bold]{valueY}[/]";
series.stacked = stacked;
series.columns.template.width = am4core.percent(95);
series.hidden = hidden;
}
createSeries("europe", "Europe", true, false);
createSeries("namerica", "North America", true, true);
createSeries("asia", "Asia", true, true);
createSeries("lamerica", "Latin America", true, true);
createSeries("meast", "Middle East", true, true);
createSeries("africa", "Africa", true, true);
// Add legend
chart.legend = new am4charts.Legend();
function handleLegendClick( graph ) {
var chart = graph.chart;
for( var i = 0; i < chart.graphs.length; i++ ) {
if ( graph.id == chart.graphs[i].id )
chart.showGraph(chart.graphs[i]);
else
chart.hideGraph(chart.graphs[i]);
}
// return false so that default action is canceled
return false;
}
Я использую:
series.hidden = скрыто;
для установки значения true или false.
но мне нужно знать, какой слушатель будет использоваться здесь.