使用PhantomJS crowbar从本地web服务器上的网页中提取3d创建的SVG

Use PhantomJS crowbar to extract D3-created SVG from webpage on local webserver

本文关键字：网页 提取 3d SVG 创建 服务器 crowbar PhantomJS web 使用      更新时间：2023-09-26

我试图从网页中提取我用D3创建的SVG。因为我使用d3.csv来读取我的图像数据，我使用本地web服务器。我一直在尝试使用安德鲁·里根的phantom-crowbar.js代码(https://github.com/andyreagan/phantom-crowbar)，而这对于从http://页面和file:///页面提取SVG非常有用，当我试图从我的页面提取地址http://localhost:8000时，我收到以下消息:

TypeError: null is not an object (evaluating 'svg.setAttribute')
phantomjs://webpage.evaluate():32
phantomjs://webpage.evaluate():55
Evaluated our code

" Evaluated our code "是您通常在成功提取SVG但输出文件为空时收到的消息。

我是新的JavaScript, PhantomJS和工作在浏览器与D3，所以任何帮助将不胜感激。我真的不知道为什么本地服务器页面的行为应该不同。

我最后问了Andrew Reagan，他很快就回复了我，问题是我在脚本中的函数中设置了SVG "id"属性。因为我使用d3.csv()来读取csv并生成我的图像，所以一切都被包装在这个函数中。我使用

在此之外设置"id"属性
d3.select("svg").attr("id", mysvg)

和现在phantom-crowbar.js工作没有问题。

@Stephen我需要生成和保存多个D3图像，所以我需要一种方法来以编程方式提取SVG和安德鲁的phantom-crowbar.js是我尝试过的最好的方法，如果其他人正在寻找做类似的事情。如果你只是偶尔需要这样做，SVG Crowbar bookmarklet是很好的。

相关文章：