Я работаю с примером маркерного графика на сайте D3.JS по адресу http://bl.ocks.org/4061961:
Моя цель — сохранить саму пулевую диаграмму в виде файла SVG для редактирования в Inkscape. Используя пример rasterize.js с phantom.js, я смог изменить код, чтобы сохранить маркерный график в файл PNG и программно извлечь код SVG и сохранить его в файл. Ниже приведен измененный файл rasterize.js, в котором сохранен код SVG:
var page = require('webpage').create(), address, output, size;
if (phantom.args.length < 2 || phantom.args.length > 3) {
console.log('Usage: rasterize.js URL filename');
phantom.exit();
} else {
address = phantom.args[0];
output = phantom.args[1];
page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load the address!');
} else {
window.setTimeout(function () {
page.render(output);
var results = page.evaluate(function(){
return document.getElementById('chart').innerHTML
})
console.log(results);
phantom.exit();
}, 200);
}
});
}
Приведенный выше JS хранится в «rasterize.js» и передается phantomjs.exe в командной строке для создания файлов SVG и PNG.
> phantomjs.exe rasterize.js bullet.html bullet.png > bullet.svg
Вот ссылка на файл «bullet.svg», хранящийся в GIST: //raw.github.com/gist/4178632/08396404f40210a801ef36aeee526d9f128952a8/bullets.svg Вы можете сохранить этот файл на локальном диске и просмотреть его в браузере.
Однако в том виде, в каком он хранится в настоящее время, этот файл не загружается в Inkscape. Я изменил полученный файл, добавив заголовок ?xml и изменив элементы svg с помощью xmlns, поскольку я также вручную объединил отдельные элементы в один блок.
Что мне не хватает? Как только я выясню, как заставить его работать вручную, мне нужно будет изменить код, который извлекает SVG, чтобы записывать заголовки.
Другие идеи или советы по изменению rasterize.js (выше), чтобы программно написать чистый SVG? Спасибо!
<div id="bullets">
. Я ожидаю, что это будет шоу для Inkscape, не так ли? Вы пробовали это без этого div? - person meetamit   schedule 01.12.2012<g>
s в одном SVG. - person meetamit   schedule 01.12.2012