score:2
i checked in the internet and there is a simple hack to do this, why i use the hack is because if i set the y-axis to date, the graph does not get rendered and throws an error.
please find below the configuration used to achieve date y-axis.
var options = {
scaleoverride: true,
scalesteps: 8,
scalestepwidth: 1800,
scalestartvalue: 0,
responsive: true,
maintainaspectratio: false,
scalelabel: function(valuepayload) {
console.log(new date(valuepayload.value * 1000).toisostring());
return new date(valuepayload.value * 1000).toisostring().substr(12, 7);
},
multitooltiptemplate: function(valuepayload) {
return valuepayload.datasetlabel + " " + new date(valuepayload.value * 1000).toisostring().substr(12, 7)
},
title: {
display: false,
text: 'stat 1'
}
};
var ctx = document.getelementbyid("canvas").getcontext("2d");
window.myline = new chart(ctx).line(data, options);
the below issue on github contains nifty method to achieve time axis on y-axis.
github issue: here
the below fiddle contains the modified code, where the date y-axis is visible,
jsfiddle: here
Source: stackoverflow.com
Related Query
- chart js - bar chart with time scale on Y axis in Hours and Minutes
- Chart.js bar chart with time on X axis and category on Y axis is not rendered
- Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis
- Chart with Time axis only displaying first grid line and tick label (unitStepSize)
- Adding hours and minutes to a date object for time axis
- ChartJS Bar chart with time scale - Bars overlap with each other
- How to prevent first/last bars from being cut off in a chart with time scale
- Chart.js Mixed Bar and Line chart with different scales
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- Chart.js Dynamically Updating Chart with X Axis Time
- Category scale on Y-axis and time on x-axis in bubble chart in Chartjs
- How to hide the y axis and x axis line and label in my bar chart for chart.js
- Chart.js with dual axis on bar and line graph
- to increase space between x axis and first horizontal bar in chart js
- Issue while plotting bar chart with custom x-axis with month and year in chart.js
- Chart.js Date and Time Bar Chart Not Rendering - Line Works Though
- How to get chart from data points (arrays) with inconsistent time intervals and chart.js?
- Chartjs 3.x - How to duplicate X axis on both sides of horizontal bar chart with only 1 dataset?
- Bar chart with min height and zero values - ChartJs
- chart.js wide bar with time scale
- How to use chart.js to plot line chart with x axis as time stamp in seconds
- Chart.js combined line and bar chart with differing data points
- Time chart labels with some X axis labels using Chart js v3
- date and time chart With Chart js
- how to write labels along with data on top and bottom of each stack in bar chart
- ChartJS - would like to create a mixed chart with horizontal Bar and a dot to represent the answer from the current user
- How to add custom text inside the bar and how to reduce the step size in y axis in chart js( Bar chart )
- hereChartJS Line Chart with Time Axis
- I am using chart js to draw a chart. I did everything right but i don't know why the x axis and y axis label is not comming in chart. code below
- ChartJs line chart time cartesian axis number of ticks and wierd offset
More Query from same tag
- Chart.js disappears on Android
- Chart.js . ASP . Legend Template
- PrimeFaces: ChartJs stacked bar chart label removal
- Change `font-family` in Angular Chart.js
- Error: $injector:modulerr Module Error - chart.js
- How to display legend in toolbox in Charts.js?
- Add bar chart in a column
- I want to use an object to help create a chart with Chartjs
- ChartJS V3 Radar chart Label Font Size
- Remove additional white space on left and right side of Angular Chart
- Error: "barWithErrorBars" is not a chart type. Vue - chartjs-chart-error-bars
- Angular 5, Chart.js displaying multiple charts, one on each tab
- Data Labels are getting cut off on the top
- React Chartjs 2 display axes above datasets backgroundColor
- how to only show zero grid axes at center and hide all other gridlines in chart js
- Chart.js not showing when i try to format dates
- Chartjs: How to create padding between ticks and scale label
- Remove gridlines in AngularCharts
- How to properly render Chartjs with big difference between bars data?
- How to show labels above pie chart in chart.js
- build dynamic array for charts.js
- Chart JS dynamic chart
- ChartJs line chart - display permanent icon above some data points with text on hover
- Chart.js not showing dynamically populated data
- How to make bar charts and scatter dots appear underneath each other?
- Load Chart.js tooltip information asynchronously
- Chart.js zoom start at zoomed in
- Chart.js doughnut text colors
- Annotation plugin not working with Chart.js 2.8.0
- Chart.js how to change point radius of scatter charts on resize events?