Javascript 在画布元素上绘制向量：如何生成向量字符串

对于我目前正在做的项目，我需要实现一个交互式画布元素。 画布上将有一个形状，它被划分为若干个子区域。 用户应该能够从中选择子区域，并对所选区域应用不同的颜色。[这些区域不是正方形或圆形，而是自定义路径]

这包含了一些类似于我想要实现的东西。它使用kinetic.js。它展示了如何使用Kinetic.path（）方法绘制世界地图——每个国家都有向量字符串

请让我来实现类似的脚形/或任何其他形状。我应该如何获得这个向量字符串来绘制所需的形状

这是最好的方法吗

此文件（）包含世界地图的矢量字符串。我不知道他们是怎么产生的。这就是我感兴趣的地方

有没有从图片生成矢量字符串的方法？

使用svg编辑器（例如本例）。然后导入图片并使用路径追溯图片的元素