Question

我有一个将外部svg文件加载到我的html中的函数。 svg加载正常但我无法像获取元素那样与文件通信。有什么建议吗？

$(function() {
    $('#map-container').load('svg/world-map.svg');
    $('#unitedstates .location').click(function() {
        alert('usa click');
    });
});

我试图保持我的工作文件，这就是没有svg与jquery引用在同一个html文件中的原因。有没有办法在svg文件中引用我的jquery文件

Answer 1

我假设您正在使用jQuery SVG。要加载文件，您可以使用：

var svg = $('#map-container').svg({loadURL: 'svg/world-map.svg'});

据我所知，您可以像这样与SVG文件进行交互：

var g = svg.getElementById('group1');
//Change some settings:
svg.change(g, {cx: 200, cy: 250});

Answer 2

您可以使用Snap svg加载svg文件，然后在加载后对其进行操作：

http://svg.dabbles.info/snaptut-load-animate.html

在他们的网站上，他们是一个入门页面，然后单击数字15，您可以看到如何加载图像，然后选择和操作图像的一部分：

http://snapsvg.io/start/

我希望它有所帮助！

如何与外部svg文件对话？

2 个答案: