Fixing Decal Issues on a Tajine Plate Mesh

Based on the issues you're experiencing with your decals on the Tajine Plate mesh, here are some suggestions to address both the visibility on the bottom part and the duplication/distortion along the seam.

Issue 1: Decal Not Appearing on Bottom Part

The issue might be related to your decal position and orientation. Your current setup has:

JAVASCRIPTCopied
const decalPosition = new THREE.Vector3(0, 0.5, 0.02);
const decalOrientation = new THREE.Euler(0, Math.PI / 2, 0);

Try these adjustments:

1. Adjust the position: The y-value of 0.5 might be positioning your decal too high on the mesh. Try lowering this value to place it closer to the bottom part.

2. Modify the orientation: Your current orientation is rotated 90 degrees around the y-axis. You might need to adjust this to properly align with the bottom surface.

3. Increase decal size or depth: Your z-component of decalSize (0.15) might not be deep enough to project onto the bottom surface.

JAVASCRIPTCopied
// Try adjusting these values
const decalSize = new THREE.Vector3(0.15, 0.15, 0.3); // Increased depth
const decalPosition = new THREE.Vector3(0, 0.2, 0); // Lower position
const decalOrientation = new THREE.Euler(-Math.PI / 4, Math.PI / 2, 0); // Angled downward

Issue 2: Duplication/Distortion Along Seam

This is likely related to UV mapping issues. Here are some solutions:

1. Enable depth testing: Your current setup has depthTest: false, which might be causing the decal to appear on both sides of surfaces. Try:

JAVASCRIPTCopied
depthTest: true,

2. Adjust the material properties:

JAVASCRIPTCopied
polygonOffsetFactor: -4, // Less aggressive offset

3. Consider using multiple decals: Instead of trying to wrap one decal around a complex surface, use multiple smaller decals positioned strategically.

4. Check your DecalGeometry parameters: When creating the DecalGeometry, make sure you're using appropriate parameters:

JAVASCRIPTCopied
const decalGeometry = new THREE.DecalGeometry(
    targetMesh,
    decalPosition,
    decalOrientation,
    decalSize
);

5. Ensure proper UV mapping: If you're creating the DecalGeometry yourself, make sure the UV mapping is correct for your specific mesh topology.

If these suggestions don't resolve your issues, you might need to examine the specific geometry of your Tajine Plate mesh and adjust your approach accordingly, possibly using multiple decals for different parts of the mesh rather than trying to apply a single decal across complex curvature.