score:0
you are looking for a library like chartjs-node-canvas or chartjs-node. these solutions render charts to png or other image formats.
here's what a chart render looks like in chartjs-node-canvas:
const { canvasrenderservice } = require('chartjs-node-canvas');
const width = 400; //px
const height = 400; //px
const canvasrenderservice = new canvasrenderservice(width, height, (chartjs) => { });
(async () => {
const configuration = {
// add your chart.js config here
};
const image = await canvasrenderservice.rendertobuffer(configuration);
const dataurl = await canvasrenderservice.rendertodataurl(configuration);
const stream = canvasrenderservice.rendertostream(configuration);
})();
you would still need to build your own web server. if you prefer a chart api that includes the rendering web server, you can use something like quickchart, which is an open-source project of mine that wraps chartjs-node-canvas and renders your chart.js charts.
in that case your code might look like this:
const quickchart = require('quickchart-js');
const mychart = new quickchart();
mychart
.setconfig({
type: 'bar',
data: { labels: ['hello world', 'foo bar'], datasets: [{ label: 'foo', data: [1, 2] }] },
})
.setwidth(800)
.setheight(400);
const chartimageurl = mychart.geturl();
// download the url...
Source: stackoverflow.com
Related Query
- Create a Graph and return it as an image on a nodejs server
- Create a rounded bar graph with Angular and chartJS
- How to create a bar and a line in a same graph using chart.js in React?
- Angular 6 ChartJS create canvas dynamically and create graph on it - an example?
- How to create rounded bar graph with Angular 7 and Chartjs (v2)
- How to save Chart JS charts as image without black background using blobs and filesaver?
- How can I create a time series line graph in chart.js?
- Chart.js with dual axis on bar and line graph
- Chart.js - Plot line graph with X , Y coordinates and connected by line
- Chartjs: How to create padding between ticks and scale label
- Take image of a chart.js from canvas and display it as an image
- How to create dynamic charts with Django and Chart.js?
- How to add ChartJS code in Html2Pdf to view image
- How to add padding between Graph and X/Y-Scale in chart.js?
- How to create a gantt chart using Chart.js and populate dates?
- Create Chart using Reactjs Chartjs and axios
- Is it possible to create a canvas to extract image data without actually rendering the canvas?
- How to create a stacked graph using ChartJS
- How to Create Chart.JS Bar Graph with Min, Max & Average
- Graph streaming real-time data with react and chartjs
- How to create a chart that uses strings for both the X and Y axes?
- Laravel PDF generation with Graph and send it with Email
- Meteor and ChartJS dynamically create a chart
- How do I correctly include Moment.js and Chart.js with RequireJS when I want to create charts with time scales?
- Angular2 and ng2-charts does not display any graph
- Create PDF with mpdf and chart.js
- Angular 2: How to pass my API data to graph and Display the Graph with data
- How to change fonts and axis labels for Chart.js image rendering with QuickChart?
- How to create a custom tooltip for chartJS graph with data in JSON array in JavaScript?
- How to create line graph use chartjs?
More Query from same tag
- How to add a chart with a table in Chart.js?
- Set Global Config on Angular Charts Not Working
- how to show multiple values in point hover using chart.js
- Set default line style in chart.js
- Using vue-charts.js, I cannot get hoverOffset to work with doughnut
- Fade other lines when hovering legend in Chart.js
- Creating a heart rate monitor
- Age pyramid chart using chart.js
- How to use date in x value for Object[] in chartjs dataset, I am getting an error: 'TS2322: Type 'string' is not assignable to type 'number'.'
- Charts.js does not render chart until I open the console
- How to add margin bottom in Tittle ChartJS
- Chart.js ng2-charts colors in pie chart not showing
- Draw vertical line on horizontalBar at value 2.0
- How to change tooltip direction in Chart.js (2.9.4)?
- Change the font size of chart.js with chartkick
- How do I get the current step size of a chartjs chart whose stepSize I have not defined?
- Chart.js: Display Custom Tooltips, always visible on stacked bar-chart
- Bar charts flickering issue in charts js
- How to set gradient in legend box color in Chart,js
- Is there a way to apply css on chart.js V3.7.0 tooltip without it being custom or external?
- Vertical Gird Line Issue with Chart.js
- Dynamic information in chart.js radar chart
- How to align labels at same side chartjs React
- Using a prepared dataset in chart.js
- Plot a Line chart using Chart.js with CSV Data
- Chart.js showing time (HH:MM:SS - 24 hour clock) on xAxis
- Chart.js not displaying when including variable
- Y-axis scale uneven
- I need help on Optimization of Laravel Controller
- Chart.js: Fixed horizontal location of vertical axis