[{"data":1,"prerenderedAt":914},["ShallowReactive",2],{"navigation":3,"/cookbook/orbit-controls":239,"/cookbook/orbit-controls-surround":909},[4,29,78,173,205,215,219,223,227,231,235],{"title":5,"path":6,"stem":7,"children":8,"icon":27,"titleTemplate":28},"Getting Started","/getting-started","1.getting-started/1.index",[9,12,17,22],{"title":10,"path":6,"stem":7,"icon":11},"Introduction","i-lucide-house",{"title":13,"path":14,"stem":15,"icon":16},"Installation","/getting-started/installation","1.getting-started/2.installation","i-lucide-download",{"title":18,"path":19,"stem":20,"icon":21},"Your First Scene","/getting-started/your-first-scene","1.getting-started/3.your-first-scene","i-lucide-donut",{"title":23,"path":24,"stem":25,"icon":26},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/4.upgrade-guide","i-lucide-circle-arrow-up","i-lucide-rocket","%s · Get Started with TresJS",{"title":30,"path":31,"stem":32,"children":33},"Essentials","/essentials","2.essentials",[34,36,48],{"title":30,"path":31,"stem":35},"2.essentials/index",{"title":37,"icon":38,"open":39,"path":40,"stem":41,"children":42,"page":47},"Core Architecture","i-lucide-cpu",true,"/essentials/core-architecture","2.essentials/1.core-architecture",[43],{"title":44,"path":45,"stem":46},"Custom Vue Renderer","/essentials/core-architecture/custom-vue-renderer","2.essentials/1.core-architecture/2.custom-vue-renderer",false,{"title":49,"icon":50,"open":39,"path":51,"stem":52,"children":53,"page":47},"Key Concepts","i-lucide-medal","/essentials/concepts","2.essentials/2.concepts",[54,58,62,66,70,74],{"title":55,"path":56,"stem":57},"Declarative vs Imperative","/essentials/concepts/declarative-vs-imperative","2.essentials/2.concepts/1.declarative-vs-imperative",{"title":59,"path":60,"stem":61},"Reactivity","/essentials/concepts/reactivity","2.essentials/2.concepts/2.reactivity",{"title":63,"path":64,"stem":65},"Constructor Arguments","/essentials/concepts/constructor-arguments","2.essentials/2.concepts/3.constructor-arguments",{"title":67,"path":68,"stem":69},"Declarative Properties","/essentials/concepts/declarative-properties","2.essentials/2.concepts/4.declarative-properties",{"title":71,"path":72,"stem":73},"Extending the Catalogue","/essentials/concepts/extending-catalogue","2.essentials/2.concepts/5.extending-catalogue",{"title":75,"path":76,"stem":77},"Child Attachments","/essentials/concepts/child-attachments","2.essentials/2.concepts/6.child-attachments",{"title":79,"path":80,"stem":81,"children":82},"API","/api","3.api",[83,86,104,131,141,155],{"title":84,"path":80,"stem":85},"TresJS API Reference","3.api/1.index",{"title":87,"icon":88,"open":39,"path":89,"stem":90,"children":91,"page":47},"Components","i-lucide-box","/api/components","3.api/1.components",[92,96,100],{"title":93,"path":94,"stem":95},"\u003CTresCanvas />","/api/components/tres-canvas","3.api/1.components/tres-canvas",{"title":97,"path":98,"stem":99},"\u003CTresCanvasContext />","/api/components/tres-context","3.api/1.components/tres-context",{"title":101,"path":102,"stem":103},"Tres Components","/api/components/tres-objects","3.api/1.components/tres-objects",{"title":105,"titleTemplate":106,"icon":107,"path":108,"stem":109,"children":110,"page":47},"Composables","%s · TresJS Composables","i-lucide-arrow-right-left","/api/composables","3.api/2.composables",[111,115,119,123,127],{"title":112,"path":113,"stem":114},"useTres","/api/composables/use-tres","3.api/2.composables/1.use-tres",{"title":116,"path":117,"stem":118},"useTresContext","/api/composables/use-tres-context","3.api/2.composables/2.use-tres-context",{"title":120,"path":121,"stem":122},"useLoop","/api/composables/use-loop","3.api/2.composables/3.use-loop",{"title":124,"path":125,"stem":126},"useGraph","/api/composables/use-graph","3.api/2.composables/4.use-graph",{"title":128,"path":129,"stem":130},"useLoader","/api/composables/use-loader","3.api/2.composables/5.use-loader",{"title":132,"icon":133,"path":134,"stem":135,"children":136,"page":47},"Event handling","i-lucide-mouse-pointer-2","/api/events","3.api/3.events",[137],{"title":138,"path":139,"stem":140},"Pointer Events","/api/events/pointer-events","3.api/3.events/1.pointer-events",{"title":142,"icon":143,"path":144,"stem":145,"children":146,"page":47},"Utils","i-lucide-wrench","/api/utils","3.api/4.utils",[147,151],{"title":148,"path":149,"stem":150},"Type Guards","/api/utils/type-guards","3.api/4.utils/1.type-guards",{"title":152,"path":153,"stem":154},"Directives","/api/utils/directives","3.api/4.utils/2.directives",{"title":156,"icon":157,"path":158,"stem":159,"children":160,"page":47},"Advanced","i-lucide-brain-circuit","/api/advanced","3.api/5.advanced",[161,165,169],{"title":162,"path":163,"stem":164},"Scaling Performance 🚀","/api/advanced/performance","3.api/5.advanced/performance",{"title":166,"path":167,"stem":168},"Primitives","/api/advanced/primitives","3.api/5.advanced/primitives",{"title":170,"path":171,"stem":172},"WebGPU","/api/advanced/web-gpu","3.api/5.advanced/web-gpu",{"title":174,"path":175,"stem":176,"children":177},"Cookbook","/cookbook","4.cookbook",[178,181,185,189,193,197,201],{"title":179,"path":175,"stem":180},"Cookbook 🍳🧑‍🍳","4.cookbook/index",{"title":182,"path":183,"stem":184},"OrbitControls","/cookbook/orbit-controls","4.cookbook/1.orbit-controls",{"title":186,"path":187,"stem":188},"Basic Animations","/cookbook/basic-animations","4.cookbook/2.basic-animations",{"title":190,"path":191,"stem":192},"Model Animation","/cookbook/model-animation","4.cookbook/3.model-animation",{"title":194,"path":195,"stem":196},"Advanced GSAP Animations","/cookbook/advanced-gsap-animations","4.cookbook/4.advanced-gsap-animations",{"title":198,"path":199,"stem":200},"Tweakpane","/cookbook/tweakpane","4.cookbook/5.tweakpane",{"title":202,"path":203,"stem":204},"Dynamic components","/cookbook/transition-dynamic","4.cookbook/6.transition-dynamic",{"title":206,"path":207,"stem":208,"children":209},"Community","/community","5.community/1.index",[210,211],{"title":206,"path":207,"stem":208},{"title":212,"path":213,"stem":214},"Awesome Resources","/community/awesome-resources","5.community/awesome-resources",{"title":216,"path":217,"stem":218},"German Translation","/de","de",{"title":220,"path":221,"stem":222},"Spanish Translation","/es","es",{"title":224,"path":225,"stem":226},"French Translation","/fr","fr",{"title":228,"path":229,"stem":230},"Italian Translation","/it","it",{"title":232,"path":233,"stem":234},"Japanese Translation","/jp","jp",{"title":236,"path":237,"stem":238},"Chinese Translation","/zh","zh",{"id":240,"title":182,"body":241,"description":902,"extension":903,"links":904,"meta":905,"navigation":39,"path":183,"seo":907,"stem":184,"__hash__":908},"docs/4.cookbook/1.orbit-controls.md",{"type":242,"value":243,"toc":897},"minimark",[244,247,251,270,275,281,372,389,722,726,733,747,883,893],[245,246],"examples-orbit-controls",{},[248,249,250],"p",{},"OrbitControls is a camera controller that allows you to orbit around a target. It's a great way to explore your scene interactively.",[252,253,254],"note",{},[248,255,256,257,261,262,265,266,269],{},"The OrbitControls utility, which allows users to easily navigate around a 3D scene, isn't included in the core Three.js library by default. To use it, you need to import it manually from the ",[258,259,260],"code",{},"three/addons/controls/OrbitControls"," module via the ",[258,263,264],{},"three-stdlib"," package. Alternatively, if you're using the TresJS ecosystem, you can opt for a ready-to-use version of OrbitControls available as a component in the ",[258,267,268],{},"@tresjs/cientos"," package.",[271,272,274],"h2",{"id":273},"using-orbitcontrols-manually","Using OrbitControls Manually",[248,276,277,278,280],{},"To use ",[258,279,182],{}," manually, import it and extend the catalog:",[282,283,289],"pre",{"className":284,"code":285,"filename":286,"language":287,"meta":288,"style":288},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { extend } from '@tresjs/core'\nimport { OrbitControls } from 'three/addons/controls/OrbitControls'\n\nextend({ OrbitControls })\n","setup.ts","ts","",[258,290,291,324,344,350],{"__ignoreMap":288},[292,293,296,300,304,308,311,314,317,321],"span",{"class":294,"line":295},"line",1,[292,297,299],{"class":298},"s7zQu","import",[292,301,303],{"class":302},"sMK4o"," {",[292,305,307],{"class":306},"sTEyZ"," extend",[292,309,310],{"class":302}," }",[292,312,313],{"class":298}," from",[292,315,316],{"class":302}," '",[292,318,320],{"class":319},"sfazB","@tresjs/core",[292,322,323],{"class":302},"'\n",[292,325,327,329,331,334,336,338,340,342],{"class":294,"line":326},2,[292,328,299],{"class":298},[292,330,303],{"class":302},[292,332,333],{"class":306}," OrbitControls",[292,335,310],{"class":302},[292,337,313],{"class":298},[292,339,316],{"class":302},[292,341,260],{"class":319},[292,343,323],{"class":302},[292,345,347],{"class":294,"line":346},3,[292,348,349],{"emptyLinePlaceholder":39},"\n",[292,351,353,357,360,363,366,369],{"class":294,"line":352},4,[292,354,356],{"class":355},"s2Zo4","extend",[292,358,359],{"class":306},"(",[292,361,362],{"class":302},"{",[292,364,365],{"class":306}," OrbitControls ",[292,367,368],{"class":302},"}",[292,370,371],{"class":306},")\n",[248,373,374,375,378,379,385,386,388],{},"Now you can use the ",[258,376,377],{},"TresOrbitControls"," component in your scene. Since ",[380,381,182],"a",{"href":382,"rel":383},"https://threejs.org/docs/#examples/en/controls/OrbitControls",[384],"nofollow"," needs a reference to the camera and renderer, you can use the ",[258,387,112],{}," composable:",[390,391,392,558],"code-group",{},[282,393,398],{"className":394,"code":395,"filename":396,"language":397,"meta":288,"style":288},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { useTres } from '@tresjs/core'\n\nconst { camera, renderer } = useTres()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresOrbitControls\n    v-if=\"camera\"\n    :args=\"[camera, renderer?.domElement]\"\n  />\n\u003C/template>\n","OrbitControls.vue","vue",[258,399,400,429,448,452,478,488,493,503,512,528,543,549],{"__ignoreMap":288},[292,401,402,405,409,413,416,419,422,424,426],{"class":294,"line":295},[292,403,404],{"class":302},"\u003C",[292,406,408],{"class":407},"swJcz","script",[292,410,412],{"class":411},"spNyl"," setup",[292,414,415],{"class":411}," lang",[292,417,418],{"class":302},"=",[292,420,421],{"class":302},"\"",[292,423,287],{"class":319},[292,425,421],{"class":302},[292,427,428],{"class":302},">\n",[292,430,431,433,435,438,440,442,444,446],{"class":294,"line":326},[292,432,299],{"class":298},[292,434,303],{"class":302},[292,436,437],{"class":306}," useTres",[292,439,310],{"class":302},[292,441,313],{"class":298},[292,443,316],{"class":302},[292,445,320],{"class":319},[292,447,323],{"class":302},[292,449,450],{"class":294,"line":346},[292,451,349],{"emptyLinePlaceholder":39},[292,453,454,457,459,462,465,468,470,473,475],{"class":294,"line":352},[292,455,456],{"class":411},"const",[292,458,303],{"class":302},[292,460,461],{"class":306}," camera",[292,463,464],{"class":302},",",[292,466,467],{"class":306}," renderer ",[292,469,368],{"class":302},[292,471,472],{"class":302}," =",[292,474,437],{"class":355},[292,476,477],{"class":306},"()\n",[292,479,481,484,486],{"class":294,"line":480},5,[292,482,483],{"class":302},"\u003C/",[292,485,408],{"class":407},[292,487,428],{"class":302},[292,489,491],{"class":294,"line":490},6,[292,492,349],{"emptyLinePlaceholder":39},[292,494,496,498,501],{"class":294,"line":495},7,[292,497,404],{"class":302},[292,499,500],{"class":407},"template",[292,502,428],{"class":302},[292,504,506,509],{"class":294,"line":505},8,[292,507,508],{"class":302},"  \u003C",[292,510,511],{"class":407},"TresOrbitControls\n",[292,513,515,518,520,522,525],{"class":294,"line":514},9,[292,516,517],{"class":411},"    v-if",[292,519,418],{"class":302},[292,521,421],{"class":302},[292,523,524],{"class":319},"camera",[292,526,527],{"class":302},"\"\n",[292,529,531,534,536,538,541],{"class":294,"line":530},10,[292,532,533],{"class":411},"    :args",[292,535,418],{"class":302},[292,537,421],{"class":302},[292,539,540],{"class":319},"[camera, renderer?.domElement]",[292,542,527],{"class":302},[292,544,546],{"class":294,"line":545},11,[292,547,548],{"class":302},"  />\n",[292,550,552,554,556],{"class":294,"line":551},12,[292,553,483],{"class":302},[292,555,500],{"class":407},[292,557,428],{"class":302},[282,559,562],{"className":394,"code":560,"filename":561,"language":397,"meta":288,"style":288},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport OrbitControls from './OrbitControls.vue'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas shadows alpha>\n    \u003CTresPerspectiveCamera :args=\"[45, 1, 0.1, 1000]\" />\n    \u003COrbitControls />\n    \u003CTresGridHelper :args=\"[10, 10]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n","App.vue",[258,563,564,584,603,619,627,631,639,654,677,685,705,714],{"__ignoreMap":288},[292,565,566,568,570,572,574,576,578,580,582],{"class":294,"line":295},[292,567,404],{"class":302},[292,569,408],{"class":407},[292,571,412],{"class":411},[292,573,415],{"class":411},[292,575,418],{"class":302},[292,577,421],{"class":302},[292,579,287],{"class":319},[292,581,421],{"class":302},[292,583,428],{"class":302},[292,585,586,588,590,593,595,597,599,601],{"class":294,"line":326},[292,587,299],{"class":298},[292,589,303],{"class":302},[292,591,592],{"class":306}," TresCanvas",[292,594,310],{"class":302},[292,596,313],{"class":298},[292,598,316],{"class":302},[292,600,320],{"class":319},[292,602,323],{"class":302},[292,604,605,607,609,612,614,617],{"class":294,"line":346},[292,606,299],{"class":298},[292,608,365],{"class":306},[292,610,611],{"class":298},"from",[292,613,316],{"class":302},[292,615,616],{"class":319},"./OrbitControls.vue",[292,618,323],{"class":302},[292,620,621,623,625],{"class":294,"line":352},[292,622,483],{"class":302},[292,624,408],{"class":407},[292,626,428],{"class":302},[292,628,629],{"class":294,"line":480},[292,630,349],{"emptyLinePlaceholder":39},[292,632,633,635,637],{"class":294,"line":490},[292,634,404],{"class":302},[292,636,500],{"class":407},[292,638,428],{"class":302},[292,640,641,643,646,649,652],{"class":294,"line":495},[292,642,508],{"class":302},[292,644,645],{"class":407},"TresCanvas",[292,647,648],{"class":411}," shadows",[292,650,651],{"class":411}," alpha",[292,653,428],{"class":302},[292,655,656,659,662,665,667,669,672,674],{"class":294,"line":505},[292,657,658],{"class":302},"    \u003C",[292,660,661],{"class":407},"TresPerspectiveCamera",[292,663,664],{"class":411}," :args",[292,666,418],{"class":302},[292,668,421],{"class":302},[292,670,671],{"class":319},"[45, 1, 0.1, 1000]",[292,673,421],{"class":302},[292,675,676],{"class":302}," />\n",[292,678,679,681,683],{"class":294,"line":514},[292,680,658],{"class":302},[292,682,182],{"class":407},[292,684,676],{"class":302},[292,686,687,689,692,694,696,698,701,703],{"class":294,"line":530},[292,688,658],{"class":302},[292,690,691],{"class":407},"TresGridHelper",[292,693,664],{"class":411},[292,695,418],{"class":302},[292,697,421],{"class":302},[292,699,700],{"class":319},"[10, 10]",[292,702,421],{"class":302},[292,704,676],{"class":302},[292,706,707,710,712],{"class":294,"line":545},[292,708,709],{"class":302},"  \u003C/",[292,711,645],{"class":407},[292,713,428],{"class":302},[292,715,716,718,720],{"class":294,"line":551},[292,717,483],{"class":302},[292,719,500],{"class":407},[292,721,428],{"class":302},[723,724],"read-more",{"to":725},"/api/components/tres-objects#extending-the-catalogue",[271,727,729,730,732],{"id":728},"orbitcontrols-from-tresjscientos-recommended","OrbitControls from ",[258,731,268],{}," (Recommended)",[248,734,735,736,742,743,746],{},"The ",[380,737,740],{"href":738,"rel":739},"https://cientos.tresjs.org/",[384],[258,741,268],{}," package provides a plug-and-play ",[258,744,745],{},"\u003COrbitControls />"," component that wraps the ThreeJS OrbitControls. You don't need to extend the catalog or pass any arguments—it just works!",[282,748,751],{"className":394,"code":749,"filename":750,"language":397,"meta":288,"style":288},"\u003Cscript setup lang=\"ts\">\nimport { OrbitControls } from '@tresjs/cientos'\nimport { TresCanvas } from '@tresjs/core'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas shadows alpha>\n    \u003CTresPerspectiveCamera :args=\"[45, 1, 0.1, 1000]\" />\n    \u003COrbitControls />\n  \u003C/TresCanvas>\n\u003C/template>\n","CientosOrbitControls.vue",[258,752,753,773,791,809,817,821,829,841,859,867,875],{"__ignoreMap":288},[292,754,755,757,759,761,763,765,767,769,771],{"class":294,"line":295},[292,756,404],{"class":302},[292,758,408],{"class":407},[292,760,412],{"class":411},[292,762,415],{"class":411},[292,764,418],{"class":302},[292,766,421],{"class":302},[292,768,287],{"class":319},[292,770,421],{"class":302},[292,772,428],{"class":302},[292,774,775,777,779,781,783,785,787,789],{"class":294,"line":326},[292,776,299],{"class":298},[292,778,303],{"class":302},[292,780,333],{"class":306},[292,782,310],{"class":302},[292,784,313],{"class":298},[292,786,316],{"class":302},[292,788,268],{"class":319},[292,790,323],{"class":302},[292,792,793,795,797,799,801,803,805,807],{"class":294,"line":346},[292,794,299],{"class":298},[292,796,303],{"class":302},[292,798,592],{"class":306},[292,800,310],{"class":302},[292,802,313],{"class":298},[292,804,316],{"class":302},[292,806,320],{"class":319},[292,808,323],{"class":302},[292,810,811,813,815],{"class":294,"line":352},[292,812,483],{"class":302},[292,814,408],{"class":407},[292,816,428],{"class":302},[292,818,819],{"class":294,"line":480},[292,820,349],{"emptyLinePlaceholder":39},[292,822,823,825,827],{"class":294,"line":490},[292,824,404],{"class":302},[292,826,500],{"class":407},[292,828,428],{"class":302},[292,830,831,833,835,837,839],{"class":294,"line":495},[292,832,508],{"class":302},[292,834,645],{"class":407},[292,836,648],{"class":411},[292,838,651],{"class":411},[292,840,428],{"class":302},[292,842,843,845,847,849,851,853,855,857],{"class":294,"line":505},[292,844,658],{"class":302},[292,846,661],{"class":407},[292,848,664],{"class":411},[292,850,418],{"class":302},[292,852,421],{"class":302},[292,854,671],{"class":319},[292,856,421],{"class":302},[292,858,676],{"class":302},[292,860,861,863,865],{"class":294,"line":514},[292,862,658],{"class":302},[292,864,182],{"class":407},[292,866,676],{"class":302},[292,868,869,871,873],{"class":294,"line":530},[292,870,709],{"class":302},[292,872,645],{"class":407},[292,874,428],{"class":302},[292,876,877,879,881],{"class":294,"line":545},[292,878,483],{"class":302},[292,880,500],{"class":407},[292,882,428],{"class":302},[884,885,886],"tip",{},[248,887,888,889,892],{},"Make sure the ",[258,890,891],{},"PerspectiveCamera"," is set first in the canvas, otherwise controls might not work as expected.",[894,895,896],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}",{"title":288,"searchDepth":295,"depth":326,"links":898},[899,900],{"id":273,"depth":326,"text":274},{"id":728,"depth":326,"text":901},"OrbitControls from @tresjs/cientos (Recommended)","Learn how to use OrbitControls in TresJS, including both manual and plug-and-play approaches.","md",null,{"thumbnail":906},"/recipes/orbit-controls.png",{"title":182,"description":902},"oKNa2i-YMn_K6OD3hqe8VSUt2RYZgV5Cgvlk_xinbw0",[910,912],{"title":179,"path":175,"stem":180,"description":911,"children":-1},"Discover guided recipes to help you get started with the basics of using Tres. Each recipe is designed to help you understand the core concepts of Tres and how to use them in your projects.",{"title":186,"path":187,"stem":188,"description":913,"children":-1},"Learn how to create basic animations in TresJS",1782052336074]