Python 关于操作SVG映射的建议

我正在为维基百科绘制加利福尼亚州的土著语言地图。地图包含每个对应于一种语言的区域。原稿如下所示（单击以查看以下内容）：

我想手工为每种语言制作“定位器地图”，就像这一种，为一种叫做（语言代码为

cah

）的语言制作：

不用说，如果我在Inkscape中手工生成了所有60个部分，那么这样做将是一件痛苦的事情

更糟糕的是，每当我在原稿中发现错误时，我就必须重做整套定位地图。（事实上，我最近意识到我的原作完全缺少了一种语言。对不起，库皮诺。）

---

所以我的目标是使这个过程自动化。我没有太多处理SVG甚至XML的经验，所以我正在寻找关于哪些库最有用的建议。我更喜欢Python的解决方案，因为我对这种语言不是没有希望的

总而言之，我需要：

获取原始SVG文件中所有语言形状的引用列表

对于此列表中的每种语言：

为当前语言更改形状的背景色

在语言周围放一个方框

复制长方体并将其缩放到给定的大小（我认识到在这一步中，可能很难像我在示例中所做的那样实际“裁剪”周围的形状——只需在白色背景上创建具有语言形状的长方体就足够了。）

将副本放在右上角

将所有这些内容保存在code.svg中

最终产品将是60个SVG文件，名为

cah.SVG

，等等。更好的是，如果有必要编辑原始地图（很可能），可以重新生成整个shebang

这是一张使用地图的地图。可以单击任何元素以获取边界框，这可以用于miniview视口框（进行一些调整）。正如您所看到的，它没有向映射添加太多代码，只是添加了几个元素。当您拥有所有的viewBox时，您可以使用javascript动态更新miniview

“viewBox”

属性

对于所选形状的着色，我建议在miniview

中添加一个

元素，该元素的填充会覆盖主地图中使用的任何填充（您可能必须为此使用样式表规则以确保其具有高特异性，例如添加

#miniview.activeshape{fill:red！important}

。让

指向所选形状，并确保在指向的形状上添加

class=“activeshape”

---

这至少应该是一个开始，希望能有所帮助：）

我建议使用Python并专门为Inkscape创建扩展。我不认为你真的需要60个SVG，除非你真的想要，因为源地图将拥有你所需要的一切

我要做的是使用Inkscape将各个区域重命名为您将要使用的相同语言代码。例如，Cahuilla或cah当前在SVG文件中是

path13882

。我会将其重命名为

cah

或

Cahuilla

，并对每个语言区域重复该过程。使用Edit\XML编辑器帮助确保更新所有路径

在更新名称/ID之后，您可以研究SVG脚本。我只需要创建一个javascript/ecmascript映射或字典，其中包含该语言的相关信息：

var langaugeMap = {};
languageMap["cah"] = { name: "Cahuilla", color: "rgb(255, 0, 0)" };
languageMap["cup"] = { name: "Cupeño", color: "rgb(255, 64, 0)" };
// and so on -- this could even be generated from a CSV file or Excel, etc.
// if the highlighted color is always the same, then you don't need it in the map
// or use style sheets for an activeshape and inactiveshape
// Put any information that is specific to a language in the map

然后，您只需要添加一个mouseover函数，该函数将添加和定位边界框并更改路径颜色。下面是一些事件和脚本，尽管它们已经过时了。还有一个交互式地图示例

SVG看起来像：

<path
   style="fill:#800000;fill-opacity:1;display:inline"
   d="m 422.43078,517.40746 c 0.52151,0.006 1.10755,0.0374 1.75925,0.0825 3.82011,0.26462 5.01088,0.75501 5.75001,2.37491 0.51312,1.12355 2.4121,3.0097 4.22213,4.1946 3.906,2.55656 7.38824,2.07964 9.61517,-1.3194 2.12996,-3.25075 9.13451,-3.19196 13.61739,0.11545 1.77185,1.30707 4.04994,2.38037 5.06319,2.38041 1.01325,0 3.34593,0.92548 5.18421,2.06155 2.52816,1.56236 4.9918,2.09869 10.09889,2.19902 3.71359,0.0729 7.68145,0.64349 8.82374,1.26442 2.81717,1.53202 5.67633,1.42382 10.7693,-0.40133 4.97461,-1.78261 6.31161,-1.36525 17.10267,5.31063 3.39862,2.10239 6.90491,4.08094 7.7956,4.39801 2.46593,0.8776 4.55428,4.66976 3.95259,7.17971 -0.29359,1.22605 -0.75898,3.51121 -1.03349,5.07968 -0.27411,1.56855 -0.88382,3.33952 -1.35761,3.93621 -1.50842,1.89871 -20.98501,7.77151 -27.8945,8.41122 -3.66014,0.33879 -8.3091,1.04337 -10.32987,1.56676 -3.50666,0.90799 -3.81743,0.79746 -6.78388,-2.44089 -3.3486,-3.65594 -6.11308,-4.2716 -8.48815,-1.89661 -2.14408,2.14401 -1.85126,3.96434 1.0667,6.66846 1.40725,1.30409 1.85699,2.10446 1.00027,1.77571 -0.85672,-0.32883 -6.3937,-0.12213 -12.3033,0.46176 -5.9096,0.58386 -12.56062,1.27336 -14.78297,1.53381 -4.17058,0.4888 -5.09869,-0.37014 -2.61673,-2.42989 2.1563,-1.78956 1.74245,-2.63318 -1.65999,-3.36449 -1.69931,-0.36525 -4.94789,-1.90738 -7.213,-3.42496 -2.26473,-1.51754 -5.89662,-3.66823 -8.07583,-4.77731 -2.17921,-1.10923 -6.21922,-3.94186 -8.97721,-6.29463 -4.75318,-4.05478 -4.93682,-4.36681 -3.43604,-6.02527 0.96935,-1.07117 2.36209,-1.56397 3.5899,-1.26992 1.62639,0.38937 2.49494,-0.41237 4.59588,-4.24958 1.42481,-2.60257 2.23686,-4.95457 1.80316,-5.22266 -0.4337,-0.26805 -1.06784,-3.14557 -1.40725,-6.39358 -0.33978,-3.24797 -1.19001,-6.79064 -1.89134,-7.87242 -1.74322,-2.68957 -1.2114,-3.65437 2.44111,-3.61188 l 0,0 z"
   id="cah"
   inkscape:label="#cah"
   onmouseover="highlightRegion(evt);"
   onmouseout="restoreRegion(evt);" />

---

对于SVG文件的任何自动化，我都会使用Inkscape扩展。查看开发人员教程/扩展下的。否则，SVG仍然是XML，因此如果您在源文件中用一个不同的名称命名了您的语言区域，您可以使用Python解析XML，并将每个路径/语言区域保存到一个单独的文件中。

Nice project，但您有什么问题？“因此，我的目标是使这一过程自动化。我没有太多处理SVG甚至XML的经验，所以我正在寻找关于哪些库最有用的建议。我更喜欢Python的解决方案，因为我对这种语言不是没有希望的。“埃里克，谢谢你给我举了个有趣的例子。我不知道

.getBBox

，这显然是我需要的。经过一段时间的研究，我发现这些属性在Javascript中是可用的，所以我现在只需要找到一个Python库，它可以执行类似的操作。感谢您的帮助。制作了另一个变体，可根据悬停元素设置填充并更新迷你视图，请参阅。再次感谢Erik。我仍然需要使用脚本语言“离线”生成这些地图，而不是使用Javascript“在线”生成这些地图。。。除非我可以在Rhino或其他软件中运行这些东西，并保存生成的SVG？哦，我刚刚意识到你的第二个示例是交互式的。（据我测试，它在Safari和Opera中工作，而不是Firefox。）这真的很有趣。我怀疑这类东西是否可以嵌入维基百科，不过我当然可以想象其他用途，谢谢。你可能可以将Batik与类似的东西一起使用，并让它从javascript函数生成相应的静态映射。