Question

我已经使用本教程 - http://www.netzgesta.de/mapper/来创建交互式地图（http://teamworksdesign.com/clients/neurosign/contact/alabama/），问题是我想将其放大10-20％以更好地填充空间。 / p>

我使用过这两张图片：

enter image description here

svg：

显然png很容易在PS中放大但是如何在保持所有坐标的同时放大svg？

更新：在svg上更改以下这一行不会影响svg的大小，悬停状态只保持原始大小相同：

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 432 275">

Answer 1

SVG是一种矢量格式。因此，如果您只是将根元素的宽度和高度属性更改为每个100％并将视口保留在原始像素值上，它将填充可用空间，同时解析器会重新计算每个坐标。现在显示图片的大小取决于它的嵌入位置。

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 432 275">

另外，使用JavaScript进行悬停效果，我会使用CSS（例如polygon:hover { fill: #32cd32; }）。

Answer 2

以像素为单位更改宽度和高度，但保持viewBox不变。例如，要加倍大小：

<svg width="832px" height="550px" viewBox="0 0 432 275" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">