Статус: я могу просто создать SVG с Node JS + Highcharts 6.2.
Проблема: экспортированный SVG не выглядит хорошо, не так, как если бы я экспортировал его из образца JSFiddle https://jsfiddle.net/9gx7u4nw/
JSFiddle: https://jsfiddle.net/9gx7u4nw/
Код узла JS:
var jsdom = require('jsdom'),
fs = require('fs');
jsdom.env({
html: '',
scripts: [
"/opt/dlins/node-v6.3.0-linux-x64/bin/libs/jquery-3.3.1.min.js"
],
done: function (err, window) {
var $ = window.$;
// Get the document and window
var doc = jsdom.jsdom('<!doctype html><html><body><div id="container" style="height: 800px; width: 800px; margin: 0 auto"></div></div></body></html>'),
win = doc.defaultView;
// Do some modifications to the jsdom document in order to get the SVG bounding
// boxes right.
doc.createElementNS = function (ns, tagName) {
var elem = doc.createElement(tagName);
// Set private namespace to satisfy jsdom's getter
elem._namespaceURI = ns; // eslint-disable-line no-underscore-dangle
/**
* Pass Highcharts' test for SVG capabilities
* @returns {undefined}
*/
elem.createSVGRect = function () {};
elem.getBBox=function(){var e=0,t=0,l=0;return[].forEach.call(elem.children.length?elem.children:[elem],function(n){var r,a,h=n.style.fontSize||elem.style.fontSize;h=/px/.test(h)?parseInt(h,10):/em/.test(h)?12*parseFloat(h):12,r=24>h?h+3:Math.round(1.2*h),a=n.textContent.length*h*.55,"0"!==n.getAttribute("dx")&&(l+=r),null!==n.getAttribute("dy")&&(e=0),e+=a,t=Math.max(t,e)}),{x:0,y:0,width:t,height:l}};
return elem;
};
// Require Highcharts with the window shim
var Highcharts = require('/opt/dlins/node-v6.3.0-linux-x64/bin/libs/highcharts-6.2.0/highcharts.js')(win);
// Load a module
require('/opt/dlins/node-v6.3.0-linux-x64/bin/libs/highcharts-6.2.0/modules/exporting')(Highcharts);
require('/opt/dlins/node-v6.3.0-linux-x64/bin/libs/highcharts-6.2.0/modules/export-data')(Highcharts);
var fs = require('fs');
var series = [{"name":"-12%","y":0.1,"color":"#000","pos":0},{"name":"","y":18,"color":"#4c80ef","dataLabels":false,"pos":18},{"name":"XAUUSD (-10.40%)","y":0.1,"color":"#000","pos":18},{"name":"","y":33.75,"color":"#4c80ef","dataLabels":false,"pos":51.75},{"name":"CS Green (-7.40%)","y":0.1,"color":"#000","pos":51.75},{"name":"","y":36,"color":"#4c80ef","dataLabels":false,"pos":87.75},{"name":"ALLREAL (-4.20%)","y":0.1,"color":"#000","pos":87.75},{"name":"","y":42.75,"color":"#4c80ef","dataLabels":false,"pos":130.5},{"name":"XAGARS (-0.40%)","y":0.1,"color":"#000","pos":130.5},{"name":"","y":4.5,"color":"#4c80ef","dataLabels":false,"pos":130.5},{"name":"0","y":0.1,"color":"#000","pos":135},{"name":"","y":4.5,"color":"#4c80ef","dataLabels":false,"pos":139.5},{"name":"XPDUSD (0.40%)","y":0.1,"color":"#000","pos":139.5},{"name":"","y":70.875,"color":"#4c80ef","dataLabels":false,"pos":210.375},{"name":"SIMA (6.70%)","y":0.1,"color":"#000","pos":210.375},{"name":"","y":5.625,"color":"#4c80ef","dataLabels":false,"pos":216},{"name":"DOMSW (7.20%)","y":0.1,"color":"#000","pos":216},{"name":"","y":41.625,"color":"#4c80ef","dataLabels":false,"pos":257.625},{"name":"FERR (10.90%)","y":0.1,"color":"#000","pos":257.625},{"name":"","y":12.375,"color":"#4c80ef","dataLabels":false,"pos":257.625},{"name":"+12%","y":0.1,"color":"#000","pos":270},{"name":"","y":1.4999999999999951,"color":"#a51515","dataLabels":false,"pos":271.5},{"name":"BBRY (12.20%)","y":0.1,"color":"#000","pos":271.5},{"name":"","y":5.250000000000011,"color":"#a51515","dataLabels":false,"pos":276.75},{"name":"RIO (12.90%)","y":0.1,"color":"#000","pos":276.75},{"name":"","y":8.25,"color":"#a51515","dataLabels":false,"pos":285},{"name":"MICR (14.00%)","y":0.1,"color":"#000","pos":285},{"name":"","y":30,"color":"#a51515","dataLabels":false,"pos":285},{"name":"-/+18.00%","y":0.1,"color":"#000","pos":315},{"name":"","y":4.499999999999999,"color":"#a51515","dataLabels":false,"pos":319.5},{"name":"UBS Blue (-17.40%)","y":0.1,"color":"#000","pos":319.5},{"name":"","y":37.5,"color":"#a51515","dataLabels":false,"pos":357},{"name":"GOOG (-12.40%)","y":0.1,"color":"#000","pos":357},{"name":"","y":3,"color":"#a51515","dataLabels":false,"pos":357}];
var chart = Highcharts.chart('container', {
chart: {
plotBackgroundColor: null,
plotBorderWidth: 0,
plotShadow: false
},
title: {text:undefined},
credits: false,
plotOptions: {
pie: {
dataLabels: {
enabled: true,
//distance: -50,
/*style: {
fontWeight: 'bold',
color: 'white'
}*/
},
startAngle: -135,
endAngle: 225,
//center: ['50%', '90%'],
//size: '110%'
}
},
series: [{
type: 'pie',
name: false,
//innerSize: '10%',
data : series,
}]
});
var svg = chart.getSVG();
console.log('svg', svg);
}
});
Вот как выглядит JSFiddle -> это то, что я хочу от узла JS: Вот как выглядит узел JS (не очень хорошо):
Может кто-нибудь сказать мне, что проблема с узлом js / как ее исправить?