Javascript Raphael JS - 使用 SVG 文件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7926643/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Raphael JS - Use a SVG file
提问by larschanders
I have seen several threads that adress this question but nothing that really solves my problem. I have a SVG file with a map and differrent regions ( http://www.mediafire.com/?5pmyevdwbyrb51f). I want do do something like this: http://raphaeljs.com/australia.html.
我已经看到了几个解决这个问题的线程，但没有什么能真正解决我的问题。我有一个带有地图和不同区域的 SVG 文件（http://www.mediafire.com/?5pmyevdwbyrb51f）。我想做这样的事情：http: //raphaeljs.com/australia.html。
But the question is how I can convert the file so that is works in the script? How do I get those coordinates? I have tried several converters and such but I must suck at this 'cause I cant get it to work. Maybe someone can help out?
但问题是我如何转换文件以便在脚本中工作？我如何获得这些坐标？我已经尝试了几个转换器等，但我必须在这方面很糟糕，因为我无法让它工作。也许有人可以帮忙？
回答by Clafou
If you mean using Raphael to import an SVG file so you can display it or manipulate it, it's not currently supported. But you might want to check extensions raphael-svg-importor raphael-svg-import-classic.
如果您的意思是使用 Raphael 导入 SVG 文件以便您可以显示或操作它，则目前不支持它。但您可能想检查扩展raphael-svg-import或raphael-svg-import-classic。
回答by fmsf
Look at the code of:
看下代码：
http://raphaeljs.com/tiger.html
http://raphaeljs.com/tiger.html
<script src="tiger.js">
// Load the file with the tiger mapping to a variable
var tiger = [0,0,600,600,{type:"path",path:"M-122.304 84.285C-12...
</script>
<script>
// run it
window.onload = function () {
var r = Raphael(tiger).translate(200, 200);
};
</script>
回答by Wtower
Additionally to mikefrey's answerusing rapper, an example:
var paper = Raphael(0, 0, 160, 600);
var rappar = [...]; // here use the output from rappar
var graphic = paper.set();
rappar.forEach(function (item) {
graphic.push(paper
.path(item.path)
.attr('fill', item.fill)
.attr('stroke', item.stroke)
// ...
);
});
graphic.transform('s0.8,0.8,0,0');
// ...
Using Raphael v2.2.6 and rappar v0.0.2.
使用 Raphael v2.2.6 和 rappar v0.0.2。
