score:10
Accepted answer
references:
chartjs docs: tooltip configuration - interaction modes
mode : index - finds item at the same index. if the intersect setting is true, the first intersecting item is used to determine the index in the data. if intersect false the nearest item is used to determine the index.
update the chart options to include the tooltips configurations. set the mode
to index
tooltips : {
mode : 'index'
},
the updated options would look like this.
const chart_options = {
tooltips : {
mode : 'index'
},
scales:
{
xaxes: [{
ticks: {
display: false,
},
}],
yaxes: [
{
type: 'linear',
id: 'y-axis-0',
display: false,
position: 'left',
},
{
type: 'linear',
id: 'y-axis-1',
display: false,
position: 'right',
},
],
},
};
check updated sample which include tooltips mode set to index
Source: stackoverflow.com
Related Query
- Is it possible to combine two Y axes into a single tooltip with ChartJS 2?
- ChartJS (React) Line Chart - How to show single tooltip with data and labels from 3 (multiple) dataset?
- How do I display two datasets on a single chart with chartjs
- Combine two line charts into one in ChartJS
- ChartJS New Lines '\n' in X axis Labels or Displaying More Information Around Chart or Tooltip with ChartJS V2
- Draw two plots using chartjs over one another with transparency
- Chartjs extended doughnut with text tooltip issue
- Chartjs - Insert additional data into chart tooltip
- ChartJS - how to display line chart with single element as a line? (not as a dot)
- ChartJS - Custom tooltip with icon
- Chartjs with multiple y axes and different scales
- ChartJS - Adding legend title into tooltip title
- how to set color for each item in tooltip with ChartJS
- Chartjs with zoom plugin zooms too much with wheel just with single turn
- How to combine lines with different starting points in chartjs
- Chartjs not working with d3 from csv source
- How to create a custom tooltip for chartJS graph with data in JSON array in JavaScript?
- ChartJs - Is is possible to show only tooltip in one dataset?
- Chartjs - Tooltip with Rupee Symbol
- Display a single tooltip with Chart.JS?
- Working with multiple date axes in ChartJS
- Chart.js two y axes line chart tooltip value incorrect for 2nd y axis
- Possible to create quadrant chart with ChartJS, with the "origin" centered at a single point?
- Chart.js - loading multiple charts with draggable datapoints into a single HTML Page
- Connecting Two Datasets in Chart.js Into a Single Line
- Updating Chartjs to 2.5 with custom code
- Is there a way to insert multiple lines, with labels, dynamically, into a ChartJS Line chart?
- How to set Custom tooltip event with Chartjs version 2.X
- Two data sets with different time instances on the same ChartJs chart
- Chart.js - combine data and label into a single object
More Query from same tag
- Chart.js Show labels on Pie chart
- Horizontal bar with multiple sections in ChartJs
- Chart.js - displaying multiple line charts using multiple labels
- Send data from a form to another component of the same level -angular
- How to pass a fetched object from App.js to a child component asynchronously in ReactJS v16+
- Chart.js 2.x - How to get handle of only clicked datapoint?
- Why is Chart.JS linking my start and end nodes in the line chart?
- Bootstrap > Extend ChartJS canvas horizontally to match overflowing columns
- Hide x-Axis from angularjs-chartjs
- how to put a second pie chart right next to first pie chart inside the bootstrap card
- ChartJS different background gradient depending on data (line graph)
- How to pass an array to chart.js data:[] while creating a chart in php
- Angular js install external library failed to instantiate module npm
- How to dynamically use chartjs-plugin-annotation with ng2-charts?
- Django and ChartJS
- Chart.js lost its colors
- Chart.js creating a line graph using dates
- Convert a dynamic piechart from CanvasJS to Google Charts?
- Add padding between two y-axis scales using chart.js
- Syntax error : Cannot use import statement outside a module in Vue2 chart js
- Change 'points' on a line chart to donuts using Chart.js
- NODEJS API: How to render .pug and send a AJAX response at same time?
- How to map json array to two different array for chart
- Using JSON in Chart.js with Angular.js
- ChartJS: Is this horizontal stacked bar and line graph multiaxis chart even possible?
- "<%=value%>" in javascript not ASP.net
- ChartJS remove vertical grid lines one on two
- Include Percentage In Legend
- Destroy chart.js bar graph to redraw other graph in same <canvas>
- Chart.js vertical line when hovering and shadow on line