2017-02-20 7 views
0

次のグラフがデジタル化されています。画像を参照してください: enter image description hereエクスポート時のハイチャートCSSスタイル

をしかしHighchartのhamburguerのCSSメニューを使用しているとき、私はこのようなグラフを取得PDFやJPGまたはPNGにエクスポート: enter image description here

あなたはCSSスタイルを見ることができるように、フォント:画像を参照してください。サイズは保持されません。どうすればそれらを保つことができますか?あなたの助けにTIA。

答えて

1

あなたの投稿要求にCSSスタイルを渡して、サーバーをエクスポートすることができます。

var options = { 
    chart: {}, 
    xAxis: { 
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
     'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' 
    ] 
    }, 
    series: [{ 
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
    type: 'column' 
    }] 
} 

var chart = Highcharts.chart('container', options); 

var data = { 
    options: JSON.stringify(options), 
    resources: { 
     // You can add your CSS styles here 
     css: ".highcharts-background { fill: #efefef; stroke: #a4edba; stroke-width: 2px}" 
    }, 
    filename: 'test.png', 
    type: 'image/png', 
    async: true 
} 

var exportUrl = 'https://export.highcharts.com/'; 
$.post(exportUrl, data, function(data) { 
    var imageUrl = exportUrl + data; 
    var urlCreator = window.URL || window.webkitURL; 
    document.querySelector("#image").src = imageUrl; 
    fetch(imageUrl).then(response => response.blob()).then(data => {console.log(data)}); 
}) 

ライブ例:https://jsfiddle.net/nfbcq865/

+0

はあなたの助けのためにありがとうございました。 – Bastcri

関連する問題