\r\n \u003C/template>\r\n\u003C/TresCanvas>\r\n\u003Cscript>\r\nconst options = [ {\r\n label: '平行光',\r\n value: 'TresDirectionalLight',\r\n },\r\n {\r\n label: '点光源',\r\n value: 'TresPointLight',\r\n },\r\n {\r\n label: '聚光灯',\r\n value: 'TresSpotLight',\r\n },\r\n {\r\n label: '半球光',\r\n value: 'TresHemisphereLight',\r\n }]\r\n const lightSetting = ref([{\r\n type: 'TresDirectionalLight',\r\n config: {\r\n position: [5, 5, 5],\r\n targets: [0, 0, 0],\r\n color: '#ffffff',\r\n intensity: 1,\r\n castShadow: false\r\n }\r\n }\r\n ])\r\n\u003C/script>\r\n当我改变 type 值的时候就报错 Cannot read properties of null (reading 'children'),不加 v-light-helper的时候正常不会报错。\n\n### Reproduction\n\n还未上线\n\n### Steps to reproduce\n\n\u003CTresCanvas v-bind=\"canvasConfig\" ref=\"TresCanvasRef\">\r\n \u003Ctemplate v-for=\"(item,i) in lightSetting\">\r\n \u003Ccomponent ref=\"lightRef\" :is=\"item.type\" v-light-helper v-bind=\"item.config\" />\r\n \u003C/template>\r\n\u003C/TresCanvas>\r\n\u003Cscript>\r\nconst options = [ {\r\n label: '平行光',\r\n value: 'TresDirectionalLight',\r\n },\r\n {\r\n label: '点光源',\r\n value: 'TresPointLight',\r\n },\r\n {\r\n label: '聚光灯',\r\n value: 'TresSpotLight',\r\n },\r\n {\r\n label: '半球光',\r\n value: 'TresHemisphereLight',\r\n }]\r\n const lightSetting = ref([{\r\n type: 'TresDirectionalLight',\r\n config: {\r\n position: [5, 5, 5],\r\n targets: [0, 0, 0],\r\n color: '#ffffff',\r\n intensity: 1,\r\n castShadow: false\r\n }\r\n }\r\n ])\r\n\u003C/script>\r\n当我改变 type 值的时候就报错 Cannot read properties of null (reading 'children'),不加 v-light-helper的时候正常不会报错。\n\n### System Info\n\n```shell\nCannot read properties of null (reading 'children')\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],871,"Tresjs","tres","open"," Cannot read properties of null (reading 'children')","2024-11-13T01:30:10Z","https://github.com/Tresjs/tres/issues/871",0.7217218,{"description":3027,"labels":3028,"number":3029,"owner":3019,"repository":3020,"state":3021,"title":3030,"updated_at":3031,"url":3032,"score":3033},"### Description\r\n\r\nHey there,\r\nTres looks amazing. Great work!\r\n\r\nI'd love to switch to Tres, but my application uses multiple canvas elements, each rendering a different camera perspectives to the same scene. Of what I read in the docs & source code, TresCanvas creates its own scene and doesn't share it with other TresCanvas instances. I'd love to see TresCanvas taking scene as an optional prop, but I can also imagine that there might be a lot of side effects coming with such a change.\r\n\r\nWhat do you think of it? Edge case that's hard to implement or easy and viable for the ecosystem?\r\n\r\nHave a great day!\r\nMarc\r\n\r\n\r\n### Suggested solution\r\n\r\n`/src/components/TresCanvas.vue`\r\n```ts\r\nconst props = withDefaults(defineProps\u003CTresCanvasProps>(), {\r\n ...,\r\n scene: new Scene() // TresScene | Scene\r\n})\r\n```\r\nI already know, I'm missing out on component lifecycle handling. I just wanted to point in the direction this is going.\r\n\r\n### Alternative\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\nI think this is somehow the reverse request to [Portal](https://github.com/Tresjs/tres/issues/789)\r\n\r\n### Validations\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://tresjs.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.",[],842,"Decouple scene from canvas","2024-10-17T14:16:20Z","https://github.com/Tresjs/tres/issues/842",0.7300511,{"description":3035,"labels":3036,"number":3046,"owner":3019,"repository":3020,"state":3021,"title":3047,"updated_at":3048,"url":3049,"score":3050},"### Description\n\nHello there! \r\n\r\nFirst of all, thanks a bunch for creating this awesome repository! Even though I'm not really familiar with Three.js, I've been playing around with graphical stuff using the canvas.\r\n\r\nWhile creating a simple scene on my web page, I suddenly became concerned about accessibility.\r\n\r\nYou know, the canvas element itself isn't accessible, but it seems the HTML spec allows for adding \"fallback content\" to the canvas element.\r\n\r\nhttps://html.spec.whatwg.org/multipage/dom.html#fallback-content\r\n\r\nI'd love it if you could add an interface to TresCanvas where we could provide text or something using a fallback slot or props.\r\n\r\nThank you!\n\n### Suggested solution\n\nI would be happy to have the following interface\r\n\r\n```html\r\n\u003CTresCanvas window-size>\r\n \u003C!-- any scenes -->\r\n\r\n \u003Ctemplate #fallback>\r\n A cat lifting a UFO is slowly rotating.\r\n \u003C/template>\r\n\u003C/TresCanvas>\r\n\r\n\u003C!-- render to -->\r\n\u003Ccanvas>A cat lifting a UFO is slowly rotating.\u003C/canvas>\r\n```\r\n\r\nI have confirmed that the text in the canvas element is read out loud as \"image: alt text\" in VoiceOver on a Mac.\n\n### Alternative\n\n_No response_\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.",[3037,3040,3043],{"name":3038,"color":3039},"feature","c2e0c6",{"name":3041,"color":3042},"PR welcome","2D76B0",{"name":3044,"color":3045},"p2-nice-to-have","D4C5F9",352,"Provide a slot or props that can be used for fallback of canvas elements","2024-03-31T11:10:46Z","https://github.com/Tresjs/tres/issues/352",0.7428872,{"description":3052,"labels":3053,"number":3054,"owner":3019,"repository":3020,"state":3021,"title":3055,"updated_at":3056,"url":3057,"score":3058},"### Describe the bug\n\nI would like to render the CatmullRomCurve3 component. On the linked Playground reproduction case (which uses TresJS 3.9.0 and Cientos 3.9.0), I get the following error:\r\n```\r\nInvalid watch source: A watch source can only be a getter/effect function, a ref, a reactive object, or an array of these types.\r\n at \u003CLine2points=[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]vertex-colors=undefinedcolor=\"#fbb03b\" ...>\r\n at \u003CCatmullRomCurve3points=-1.5,0,0,-0.5,1,0,0.5,0,0,1.5,1,0segments=40line-width=10 ...>\r\n at \u003CApp>\r\n```\r\nwhich is strange because I didn't declare any watcher.\r\n\r\nStranger: [this Stackblitz](https://stackblitz.com/edit/tresjs-basic-jednrn?file=src%2Fcomponents%2FTheExperience.vue) that includes the same SFC displays the curve properly.\n\n### Reproduction\n\nhttps://play.tresjs.org/#eNqVVE2P2jAQ/StWethDyQeCUgmlFS1a9ePQrbZ7IxxCMoBZf8l2gArx3zt2SAjb3RULOcRv3jw/z4xzCB40mC9KRdsKgnGQmkJTZYkBWynCcrH6lAXWZMHnTFCupLbkQFzKNBfb3JAjWWrJyc3EIrYxcSE13HSo09zyirF7yaeV3sKgR+70gtqpFFZL9kw+BWGlQYk0rq3gxriwwBXLLeCKkLRjoGCQ67CQTGp0+m64dH9vl+Avfbp/DRMyVpIKazBlNgv70YceSfCZ98gsTNyqf1r5RRPyPB+ZZ0GrZGDF0bTTGiYdnFEB4Y6Wdo2RfifSml0uFslg0QTixrM73TdNy+/AFOgzflm5Gk7jcy0QSOO2UEEvqLsQ8lxFGyMFtvfgcrJTALs6Jh5xWLeDLpAFa2uVGcdxUQrML4HRrY4E2FgoHnfpk0E0ivpxSY2NHYzsLOj9J1y39i3adQbKf4ySs/wJvtzF7iB/VLm4xnvLnQyjpDXegBGnLqervdZwla7jTVBxlKDf92B4twx4wSoDV9e3Q5/0cQxRkYoS9hG/rO6JZ9a5hvINwnXCa9JIDEvg9ArRhuoOP4xGMaOLrqRTPGbiiDNpTSHFkq6eTGQhuaIM9J2yVIrLycwZk7ufHrO6gtZfsYbi8Rl8Y/a15d84LIC3vtvKXK/A1uHbP79gj+9tkMuyYqfmvBC8ByNZ5TzWtK+VKNF2h+fd/vAXjIrVg7ndWxCmOdSFUftXgUdnzaehnbUamPvCeb5vx/SVKp1PNoj8Z84X/PgPoizpCg==\n\n### Steps to reproduce\n\n_No response_\n\n### System Info\n\n```shell\nTresJS 3.9.0\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],694,"Invalid watch source error when declaring a CatmullRomCurve3","2024-05-31T23:36:28Z","https://github.com/Tresjs/tres/issues/694",0.74987084,{"description":3060,"labels":3061,"number":3068,"owner":3019,"repository":3020,"state":3021,"title":3069,"updated_at":3070,"url":3071,"score":3072},"### Describe the bug\r\n\r\nDue to the debounced ref introduced in #512, the canvas only renders once the resize animation has finished.\r\n\r\nHow it's supposed to work\r\n\r\n\r\nIt can be fixed by moving renderer size update and the camera projection matrix update to before rendering or using useFps composable from vueuse to dynamically calculate debounceTime\r\n\r\n### Reproduction\r\n\r\nMonitor with refresh rate above 100 hz needed\r\n\r\nhttps://stackblitz.com/edit/stackblitz-starters-jtmew9?file=src%2FApp.vue\r\n### Steps to reproduce\r\n\r\nHave container of TresCanvas resize continuously. \r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)\r\n CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor\r\n Memory: 12.28 GB / 15.58 GB\r\n Container: Yes\r\n Shell: 5.8.1 - /usr/bin/zsh\r\n Binaries:\r\n Node: 22.8.0 - ~/.asdf/installs/nodejs/22.8.0/bin/node\r\n npm: 10.8.2 - ~/.asdf/plugins/nodejs/shims/npm\r\n pnpm: 9.9.0 - ~/.local/share/pnpm/pnpm\r\n npmPackages:\r\n @tresjs/cientos: ^4.0.2 => 4.0.2 \r\n @tresjs/nuxt: ^3.0.7 => 3.0.7\r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\npnpm\r\n\r\n### Code of Conduct\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://tresjs.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[3062,3065],{"name":3063,"color":3064},"bug","d73a4a",{"name":3066,"color":3067},"p3-minor-bug","F28C37",848,"Render issue with continuous resize animation","2024-10-18T20:46:48Z","https://github.com/Tresjs/tres/issues/848",0.7529692,{"description":3074,"labels":3075,"number":3080,"owner":3019,"repository":3081,"state":3082,"title":3083,"updated_at":3084,"url":3085,"score":3086},"### Describe the bug\r\n\r\nEnvmaps are applied to objects but not to scene background\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/tresjs-basic-z2bbsv?file=package.json,src%2Fcomponents%2FPokeball.vue,src%2Fcomponents%2FTheExperience.vue\r\n\r\n### Steps to reproduce\r\n\r\n_No response_\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 13.5.1\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 96.19 MB / 16.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 18.14.1 - ~/.nvm/versions/node/v18.14.1/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 9.3.1 - ~/.nvm/versions/node/v18.14.1/bin/npm\r\n Browsers:\r\n Brave Browser: 117.1.58.124\r\n Chrome: 117.0.5938.88\r\n Firefox: 114.0.2\r\n Safari: 16.6\r\n npmPackages:\r\n @tresjs/cientos: 3.3.0 => 3.3.0 \r\n @tresjs/core: ^3.2.2 => 3.2.2 \r\n @tresjs/eslint-config-vue: ^0.2.1 => 0.2.1 \r\n @tresjs/leches: ^0.10.0 => 0.10.0 \r\n @tresjs/nuxt: 1.1.7 => 1.1.7 \r\n @tresjs/post-processing: ^0.4.0 => 0.4.0 \r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\npnpm\r\n\r\n### Code of Conduct\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/Tresjs/cientos/issues) that reports the same bug to avoid creating a duplicate.\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[3076,3077],{"name":3063,"color":3064},{"name":3078,"color":3079},"good first issue","7057ff",216,"cientos","closed","[Environment] - Background option doesn't work.","2023-09-18T14:15:34Z","https://github.com/Tresjs/cientos/issues/216",0.70730335,{"description":3088,"labels":3089,"number":3090,"owner":3019,"repository":3020,"state":3082,"title":3091,"updated_at":3092,"url":3093,"score":3094},"### Description\r\n\r\nIm probably dumb for asking this but, How do i import and texturize wavefront object files?\r\n\r\n### Suggested solution\r\n\r\nI wanted to use something like \r\n```\r\n\u003COBJModel path=\"/models/AkuAku.obj\" />\r\n```\r\nbut no-where in the docs does it mention wavefront obj.\r\n\r\n\r\n### Alternative\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Validations\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://tresjs.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.",[],884,"Greetings","2024-12-17T21:44:35Z","https://github.com/Tresjs/tres/issues/884",0.72181785,{"description":3096,"labels":3097,"number":3098,"owner":3019,"repository":3081,"state":3082,"title":3099,"updated_at":3100,"url":3101,"score":3102},"### Describe the bug\n\nCameraControls not working, Scene cannot be interacted with.\n\n### Reproduction\n\nhttps://stackblitz.com/edit/vitejs-vite-eg7wqt\n\n### Steps to reproduce\n\n_No response_\n\n### System Info\n\n```shell\nsystem:\r\n OS: windows\r\n CPU: (8) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.2GHz\r\n Memory: 0 Bytes / 0 Bytes\r\n Binaries:\r\n Node: 18.18.0\r\n Yarn: 1.22.19\r\n npm: 9.4.2\r\n pnpm: 8.14.0\r\n npmPackages:\r\n @tresjs/cientos: 3.7.0 => 3.7.0 \r\n @tresjs/core: 3.7.0 => 3.7.0 \r\n vite: ^5.0.12 => 5.0.12\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/Tresjs/cientos/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],341,"CameraControls not working","2024-02-28T17:06:26Z","https://github.com/Tresjs/cientos/issues/341",0.726702,{"description":3104,"labels":3105,"number":3106,"owner":3019,"repository":3020,"state":3082,"title":3107,"updated_at":3108,"url":3109,"score":3110},"### Describe the bug\n\nAs shown in the StackBlitz URL example, `onPointerLeave` was activating in version 3.9 and earlier. However, in version 4.0 and later, it is difficult to activate. How can I use `onPointerLeave`?\r\n\r\n```html\r\n \u003CTresMesh\r\n @pointer-enter=\"onPointerEnter\"\r\n @pointer-leave=\"onPointerLeave\"\r\n name=\"box\"\r\n >\r\n \u003CTresBoxGeometry />\r\n \u003CTresMeshBasicMaterial color=\"#006060\" />\r\n \u003C/TresMesh>\r\n```\r\nThis way of using it is not a good practice.\n\n### Reproduction\n\nhttps://stackblitz.com/edit/tresjs-minimal-reproduction-kentgx?file=src%2Fcomponents%2FTheExperience.vue,src%2FApp.vue\n\n### Steps to reproduce\n\n_No response_\n\n### System Info\n\n_No response_\n\n### Used Package Manager\n\nyarn\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],713,"v4.0.1 The `onPointerLeave` function is not activating.","2024-06-06T14:33:34Z","https://github.com/Tresjs/tres/issues/713",0.72744876,{"description":3112,"labels":3113,"number":3120,"owner":3019,"repository":3020,"state":3082,"title":3121,"updated_at":3122,"url":3123,"score":3124},"### Describe the bug\n\nIt seems like Tres.js is no longer working in Firefox. Even on your official documentation all examles render just a black canvas.\r\nI would really like to use Tres.js in projects of my company, but I am unable to do this if Firefox is not supported or working :(\n\n### Reproduction\n\nhttps://tresjs.org/guide/\n\n### Steps to reproduce\n\nThe first and all other examples of this page.\n\n### System Info\n\n```shell\nWindows 10\r\nFirerfiox version 114.0.1 (64-Bit)\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[3114,3117],{"name":3115,"color":3116},"question","d876e3",{"name":3118,"color":3119},"waiting for author","B145BC",310,"Black Canvas in Firefox","2023-06-20T07:13:04Z","https://github.com/Tresjs/tres/issues/310",0.7275462,["Reactive",3126],{},["Set"],["ShallowReactive",3129],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f1WlMT6OzUAi9WwSGchfIdH6wEm8H_N1zVOI9YcFSIzc":-1},"/Tresjs/cientos/409"]