RaphaelJs：如何在路径定义的区域添加一些文本？

Question

我有一张美国的SVG图像，我在拉斐尔的帮助下得到了一些帮助：

http://jsfiddle.net/zCRkg/2/

当我将鼠标悬停在每个州的右侧时，我想要做的就是放置一些文字。问题在于，由于每个状态都是一条路径，因此很难确定x＆amp; y坐标放置标签的位置。

那么，有没有人知道使用Raphaël计算路径中心的方法？如果没有人知道如何在给定一组向量的情况下做到这一点？

Answer 1

您正在寻找的是getBBox function in Raphaël。它将为您提供一个边界框对象，您可以使用它来计算路径的中心点：

var bbox = st.getBBox();
var text = r.text(bbox.x + bbox.width/2, bbox.y + bbox.height/2, "Foo");

我forked your fiddle并使其在悬停时在每个州的中间显示静态文本。从您的数据中提取州名称留作练习。

Answer 2

每个坐标之间的差异的平均值应该给你中心，但那可能不是最有效的方式