score:9
here is how i solve it :
use google canvg It takes a URL to a SVG file or the text of an SVG file, parses it in JavaScript, and renders the result on a Canvas element.
render your chart svg to the canvas using
canvg(document.getElementById('canvas'),getSVG());
convert what you have in the canvas to image
var canvas = document.getElementById("canvas") ; var img = canvas.toDataURL("image/png"); //img is data:image/png;base64 img = img.replace('data:image/png;base64,', '');
render your image to a hidden field
$("hidden field").val(img) ;
to convert this string to byte array do
Dim imageFile() As Byte = Convert.FromBase64String(YOUR HIDDEN FIELD .Value)
UPDATE
get the highcharts SVG
- use the
chart.getSVG()
method
- or simply use
$(your svg).html()
score:1
You can directly get base64 from http://export.highcharts.com by passing required parameter in request.
let chartData = {
infile: CHART_DATA,
b64: true // Bool, set to true to get base64 back instead of binary.
width: 600,
constr : "Chart"
}
You can use below snippet to get base64
fetch("https://export.highcharts.com/", {
"headers": {
"content-type": "application/json",
},
"body": "{\"infile\":\"{\\n \\\"xAxis\\\": {\\n \\\"categories\\\": [\\n \\\"Jan\\\",\\n \\\"Feb\\\",\\n \\\"Mar\\\",\\n \\\"Apr\\\",\\n \\\"May\\\",\\n \\\"Jun\\\",\\n \\\"Jul\\\",\\n \\\"Aug\\\",\\n \\\"Sep\\\",\\n \\\"Oct\\\",\\n \\\"Nov\\\",\\n \\\"Dec\\\"\\n ]\\n },\\n \\\"series\\\": [\\n {\\n \\\"data\\\": [1,3,2,4],\\n \\\"type\\\": \\\"line\\\"\\n },\\n {\\n \\\"data\\\": [5,3,4,2],\\n \\\"type\\\":\\\"line\\\"\\n }\\n ]\\n}\\n\",\"width\":600,\"constr\":\"Chart\",\"b64\":true}",
"method": "POST",
"mode": "cors"
}).then(function(response) {
// The response is a Response instance.
return response.text();
}).then(function(data) {
console.log(data); // base64 data
}).catch(function(err) { console.log(err);})
score:3
First, see the highcharts
documentation on exporting files. This will give you the string to the image URL you want.
Exporting: http://www.highcharts.com/ref/#exporting
Use an HTTP request (with AJAX, for instance) to get the file binary content (jpg/png) and transfer it to a base64 encoding library like this one:
Base64: http://www.webtoolkit.info/javascript-base64.html
Enjoy and good luck!
Source: stackoverflow.com
Related Query
- Highcharts - export to base64
- Add Source to Highcharts Export CSV
- Highcharts SVG Export from Python Server Side Code
- Calling Highcharts export to jpeg but the source is https and exporting is http (security warnings issued by browser)
- Export Highcharts code from jsfiddle
- Export Highcharts to PDF (using javascript and local server - no internet connection)
- How to export the whole page or html content with Highcharts not just the chart?
- I can't make Highcharts phantomJs export server work
- Highcharts export chart exportSettings with svg file
- Highcharts add legend on export
- Highcharts - how to remove "Open in Highcharts Cloud" from the export menu
- Highcharts - add additional export options without losing default ones
- ASP.NET WebRequest to Highcharts export server
- Highcharts phantomjs export server can't parse json string
- Using PhantomJS to create HighCharts grahps server side for use in PDF creation (PHP) - results in exit code 11 from PHPs exec();
- Highcharts - Global configuration with common code and unique data & Headings
- Imported font and Highcharts JS export
- How to export CSV and XLS with external button in Highcharts
- HighCharts chart export (screenshot download) does not display Navigator graph
- Highcharts export charts as image on serverside with php
- Issues using highcharts node export server from ClojureScript - "0x03 error when performing chart generation"
- Multi-Line Title is not working when we export to PNG using CanVG - Highcharts
- Catching Highcharts Client Side Export response before it downloads
- HIghcharts export server hosting ph-batik
- Highcharts Export Server on AWS Lambda
- Is possible to export programmatically a highcharts chart?
- HighCharts Stock Chart error code 18
- Highcharts Export without internet
- export csv from highcharts
- highcharts export server js script error codes
More Query from same tag
- How to overwrite Highcharts credits default settings
- Highcharts downsampling - CSV
- Highsoft.Highstock .NET - How to update navigation on all charts with MVC
- Is it possible to use jQuery in wicked_pdf to render charts?
- Highcharts multiple charts drilldown
- Highchart bar scaling
- highcharts - need to auto scroll on x-axis on every 5 seconds with hide scroll bar
- Highchart, is it possible to have a 'for loop' inside 'series' section?
- highcharts datalabel text reversed
- xAxis order of R highcharter column plot
- HighStock with Django: help me render
- Highcharts polygon label
- Plot bar chart from top to bottom
- Stop Highchart when end of the Array element reached
- How to update new plotline values instead of removing and adding new ones in highcharts
- Using Highchart with Codeigniter
- Javascript setInterval/setTimeout not working when browser tab not focused
- Highcharts Zoom in Logarithmic Scale
- Highcharts 3d scatter click does not work
- Highcharts - Why is there extra spacing before the first column and after the last column?
- Refresh highchart after hiding bar data
- HighCharts - show last labels in xAxis
- How does highstock represent the amount of point that is bigger than screen resolution?
- Less Categories than Series on Highcharts
- How do I display multiple charts automatically with PHP and MYSQL?
- ReferenceError: HighCharts is not defined
- Which highstock options can I use to remove inbetween xAxis
- How do I detect a zoom event in highcharts?
- Highcharts grouped bar charts with multiple axes
- Combination of ohlc and line plot in highchart