3 ms·

Cool! But why and when? How would I use loaders with this? (GLTF etc)

• mlsarecmg 8y ago
  You would use them as you always did. You have raw access to everything. But if you want loading results to be managed, put them into useEffect/useMemo and render out the results. For instance i've just made a text-sprite component that looks like this: function Text({ children, ...props }) { const { camera, size, viewport } = useThree() const { width } = viewport() const canvas = useMemo(() => { const canvas = document.createElement('canvas') canvas.width = canvas.height = size.width * 2 const context = canvas.getContext('2d') context.font = `bold ${size.width * 0.45}px -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif` context.textAlign = 'center' context.fillStyle = 'black' context.fillText(children, size.width, size.height + size.width * 0.4) return canvas }, [children, size.width]) return ( <sprite scale={[width, width]} {...props}> <spriteMaterial name="material"> <canvasTexture name="map" image={canvas} premultiplyAlpha onUpdate={s => (s.needsUpdate = true)} /> </spriteMaterial> </sprite> ) }