score:1
Accepted answer
it should work as expected if you make the entry inside displayformats
the same as unit
.
displayformats: {
month: 'mm/yy'
}
please take a look at below runnable code and see how it works.
const now = new date();
const data = new array(100).fill().map((v, i) => {
const date = new date();
date.setdate(now.getdate() + i);
return { x: date.toisostring().substring(0, 10), y: math.floor(math.random() * 10) };
});
new chart('chart', {
type: 'line',
data: {
datasets: [{
label: "data",
bordercolor: "rgb(255, 0, 0)",
data: data,
fill: false
}
]
},
options: {
scales: {
yaxes: [{
ticks: {
beginatzero: true
}
}],
xaxes: [{
type: 'time',
time: {
parser: 'yyyy-mm-dd',
unit: 'month',
displayformats: {
month: 'mm/yy'
},
tooltipformat: 'dd/mm/yy'
}
}]
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.4/chart.bundle.js"></script>
<canvas id="chart" height="90"></canvas>
Source: stackoverflow.com
Related Query
- ChartJS - Scale x axis labels from single days to multiple months
- ChartJS (React) Line Chart - How to show single tooltip with data and labels from 3 (multiple) dataset?
- ChartJS multiple X axis and extra labels in y axis
- How do I add time sourced from an external source as an X axis to a ChartJS graph?
- chartjs dataset from single line to multiple line
- ChartJS New Lines '\n' in X axis Labels or Displaying More Information Around Chart or Tooltip with ChartJS V2
- How do I prevent the scale labels from being cut off in chartjs?
- Hide all scale labels in chartjs
- How to draw multiple line on y axis for same x axis in chartjs v2?
- ChartJS shows date, but not time, when displaying labels in time axis
- Chartjs not working with d3 from csv source
- How to prevent tick labels from "jumping" when drawn with ChartJS BeforeDraw
- How to remove x axis scale labels Chart.Js
- Hide labels from pie chart in chartjs
- How to set a time scale to a ChartJS chart from JSON?
- Chartjs React Typescript moving x axis labels above chart
- ChartJs days of the week from numbers
- Grouping y-axis labels on multiple lines on a ChartJS with an extra dimension
- ChartJS multiple sub labels for label
- ChartJS have xAxes labels match data source
- ChartJS - x axis labels orientation
- ChartJS - aligning axis labels after rotation
- ChartJs x axis labels on waterfall chart
- Add multiple lines as Y axis title in chartJs
- Getting clicked object from each section of a single stack bar as my stack bar has multiple sections Chart.js
- Calling data from outside of Chartjs code
- ChartJS - format datetime X axis when displaying data from MySql table
- ChartJs Uncaught ReferenceError for labels value from ViewBag
- Multiple Chart.js charts on a single page, from 1 function but different data
- How to set min Value a step down of min value received from database in Y Axis in ChartJS
More Query from same tag
- Not drawing null values using chart.js
- Chart.JS Global Options
- How to remove the inside-border from doughnut chart? Chart.js
- Streaming Real-time data with react and chartjs-plugin-streaming paused
- Displaying every nth label on the x-axis
- Is there a max width of canvas Chart.js can draw charts within?
- Rotate left legend chartjs
- Stacked bar chart starting from 0 - ChartJS React
- Beginner using chart.js: having trouble display state full of data into a column chart using variables
- Chart.js Undesired Tooltip Showing Up for Legend
- Chart.js - How to customize specific grid line depending on tick value
- ChartJS doughnut data toggle on custom button click
- EJS Tags with ChartJS?
- ChartJS changing displayed data based on dropdown selection
- How do you create rounded corners on the top and bottom of a bar chart and the between 2 part still draw like image?
- Grouping by month with series of epoch timestamps in Chart.js
- chartjs - edit or remove label
- ChartJS is slow
- i can't alias in Apache permission denied
- How to show labels above pie chart in chart.js
- updating a chart in chart.JS using a dropdown button
- ChartJS display legend
- How to / Orientation to build a specific type of chart using library chart.js
- ChartJS tooltip values aren't matching the data after updating multiple charts
- System.ArgumentException: Column 'COLUMN_NAME' does not belong to table
- Dashboard grid - Chart.JS and CSS- issue widening two small horizontal bar graphs - noob question
- Download Chart.js graph from view
- How to retrieve data from mysql to chart.js
- How to implement tooltip mode "single" in Chart.js 3?
- ChartJS: chart not show all data