score:0
david, this worked for me. are you sure you are passing the labels correctly on render (try date: datearray instead of date: (datearray)). i didn't create a render function for this page so hard coded the labels and data arrays:
script.
var labels = ['2022-05-01','2022-05-02','2022-05-03','2022-05-04','2022-05-05',]
var data = {
labels: labels,
datasets: [{
label: 'my first dataset',
backgroundcolor: 'rgb(255, 99, 132)',
bordercolor: 'rgb(255, 99, 132)',
data: ['4.00', '5.50', '3.00', '1.75', null],
}]
};
var config = {type: 'line',data: data,options: {}};
var mychart = new chart(document.getelementbyid("mychart"),config);
score:0
if i hardcode the labels in:
const xlabels = [#{date}]
instead of importing from page render, everything works fine. it's exactly that the point. the console.log
of datearray
is perfectly as i would like to be in the xlabels
, while once imported the quotes disappear
console.log(datearray); // ['2022-05-01','2022-05-02','2022-05-03','2022-05-04','2022-05-05']
const xlabels = [#{date}]; // [2022-05-01,2022-05-02,2022-05-03,2022-05-04,2022-05-05]
score:0
not best solution, but it works.... async function getdata()
var xlabel = '#{date}';
var xlabel = xlabel.replace(/"/g, '"');
alert(xlabel);
var xlabel = xlabel.split(",");
alert(xlabel);
for(i = 0; i < xlabel.length; i += 1){
xlabel[i] = xlabel[i];
//alert(numarray[i]);
xlabels.push(xlabel[i]);
}
Source: stackoverflow.com
Related Query
- node js mysql query result rendered to chart.js labels in pug page
- How do I display chart on my HTML page based on JSON data sent by Node JS
- How to print a chart rendered by code
- Limit labels number on Chart.js line chart
- Chart.js Show labels on Pie chart
- ChartJS New Lines '\n' in X axis Labels or Displaying More Information Around Chart or Tooltip with ChartJS V2
- chart.js: Show labels outside pie chart
- Chart.js how to show cursor pointer for labels & legends in line chart
- Chart JS data labels getting cut
- How to display Line Chart dataset point labels with Chart.js?
- Creating chart.js chart directly to PNG in Node js?
- Making the labels responsive in chart js
- Chart.js - Draw bar chart with multiple labels
- Show X axis on top and bottom in line chart rendered with Chart.js 2.4.0
- Adding Chart.js line chart to Jinja2/Flask html page from JS file
- Chart JS grouped sub labels
- Obtain max value of y axis of line chart rendered with Chart.js
- Display a limited number of labels only on X-Axis of Line Chart using Chart.js
- Changing x axis labels in Chart.js line chart
- How to display data labels outside in pie chart with lines in ionic
- Line chart with large number of labels on X axis
- Center point labels between ticks (Polar Area Chart JS)
- How to align Chart.JS line chart labels to the center
- How to access labels array using chart plugin (Chart.pluginService.register) in Chartjs 2.x?
- How to display the labels in doughnut chart using ng2 charts?
- Chart.js Bubble chart with custome X-axis labels
- Callback after line chart rendered
- chart.js - link to other page when click on specific section in chart
- Change labels colors for radar chart js
- ChartJS: Show all labels of a mixed chart in the tooltip
More Query from same tag
- Is it possible to add a javascript chart in a webview in Xamari.Forms
- ChartJS keeps adding one day to X axis. I cannot find a reason. Any suggestion?
- Chart.js - Scale of secondary y-axis?
- show multiple responsive chart in the same page using chart.js
- reactive chart with chart.js in meteor
- how to update chartjs2 option (scale.tick.max)
- Why does the horizontal bar size jump when resizing the chart?
- How to make integer scale in Chartjs
- Chart.js showing x-axis ticks even though set to false
- Cannot change the color of column chart according to its value
- Array value is not being passed to the plugin
- Chartjs : Y axis starting with highest datapoint
- Usage for angular-chart : colors and fonts
- Asp.net MVC and Chart js
- How can I fasten up the Chart.js graph generation from JQuery over PHP and mySQL?
- ChartJS get data from Controller
- Chart.js intersection not working without zero value on Y
- How to scale label size radar chart chart.js
- Chart.js multiple dataset issue: hovering over n-th point "hovers" over every dataset's n-th point
- How can I show Bootstrap modal when on click in individual bars in chart.js
- Resize Chart Independently From Legend in ChartJS for Canvas Download
- ChartJs doesn't work on a local downloaded page of Circular Gauge chart example
- how to display multiple sum with chart js and laravel?
- How to get percentage from data collected in ChartJS?
- Unwanted line chart ''shadow" using chart.js
- Chart.js: Reverse bar chart with regular bars (Bottom to top instead of top to bottom)
- How to set chart's percentageInnerCutout property with ng2-charts
- How to implement concentric doughnut charts in polymer 1.0 using Chart.js?
- canvas does not display proper width and height chart.js
- Chart.js Auto Fit Failing