我正在掌握 SVG.js
我创建了一个图案效果,并希望在许多 SVG 中使用。
我可以使用以下代码在一个 SVG 中创建它...
$( document ).ready(function() {
var draw = SVG('geo').size(1200, 1700);
// 100 lines of js creating geometric pattern, effectively this...
var rect = draw.polygon(coordinates).fill('#fff').stroke({ width: 1, color:'#fff'}).opacity(0)
});
这将创建一个带有 ID geo 的 SVG。但我想再次使用此代码来生成各种 SVG,最好具有不同的选项(颜色等)。
SVG('geo') 指的是特定的 SVG,我该如何制作它以便将其应用到页面上我想要的任何 SVG?
希望这是有道理的
最佳答案
您可以定义一个函数来重复执行此操作。类似于以下内容:
function create_svg(dom_id, width, height, coord) {
var draw = SVG(dom_id).size(width, height);
var rect = draw.polygon(coord)
.fill('#fff')
.stroke({
width: 1,
color: '#fff'
})
.opacity(0);
}
$(function() {
create_svg('geo', 1200, 1700, coordinates);
create_svg('geo2', 1000, 1500, other_coordinates);
)};
如果您需要在稍后的代码中进一步使用创建的 SVG,您可以使 create_svg
函数将创建的 SVG 对象返回到 document.ready
函数中的变量。
关于javascript - 为各种 SVG 重用 SVG.js 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25328084/