c3js / c3js/c3

donut chart custom title on hover

Open
#2,224 2 comments 0 reactions 0 assignees View on GitHub
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

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.