score:0
you tell the annotation plugin that it should link your annotation the an x scale with id: x-axis-1
but in your scales config you only specify 1 x axis with the id of: xaxes
.
so to get your annotation to work you need to change the either the id in the annotation or the id of your scale.
annotations: [
{
type: 'line',
scaleid: 'x', must match with correct id of x axis scale
scales: {
x: { // this is id of scale, must match with scaleid from annotation
grid: {
drawonchartarea: false,
drawticks: true,
padding: -10,
},
Source: stackoverflow.com
Related Query
- i can't create a line vertically with react annotation
- How can I create a horizontal scrolling Chart.js line chart with a locked y axis?
- Chart.js - Vertical crosshair (vertical annotation that moves with mouse) in line graph
- How create time line chat with selectable year dropdown
- React chart2js Line chart with multiple datasets overlapping
- Unable to create Stacked Grouped Bar Chart with chart.js / react-chartjs-2 in React
- Create Line Chart and populate with database information
- Chart.js - annotation Vertical line moves with mouse in Angular 6
- Html5 web page with chartjs: loading an external json file and create a line chart
- Chart.js - Plot line graph with X , Y coordinates
- create a multi line chart using Chart.js
- Can't change color line with chart.js
- line chart with {x, y} point data displays only 2 values
- Display line chart with connected dots using chartJS
- Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis
- Chart.js - line chart with two yAxis: "TypeError: yScale is undefined"
- Using Charts.js with react
- How to display Line Chart dataset point labels with Chart.js?
- How to create datasets dynamically for chart.js Line chart?
- Chart.js Mixed Bar and Line chart with different scales
- chart.js Line chart with different background colors for each section
- How do I draw a vertical line on a horizontal bar chart with ChartJS?
- How do I place a new line in a label with Chart.js?
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- Chart.js - Line charts with different colors for each border lines
- Chart.js: Line chart with partial dashed line
- Line graph with linear timescale in Chart.js
- Obtain max value of y axis of line chart rendered with Chart.js
- ChartJS - Line Chart with different size datasets
- Line chart with large number of labels on X axis
More Query from same tag
- Expression in data attribute for angular chart.js
- Chart.js 3.x custom positioners: cannot use them in TypeScript
- Chart.js Example Diagramm don't show
- In Chart.js, how do I hide certain axis labels from a stacked bar chart?
- Chartjs-plugin-zoom plugin does not change x axis labels
- How to use Utils from Chartjs on Django
- Changing size of the canvas makes it blurry
- How to pass values to a chart (chart.js / morris.js)
- How to perform an histogram with the following dictionary?
- Draw Line Chart Using Chart.js
- Is it possible to show labels for all lines?
- Replace chartjs data
- Date selection not happening with a click in chartjs in the context of vuejs
- Chart js doesn't show chart
- Chart.js (Stacked Bar chart) How to calculate total sum of labels in tooltips?
- Calculate Ideal Burndown
- loading json file to create chart
- PrimeNG pie chart randomly displays, and displays on change of resolution
- Chartjs force horizontal bar to start from the lowest value
- PrimeNg bar chart how to show a label for the y-axis
- Chartjs updating flask pandas table?
- Datalabels of Chart JS can not display full values
- How can I achieve displaying data points on chart but Dotted? Chart.js V3.7.0
- How create time line chat with selectable year dropdown
- create Chart using Chartjs and PHP
- Angular ng2-charts Radarchart compile error for startAngle
- Drawing images on top of graph doesn't work with ChartJS
- How do I persist the gridlines for ticks that are not displayed? [Chart.js]
- Chart.js is it possible to style the labels?
- How to create multi scale chart?