this is my svg when I am trying to upload this then there is some rendering issue the circle’s get filled completely i don’t know the reason behind that.Can anyone please help me with that. It looks something like this
layerData.paths.forEach((path) => {
const pathColor = new THREE.Color();
if (path.userData?.style?.stroke) {
pathColor.setStyle(path.userData.style.stroke);
} else if (path.userData?.style?.fill && path.userData.style.fill !== ‘none’) {
pathColor.setStyle(path.userData.style.fill);
}
const material = MaterialFactory.createMaterial(
pathColor,
materialProperties,
isBackLayer,
zOffset,
currentEnvironment,
texture
);
path.subPaths.forEach((subPath) => {
const points = subPath.getPoints();
if (!points?.length) return;
const geometry = GeometryFactory.createGeometry(points);
let mesh: THREE.Mesh;
if (meshIndex < meshPool.length) {
mesh = meshPool[meshIndex];
mesh.geometry = geometry;
mesh.material = material;
} else {
mesh = new THREE.Mesh(geometry, material);
meshPool.push(mesh);
}
meshIndex++;
if (isBackLayer) {
mesh.scale.x = -1;
mesh.position.x = 245;
}
mesh.position.z = zPosition;
group.add(mesh);
});
});