Tengo una matriz de coordenadas [x1,y1, x2, y2 ....] que representa un polígono en un lienzo html. Estoy dibujando el polígono usando KonvaJS. Estoy tratando de recuperar las coordenadas escaladas del polígono donde [x1, y1, x2, y2 ...] son las coordenadas escaladas.
He probado lo siguiente:
Usando JSTS https://github.com/bjornharrtell/jsts para agregar un búfer a las coordenadas. Seguí este fragmento http://jsfiddle.net/qdv1n4yL/7/ e intenté integrarlo en mi aplicación react/typescript y creé el fragmento como se muestra a continuación función vectorCoordinates2JTS (polígono) { var coordenadas: cualquier = [];
for (var i = 0; i < polygon.length; i++) { coordinates.push(new Coordinate(polygon[i].x, polygon[i].y)); } return coordinates; } function inflatePolygon(poly, spacing) { var geoInput = vectorCoordinates2JTS(poly); geoInput.push(geoInput[0]); var geometryFactory = new GeometryFactory(); var shell = geometryFactory.createPolygon(geoInput); var polygon = new BufferOp(poly); console.log(polygon.getResultGeometry()) var inflatedCoordinates: any = []; var oCoordinates; oCoordinates = polygon.shell.points.coordinates; console.log(oCoordinates.length) for (let i = 0; i < oCoordinates.length; i++) { var oItem; oItem = oCoordinates[i]; inflatedCoordinates.push(Math.ceil(oItem.x), Math.ceil(oItem.y)); } return inflatedCoordinates; } Aquí estoy pasando poly como [{x: 1, y:1}, {x:2, y:2}] y espaciado como 1.5. Se rompe en esta línea aquí polygon.getResultGeometry() con un error.
Mis requisitos generales para resolver este problema son que el polígono debe tener un amortiguador alrededor del polígono original que pueda usarse para detectar colisiones. Pude hacer funcionar la detección de colisión entre el polígono y un punto, pero me quedé atascado agregando la escala/búfer durante los últimos días. Cualquier ayuda o pregunta de seguimiento a este problema es muy apreciada. ¡Gracias!