javascript - 用于动态着色路径的 SVG 系统 (Cordova)

Question

对于 Cordova 应用程序，我有一张 SVG map ，其中包含大约 30 个国家/地区(每个国家/地区 = 一条路径)。这张 map 将在我的整个应用程序中大量使用:有时每页 10 次。

现在，我必须能够为 map 的每个实例动态地为每个国家/地区着色。例如使用 jQuery:

$('svg.map .usa').css('fill', 'blue');
$('svg.map .canada').css('fill', 'green');
...

你们认为最好的(或好的)方法是什么？

xlink:href?内联 SVG？还有别的吗？

Answer 1

使用 fill 而不是 background-color，您的路径将填充指定的颜色。