score:1
Accepted answer
the problem isn't with display:flex
it is with:
html{
zoom: 90%;
}
this must mess with how chartjs calculates the datapoint position, if you remove the above code from your stylesheet then it will fix your problem.
i have created a fiddle to tidy up your sylesheet and demonstrate this working: https://jsfiddle.net/kopf7d0l/
score:1
you can inverse zoom in div chart
body{
zoom:90%;
}
.chart{
zoom:calc(1/0.9);
}
Source: stackoverflow.com
Related Query
- Chart.js mouseover tooltips appears when cursor in wrong position
- Why Chart.js's tooltip appears in wrong position when mouse hover?
- what is wrong with my code ? java script chart position
- Angular 7, chart.js even when chart replaced, remaining chart in background which appears sometimes when mouseover
- Changing cursor to pointer on Chart.js bar chart when hover (mousemove) event is disabled?
- Chart.js line chart tooltip shows wrong label when line doesn't start at first label
- ChartJS bar chart - trigger hover even when the cursor is outside of the bar
- cartjs tooltips displays in the wrong place on a chart
- Chart JS tooltip appears differently when set from script instead of html
- Chartjs bar chart appears empty when page loads
- why tooltip appears wrong in my chart JS?
- Charts with previous data appear when hovering the cursor over the chart in Chart.js
- Chartjs Bar Chart showing old data when hovering
- Moving vertical line when hovering over the chart using chart.js
- Chart.js how to show cursor pointer for labels & legends in line chart
- How to disable Chart JS tooltip when there is no value?
- How to change the cursor to a pointer when I hover over a bar in a ChartJS bar chart?
- ng2-charts customize data and whole html content of tooltip displayed when hovering on bar chart
- ChartJS: Draw vertical line at data point on chart on mouseover
- Remove the label and show only value in tooltips of a bar chart
- Uncaught TypeError: Chart is not a constructor when using Chart.js
- Map event position to y axis value in chartjs line chart
- Chart.js dataset controller 'null' when chart drawn
- chart.js - link to other page when click on specific section in chart
- Drawing line chart in chart.js placing dots only when value changes
- vue.js vue-chartjs chart not updating when chartData replaced, updated etc
- Handle X-axis label position in chart js
- Can I use a gradient in Chart.js without accessing the chart context when the chart is created?
- Chartjs tooltips disappear when calling Chart.update
- Custom data position on the doughnut chart in chart.js
More Query from same tag
- Automatically show 0 sales for the date which is not in database
- Vertical stacked bar chart using SharePoint List
- How to change axis font in PrimeFaces and Chart.js
- Cannot access variables defined in webpack after build from client
- Rails application using chart.js optins
- Dynamically updating Chart.js data in angular
- How can I build a vertical line without going through my dots on my line graph? (charts.js)
- Line chart not rendering data
- Changing chart data dynamically with C# from SQL database
- Enabling chartsJS bar chart to start on y axis
- Apply color only to lower part of Chart.js line chart
- Horizontal overlapping of bars, not whole graph
- How to make chart with chartjs.?
- chart resizing in ng2-google-charts
- Automatic update a ChartJs with SQL
- chart js label not showing
- build dynamic array for charts.js
- Combine Chart.js programmatic and legend based dataset toggling
- How do I add JSON Data into ChartJS
- How can I add background color of length bars in chart (chartJS)?
- Incorrect chart displayed using chart js
- Creating Chart.js using API data in react
- How to order tooltip values from the biggest to the smallest
- Charts.js - Need to remove the data value from the Tooltip
- Make chartjs re-render once
- onHover event is not triggering in chart.js
- How to make rectangle in chart.js
- In ChartJS how do you format the hover over label in a time series?
- Chart js scatter graph labels
- chart js bar chart add animation to change color