-
-
Notifications
You must be signed in to change notification settings - Fork 2.5k
-
using the bar chart i'm trying to get the label value of the bar which is clicked. I've looked at the docs on chart.js and they have this method:
function clickHandler(evt) {
const points = myChart.getElementsAtEventForMode(evt, 'nearest', { intersect: true }, true);
if (points.length) {
const firstPoint = points[0];
var label = myChart.data.labels[firstPoint.index];
var value = myChart.data.datasets[firstPoint.datasetIndex].data[firstPoint.index];
}
}
and as an option on CChart i can pass an on click event as a option, but i'm struggling to get the value.
<CChart
type="bar"
height={120}
data={{
labels: dispatchDate,
datasets: [
{
label: 'Number of Products',
backgroundColor: 'blue',
data: numberOfProducts,
},
],
}}
options=
{{
onClick: (e) => {
const points = this.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true);
if (points.length) {
const firstPoint = points[0];
var label = myChart.data.labels[firstPoint.index];
var value = myChart.data.datasets[firstPoint.datasetIndex].data[firstPoint.index];
console.log(label);
}
}
}}
/>
Beta Was this translation helpful? Give feedback.
All reactions
-
👍 1
Answered by
cooperRjp
Jan 20, 2022
Just worked it out, here is the code if you are looking to do the same.
<CChart
type="bar"
height={120}
data={{
labels: dispatchDate,
datasets: [
{
label: 'Number of Products',
backgroundColor: 'blue',
data: numberOfProducts,
},
],
}}
options=
{{
onClick: (e) => {
var points = e.chart.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true)
if (points.length) {
const firstPoint = points[0];
var label = e.chart.data.labels[firstPoint.index];
var value = e.chart.data.datasets[f...Replies: 1 comment
-
Just worked it out, here is the code if you are looking to do the same.
<CChart
type="bar"
height={120}
data={{
labels: dispatchDate,
datasets: [
{
label: 'Number of Products',
backgroundColor: 'blue',
data: numberOfProducts,
},
],
}}
options=
{{
onClick: (e) => {
var points = e.chart.getElementsAtEventForMode(e, 'nearest', { intersect: true }, true)
if (points.length) {
const firstPoint = points[0];
var label = e.chart.data.labels[firstPoint.index];
var value = e.chart.data.datasets[firstPoint.datasetIndex].data[firstPoint.index];
}
console.log(label);
}
}}
/>
Beta Was this translation helpful? Give feedback.
All reactions
-
👍 3
0 replies
Answer selected by
mrholek
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment