如果沿线的 y 坐标已知，则沿 2 条线求 x 值

Question

[多边形的所有坐标都是已知的] 这里对于特定的 Y 值，我需要计算多边形填充中的 x 范围，但现在我正在为 y 搜索 x 的每个点并检查它是否在填充与否，任何人都可以为此提出更好的解决方案。

//////////////////////////更新////////////////// 在这里，我可以计算多边形的边界框，即 SVG 中的 BBox 。 它具有以下属性

startPositionx、y 和宽度和高度

.** 所以这是我的算法来计算算法中的所有点。

x=this.startPosition.x;
for(y:this.startPosition.y;y<=(this.startPosition.y+height);y++)
{
If(polygon.isPointInFill(x,y))
{
// return the point is inside the polygon
}
X++;
If(x>(this.startPosition.x+width))
{
x=this.startPosition.x
}

Answer 1

 window.onload = function() {
      console.log(paintSvgToCanvas(document.getElementById("ele01")));
    };

    function paintSvgToCanvas(svgEle) {
      let parsePattern = new RegExp(/(M|L)\d+\s\d+/gi);
      let parsePatternXY = new RegExp(/\d+/gi);
      let pointList = [];
      let minX = 0;
      let maxX = 0;
      let minY = 0;
      let maxY = 0;
      switch (svgEle.tagName) {
        case "path":
          let parseData = svgEle.getAttribute("d");
          parseData.match(parsePattern).forEach(function(item, idx) {
            let temp = item.match(parsePatternXY);
            temp[0] = parseFloat(temp[0]);
            temp[1] = parseFloat(temp[1]);
            if (idx === 0) {
              minX = temp[0];
              maxX = temp[0];
              minY = temp[1];
              maxY = temp[1];
            } else {
              if (temp[0] < minX) {
                minX = temp[0];
              } else if (temp[0] > maxX) {
                maxX = temp[0];
              }
              if (temp[1] < minY) {
                minY = temp[1];
              } else if (temp[1] > maxY) {
                maxY = temp[1];
              }
            }
            pointList.push(temp);
          });
        default:
          break;
      }
      return {
        minX: minX,
        maxX: maxX,
        minY: minY,
        maxY: maxY
      };

这是我的代码。 获取 svg 路径元素的范围。