我基本上创建了一个FIDDLE并制作了一个示例图表。
这是图表的代码
var chart = c3.generate({
data: {
json: [{
date: '2014-01-01',
upload: 200,
download: 200,
total: 400
}, {
date: '2014-01-02',
upload: 100,
download: 300,
total: 400
}, {
date: '2014-02-01',
upload: 300,
download: 200,
total: 500
}, {
date: '2014-02-02',
upload: 400,
download: 100,
total: 500
}],
keys: {
x: 'date',
value: ['upload', 'download']
}
},
axis: {
x: {
type: 'timeseries',
tick: {
format: function (x) {
if (x.getDate() === 1) {
return x.toLocaleDateString();
}
}
}
}
}
});
我正在尝试将此图表转换为可用于绘制图像的数据库。我想知道最好的方法是什么?
我做了研究并找到了以下approach,但我无法成功实施它。任何有关此事的帮助将不胜感激。
答案 0 :(得分:0)
要使svg成像,首先需要在画布上绘制它,然后从画布中获取dataUrl。 我编辑你是小提琴,似乎有一些渲染问题,但有一些主要步骤可以做到这一点。
canvg('canvas', document.getElementById('chart').innerHTML);
// the canvas calls to output a png
var canvas = document.getElementById("canvas");
var img = canvas.toDataURL("image/png");