donut chart custom title on hover
- Dominant language
- JavaScript
- Stars
- 9.3k
- Forks
- 1.4k
- Avg merge
- 6d 16h
- Merged PRs (30d)
- 1
Description
Hi,
My requirement is display short name on donut chart and on hover title display full length text which is present in mMinorNameFull array, tried alot of thing, same code as below for custom title on hover is working fine on bar chart but giving null as value of d in donut chart, please find below complete code :
`function LegislationWiseOP(Table) {
//var mData = [], mItem = [], mMinorIdData = [], mMinorIdItem = [], mTotalCnt = 0;//COmmented by Nadeem on 06Oct17
var mData = [], mItem = [], mMinorIdData = [], mMinorIdItem = [], mTotalCnt = 0, mMinorNameFull = [];//Added by Nadeem on 06Oct17
if (Table[0] == null)//Added by Nadeem on 29May17
mTotalCnt = 0;
else
mTotalCnt = Table[0].TotCnt;
$('#LegWiseOpenProcTotal').text(mTotalCnt);
for (var i = 0; i < Table.length; i++) {
mItem = [], mMinorIdItem = [];
mItem.push(Table[i].MinorName, Table[i].Perc);
mData.push(mItem);
//alert(Table[i].MinorNameFull);
mMinorNameFull.push(Table[i].MinorNameFull);//Added by Nadeem on 06Oct17
mMinorIdItem.push(id = Table[i].MinorName, value = Table[i].MinorId);
mMinorIdData.push(mMinorIdItem);
}
var chart = c3.generate({
bindto: '#chart2',
data: {
columns: mData,
type: 'donut',
onclick: function (d, i) {
for (var i = 0; i < mMinorIdData.length; i++) {
if (mMinorIdData[i][0] == d.id)
openRadWindow("LegWisePenProc", "", mMinorIdData[i][1], "", mMinorIdData[i][0], "");
}
},
//onmouseover: function (d, i) { console.log("onmouseover", mMinorNameFull, i); },
}
, tooltip: {
format: {
title: function (d) {
return mMinorNameFull[d]
}
}
}
,
color: {
pattern: ['#336799', '#01A3AE', '#80D1D5', '#FEE506', '#2C973D']
},
legend: {
position: 'right',
},
donut: {
title: ""
}
});
}`
Contributor guide
Assessment
This issue has not been assessed yet.