I am using the echarts.js library for pie charts,
I would like to make each slice in the pie hyperlink to another page.
Im using static data points for now, to test if it will work - and will update to dynamic data after.
Below is an example of pie1a - i would like T2, T2, T4 and N/A to reference their own pages. T2 = "http://localhost/T2.html".
//ECHART_PIE1a
var echartPie1a = echarts.init(document.getElementById('echart_pie1a'), theme);
echartPie1a.setOption({
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
x: 'right',
y: 'bottom',
data: ['T2', 'T3', 'T4', 'N/A']
},
calculable: true,
series: [{
name: '(TB)',
type: 'pie',
radius: '54%',
center: ['54%', '36%'],
data: [{
value: 438,
name: 'T2'
}, {
value: 1109,
name: 'T3'
}, {
value: 42,
name: 'T4'
}, {
value: 389,
name: 'N/A'
}]
}]
});
echartPie1a.setOption(option);
echartPie1a.on('click', function (params)
{window.open('' + encodeURIComponent(params.name) + '.html', '_self');
});
Seems to have done the trick.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With