javascript 为Map生成编号的SVG针

bksxznpy 于 2023-04-04 发布在 Java

关注(0)|答案(1)|浏览(87)

我需要为Map自动生成“路径”格式的SVG图标。本质上，我在一组位置上循环，并将它们绘制在Map上。我希望每个“pin”都是在运行时生成的编号图标，类似于此。

我正在使用的库要求我以SVG的形式输入图标，我猜是字符串吧？我对SVG不是很熟悉，所以对术语不熟悉。但例如我有这样的东西。

最后画出了像这样的图标。

所以本质上我正在寻找的是一个JavaScript函数，我可以在一个整数饲料，它吐出的SVG路径代码的一个小编号图标.任何帮助，指针，示例代码，将不胜感激.谢谢！

JavaScript

来源：https://stackoverflow.com/questions/75899828/generate-numbered-svg-pins-for-map

1条答案

按热度按时间

ffscu2ro1#

画圆很简单，就是一堆弧线：

body {
  background: #ccc;
}
svg {
  width: 110px;
}

<svg viewBox="-5 -5 110 110" xmlns="http://www.w3.org/2000/svg">
  <path d="M 100 50 A 50 50 0 0 1 50 100 A 50 50 0 0 1 0 50 A 50 50 0 0 1 50 0 A 50 50 0 0 1 100 50 Z" style="fill: rgb(255, 0, 0); stroke: rgb(255, 255, 255); stroke-width: 5px;"/>
</svg>

渲染数字是这个问题的挑战部分。如果你在Node.js上运行，你可以使用text-to-svg包从字符串和字体文件生成SVG路径。如果你想在浏览器中完成，@LeetCodes说可以从npm run build完成using the outputs。

赞(0）回复(0）举报 2023-04-04

我来回答

javascript 为Map生成编号的SVG针

1条答案

相关问题

热门标签

最新问答