# Can anyone help me to solve the boundary issue?

like the below picture when I make boundaries for different polygons I always get this kind of error for my boundary goes wider than my actual polygon size how can I fix it?

black one is the boundary and green one is polygon I want to make it same for the boundary as well

``````function layoutFeaturesOnPolygon(
pts: any,
mode: string,
index: number,
spacing?: number,
moveType?: string,
) {
deleteAllPanelsAndIcons();
scene.remove(axisHelper);
const edges = [];
const ct = pts.length;
for (let i = 0; i < ct; i++) {
const p = pts[(i + 1) % ct].clone().sub(pts[i]);
p.vertexId = i;
edges.push(p);
}

const longestEdge = edges
.sort((a, b) => {
return a.length() - b.length();
})
.pop();

axisHelper.position.copy(pts[longestEdge.vertexId]);

const shortestDotProductEdge = edges
.sort((a, b) => {
return Math.abs(longestEdge.dot(a)) - Math.abs(longestEdge.dot(b));
})
.shift();
const vx = longestEdge.clone().normalize();
let vy = shortestDotProductEdge.clone().normalize();
const vz = new THREE.Vector3().crossVectors(vy, vx);
vy = new THREE.Vector3().crossVectors(vx, vz);
axisHelper.matrix.makeBasis(vx, vy, vz);
axisHelper.matrix.setPosition(pts[0]);
axisHelper.matrix.decompose(axisHelper.position, axisHelper.quaternion, axisHelper.scale);
console.log(pts, "pts");
const localPts = pts.map((p: { clone: () => THREE.Vector3 }) => {
return axisHelper.worldToLocal(p.clone());
});

const boundaryEdges = findBoundaryEdges(localPts);

const allVertices = [];
for (const edge of boundaryEdges) {
allVertices.push(edge[0], edge[1]);
}

// Find the minimum and maximum values of x, y, and z coordinates
let minX = Infinity;
let minY = Infinity;
let minZ = Infinity;
let maxX = -Infinity;
let maxY = -Infinity;
let maxZ = -Infinity;
for (const vertex of allVertices) {
minX = Math.min(minX, vertex.x);
minY = Math.min(minY, vertex.y);
minZ = Math.min(minZ, vertex.z);
maxX = Math.max(maxX, vertex.x);
maxY = Math.max(maxY, vertex.y);
maxZ = Math.max(maxZ, vertex.z);
}

console.log(minX, maxX, minY, maxY, minZ, maxZ, "2398+++++++");
const boxGeometry = new THREE.BoxGeometry(maxX - minX, maxY - minY, maxZ - minZ);

// Create a bounding box material
const boxMaterial = new THREE.MeshBasicMaterial({ color: 0x000000, wireframe: true });

// Create the bounding box mesh
const boundingBoxMesh = new THREE.Mesh(boxGeometry, boxMaterial);

// Set the position of the bounding box to the center of the polygon's boundary
const centerX = (minX + maxX) / 2;
const centerY = (minY + maxY) / 2;
const centerZ = (minZ + maxZ) / 2;
boundingBoxMesh.position.set(centerX, centerY, centerZ);

// const edgeMaterial = new THREE.LineBasicMaterial({ color: 0x000000 });
// for (let i = 0; i < boundaryEdges.length; i++) {
//   const edge = boundaryEdges[i];
//   const edgeGeometry = new THREE.BufferGeometry();
//   edgeGeometry.setAttribute(
//     "position",
//     new THREE.BufferAttribute(
//       new Float32Array([edge[0].x, edge[0].y, edge[0].z, edge[1].x, edge[1].y, edge[1].z]),
//       3,
//     ),
//   );

//   console.log(edgeGeometry, "edgeGeometry");
//   const line = new THREE.Line(edgeGeometry, edgeMaterial);
// }
const bounds = new THREE.Box3();
pts.forEach((p: THREE.Vector3) => bounds.expandByPoint(p));
const sz = bounds.getSize(new THREE.Vector3());

const box = new THREE.Mesh(
new THREE.BoxGeometry(1, 1, 1),
new THREE.MeshBasicMaterial({
transparent: true,
color: "red",
opacity: 0.5,
wireframe: true,
}),
);
box.scale.copy(sz);

// sz.x *= -1;

const bound1 = new THREE.Box3().setFromObject(box);

const panel = panelObject.clone();
const boundingBox = new THREE.Box3().setFromObject(panel);

const width = boundingBox.max.x - boundingBox.min.x;
const height = boundingBox.max.y - boundingBox.min.y;
const depth = boundingBox.max.z - boundingBox.min.z;
const panelDimensions = {
width,
height,
depth,
};
const space = spacing ? spacing / 100 : 0.1;
const panelsCount = calculatePanelsCountWithSpacing(bound1, panelDimensions, space);

}
``````

hello @prisoner849 can you help in this problem?