Reactjs 设置自定义形状的纹理

我是Three.js的新手，我遇到了这样的问题 我有一个这样的定制造型

    // Create a custom flap path
    const flapPath = new THREE.Path();
    flapPath.moveTo(0, 0); // 0
    flapPath.lineTo(12, 50); // 1
    flapPath.lineTo(17, 70); // 2
    flapPath.lineTo(20, 77); // 3
    flapPath.lineTo(25, 85); // 4
    flapPath.lineTo(30, 90); // 5
    flapPath.lineTo(38, 95); // 6
    flapPath.lineTo(43, 97); // 7
    flapPath.lineTo(48, 98); // 8
    flapPath.lineTo(55, 100); // 9
    flapPath.lineTo(145, 100); // 10
    flapPath.lineTo(152, 98); // 11
    flapPath.lineTo(157, 97); // 12
    flapPath.lineTo(162, 95); // 13
    flapPath.lineTo(170, 90); // 14
    flapPath.lineTo(175, 85); // 15
    flapPath.lineTo(180, 77); // 16
    flapPath.lineTo(183, 70); // 17
    flapPath.lineTo(188, 50); // 18
    flapPath.lineTo(200, 0); // 19
    flapPath.closePath(); // Close the path
    const flapShape = new THREE.Shape(flapPath.getPoints());
    const flapGeometry = new THREE.ShapeGeometry(flapShape);

and the canvas for texture let assume like this

请帮我用这个做纹理设置 谢谢