[{"data":1,"prerenderedAt":4307},["ShallowReactive",2],{"navigation":3,"/api/controls":478,"/api/controls-surround":499,"control-list":504},[4,22],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","1.getting-started/1.index",[9,10,14,18],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation Guide","/getting-started/installation","1.getting-started/2.installation",{"title":15,"path":16,"stem":17},"Usage","/getting-started/usage","1.getting-started/3.usage",{"title":19,"path":20,"stem":21},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/4.upgrade-guide",{"title":23,"path":24,"stem":25,"children":26},"Api","/api","2.api",[27,30,84,114,156,194,288,314,348,398,444],{"title":28,"path":24,"stem":29},"All","2.api/index",{"title":31,"path":32,"stem":33,"children":34},"Abstractions","/api/abstractions","2.api/1.abstractions/index",[35,36,40,44,48,52,56,60,64,68,72,76,80],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39},"Align","/api/abstractions/align","2.api/1.abstractions/align",{"title":41,"path":42,"stem":43},"Billboard","/api/abstractions/billboard","2.api/1.abstractions/billboard",{"title":45,"path":46,"stem":47},"Camera Shake","/api/abstractions/camera-shake","2.api/1.abstractions/camera-shake",{"title":49,"path":50,"stem":51},"Decal","/api/abstractions/decal","2.api/1.abstractions/decal",{"title":53,"path":54,"stem":55},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":57,"path":58,"stem":59},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":61,"path":62,"stem":63},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":65,"path":66,"stem":67},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":69,"path":70,"stem":71},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":73,"path":74,"stem":75},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":77,"path":78,"stem":79},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":81,"path":82,"stem":83},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":85,"path":86,"stem":87,"children":88},"Controls","/api/controls","2.api/2.controls/index",[89,90,94,98,102,106,110],{"title":85,"path":86,"stem":87},{"title":91,"path":92,"stem":93},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-controls",{"title":95,"path":96,"stem":97},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":99,"path":100,"stem":101},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":103,"path":104,"stem":105},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":107,"path":108,"stem":109},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":111,"path":112,"stem":113},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":115,"path":116,"stem":117,"children":118},"Loaders","/api/loaders","2.api/3.loaders/index",[119,120,124,128,132,136,140,144,148,152],{"title":115,"path":116,"stem":117},{"title":121,"path":122,"stem":123},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":125,"path":126,"stem":127},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":129,"path":130,"stem":131},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":133,"path":134,"stem":135},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":137,"path":138,"stem":139},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":141,"path":142,"stem":143},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":145,"path":146,"stem":147},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":149,"path":150,"stem":151},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":153,"path":154,"stem":155},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":157,"path":158,"stem":159,"children":160},"Materials","/api/materials","2.api/4.materials/index",[161,162,166,170,174,178,182,186,190],{"title":157,"path":158,"stem":159},{"title":163,"path":164,"stem":165},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":167,"path":168,"stem":169},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":171,"path":172,"stem":173},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":175,"path":176,"stem":177},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":179,"path":180,"stem":181},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":183,"path":184,"stem":185},"Mesh Transmission Material","/api/materials/mesh-transmission-material","2.api/4.materials/mesh-transmission-material",{"title":187,"path":188,"stem":189},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":191,"path":192,"stem":193},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":195,"path":196,"stem":197,"children":198},"Shapes","/api/shapes","2.api/5.shapes/index",[199,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284],{"title":195,"path":196,"stem":197},{"title":201,"path":202,"stem":203},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":205,"path":206,"stem":207},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":209,"path":210,"stem":211},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":213,"path":214,"stem":215},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":217,"path":218,"stem":219},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":221,"path":222,"stem":223},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":225,"path":226,"stem":227},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":229,"path":230,"stem":231},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":233,"path":234,"stem":235},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":237,"path":238,"stem":239},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":241,"path":242,"stem":243},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":245,"path":246,"stem":247},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":249,"path":250,"stem":251},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":253,"path":254,"stem":255},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":257,"path":258,"stem":259},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":261,"path":262,"stem":263},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":265,"path":266,"stem":267},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":269,"path":270,"stem":271},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":273,"path":274,"stem":275},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":277,"path":278,"stem":279},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":281,"path":282,"stem":283},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":285,"path":286,"stem":287},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":289,"path":290,"stem":291,"children":292},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[293,294,298,302,306,310],{"title":289,"path":290,"stem":291},{"title":295,"path":296,"stem":297},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":299,"path":300,"stem":301},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":303,"path":304,"stem":305},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":307,"path":308,"stem":309},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":311,"path":312,"stem":313},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":315,"path":316,"stem":317,"children":318},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[319,320,324,328,332,336,340,344],{"title":315,"path":316,"stem":317},{"title":321,"path":322,"stem":323},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":325,"path":326,"stem":327},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":329,"path":330,"stem":331},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":333,"path":334,"stem":335},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":337,"path":338,"stem":339},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":341,"path":342,"stem":343},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":345,"path":346,"stem":347},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":349,"path":350,"stem":351,"children":352},"Staging","/api/staging","2.api/8.staging/index",[353,354,358,362,366,370,374,378,382,386,390,394],{"title":349,"path":350,"stem":351},{"title":355,"path":356,"stem":357},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":359,"path":360,"stem":361},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":363,"path":364,"stem":365},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":367,"path":368,"stem":369},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":371,"path":372,"stem":373},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":375,"path":376,"stem":377},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":379,"path":380,"stem":381},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":383,"path":384,"stem":385},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":387,"path":388,"stem":389},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":391,"path":392,"stem":393},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":395,"path":396,"stem":397},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":399,"path":400,"stem":401,"children":402},"Objects","/api/objects","2.api/9.objects/index",[403,404,408,412,416,420,424,428,432,436,440],{"title":399,"path":400,"stem":401},{"title":405,"path":406,"stem":407},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":409,"path":410,"stem":411},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":413,"path":414,"stem":415},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":417,"path":418,"stem":419},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":421,"path":422,"stem":423},"HTML","/api/objects/html","2.api/9.objects/html",{"title":425,"path":426,"stem":427},"Image","/api/objects/image","2.api/9.objects/image",{"title":429,"path":430,"stem":431},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":433,"path":434,"stem":435},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":437,"path":438,"stem":439},"Text","/api/objects/text","2.api/9.objects/text",{"title":441,"path":442,"stem":443},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":445,"path":446,"stem":447,"children":448},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[449,450,454,458,462,466,470,474],{"title":445,"path":446,"stem":447},{"title":451,"path":452,"stem":453},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":455,"path":456,"stem":457},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":459,"path":460,"stem":461},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":463,"path":464,"stem":465},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":467,"path":468,"stem":469},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":471,"path":472,"stem":473},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":475,"path":476,"stem":477},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":479,"title":85,"body":480,"description":492,"extension":493,"links":494,"meta":495,"navigation":496,"path":86,"seo":497,"stem":87,"__hash__":498},"docs/2.api/2.controls/index.md",{"type":481,"value":482,"toc":487},"minimark",[483],[484,485],"api-list",{"list-name":486},"control-list",{"title":488,"searchDepth":489,"depth":490,"links":491},"",1,2,[],"All currently supported controls","md",null,{},true,{"title":85,"description":492},"G_8gDVh6wxBKwr8OPaeiDq4nR7BnxAMmQ9FukYHaIDI",[500,502],{"title":81,"path":82,"stem":83,"description":501,"children":-1},"Position objects in front of the camera with CSS-like positioning.",{"title":91,"path":92,"stem":93,"description":503,"children":-1},"Is similar to OrbitControls yet supports smooth transitions and more features.",[505,1827,2222,2523,3228,3584],{"id":506,"title":91,"body":507,"description":503,"extension":493,"links":494,"meta":1824,"navigation":496,"path":92,"seo":1825,"stem":93,"__hash__":1826},"docs/2.api/2.controls/camera-controls.md",{"type":481,"value":508,"toc":1815},[509,515,530,539,543,795,801,805,808,1277,1280,1309,1440,1445,1574,1584,1587,1711,1715,1771,1811],[510,511,512],"scene-controls-wrapper",{},[513,514],"controls-camera-controls",{},[516,517,518,525,526,529],"p",{},[519,520,524],"a",{"href":521,"rel":522},"https://github.com/yomotsu/camera-controls",[523],"nofollow","CameraControls"," is a camera controller similar to ",[519,527,528],{"href":104},"OrbitControls"," yet supports smooth transitions and more features.",[516,531,532,533,538],{},"However, it is thirty party library for ThreeJS. So to use it you would need to install and import using ",[519,534,537],{"href":535,"rel":536},"https://www.npmjs.com/package/camera-controls",[523],"npm",".",[540,541,15],"h2",{"id":542},"usage",[544,545,551],"pre",{"className":546,"code":547,"highlights":548,"language":550,"meta":488,"style":488},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport { CameraControls } from \"@tresjs/cientos\"\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#82DBC5\">\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" />\n    \u003CCameraControls />\n    \u003CBox :scale=\"2\">\n      \u003CTresMeshToonMaterial color=\"orange\" />\n    \u003C/Box>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n    \u003CTresGridHelper />\n  \u003C/TresCanvas>\n\u003C/template>\n",[549],7,"vue",[552,553,554,573,602,612,622,647,671,681,702,725,735,745,766,776,786],"code",{"__ignoreMap":488},[555,556,558,562,566,570],"span",{"class":557,"line":489},"line",[555,559,561],{"class":560},"sMK4o","\u003C",[555,563,565],{"class":564},"swJcz","script",[555,567,569],{"class":568},"spNyl"," setup",[555,571,572],{"class":560},">\n",[555,574,575,579,582,586,589,592,595,599],{"class":557,"line":490},[555,576,578],{"class":577},"s7zQu","import",[555,580,581],{"class":560}," {",[555,583,585],{"class":584},"sTEyZ"," CameraControls",[555,587,588],{"class":560}," }",[555,590,591],{"class":577}," from",[555,593,594],{"class":560}," \"",[555,596,598],{"class":597},"sfazB","@tresjs/cientos",[555,600,601],{"class":560},"\"\n",[555,603,605,608,610],{"class":557,"line":604},3,[555,606,607],{"class":560},"\u003C/",[555,609,565],{"class":564},[555,611,572],{"class":560},[555,613,615,617,620],{"class":557,"line":614},4,[555,616,561],{"class":560},[555,618,619],{"class":564},"template",[555,621,572],{"class":560},[555,623,625,628,631,634,637,640,643,645],{"class":557,"line":624},5,[555,626,627],{"class":560},"  \u003C",[555,629,630],{"class":564},"TresCanvas",[555,632,633],{"class":568}," clear-color",[555,635,636],{"class":560},"=",[555,638,639],{"class":560},"\"",[555,641,642],{"class":597},"#82DBC5",[555,644,639],{"class":560},[555,646,572],{"class":560},[555,648,650,653,656,659,661,663,666,668],{"class":557,"line":649},6,[555,651,652],{"class":560},"    \u003C",[555,654,655],{"class":564},"TresPerspectiveCamera",[555,657,658],{"class":568}," :position",[555,660,636],{"class":560},[555,662,639],{"class":560},[555,664,665],{"class":597},"[3, 3, 3]",[555,667,639],{"class":560},[555,669,670],{"class":560}," />\n",[555,672,675,677,679],{"class":673,"line":549},[557,674],"highlight",[555,676,652],{"class":560},[555,678,524],{"class":564},[555,680,670],{"class":560},[555,682,684,686,688,691,693,695,698,700],{"class":557,"line":683},8,[555,685,652],{"class":560},[555,687,201],{"class":564},[555,689,690],{"class":568}," :scale",[555,692,636],{"class":560},[555,694,639],{"class":560},[555,696,697],{"class":597},"2",[555,699,639],{"class":560},[555,701,572],{"class":560},[555,703,705,708,711,714,716,718,721,723],{"class":557,"line":704},9,[555,706,707],{"class":560},"      \u003C",[555,709,710],{"class":564},"TresMeshToonMaterial",[555,712,713],{"class":568}," color",[555,715,636],{"class":560},[555,717,639],{"class":560},[555,719,720],{"class":597},"orange",[555,722,639],{"class":560},[555,724,670],{"class":560},[555,726,728,731,733],{"class":557,"line":727},10,[555,729,730],{"class":560},"    \u003C/",[555,732,201],{"class":564},[555,734,572],{"class":560},[555,736,738,740,743],{"class":557,"line":737},11,[555,739,652],{"class":560},[555,741,742],{"class":564},"TresAmbientLight",[555,744,670],{"class":560},[555,746,748,750,753,755,757,759,762,764],{"class":557,"line":747},12,[555,749,652],{"class":560},[555,751,752],{"class":564},"TresDirectionalLight",[555,754,658],{"class":568},[555,756,636],{"class":560},[555,758,639],{"class":560},[555,760,761],{"class":597},"[0, 2, 4]",[555,763,639],{"class":560},[555,765,670],{"class":560},[555,767,769,771,774],{"class":557,"line":768},13,[555,770,652],{"class":560},[555,772,773],{"class":564},"TresGridHelper",[555,775,670],{"class":560},[555,777,779,782,784],{"class":557,"line":778},14,[555,780,781],{"class":560},"  \u003C/",[555,783,630],{"class":564},[555,785,572],{"class":560},[555,787,789,791,793],{"class":557,"line":788},15,[555,790,607],{"class":560},[555,792,619],{"class":564},[555,794,572],{"class":560},[796,797,798],"prose-warning",{},[516,799,800],{},"Is really important that the Perspective camera is set first in the canvas. Otherwise might break.",[540,802,804],{"id":803},"props","Props",[516,806,807],{},"Certainly! Here's the properties of the object in raw markdown table format:",[809,810,811,828],"table",{},[812,813,814],"thead",{},[815,816,817,822,825],"tr",{},[818,819,821],"th",{"align":820},"left","Prop",[818,823,824],{"align":820},"Description",[818,826,827],{},"Default",[829,830,831,848,863,877,892,907,922,937,952,967,981,998,1013,1027,1042,1057,1071,1086,1100,1114,1130,1145,1161,1175,1193,1208,1226,1241,1261],"tbody",{},[815,832,833,840,843],{},[834,835,836],"td",{"align":820},[837,838,839],"strong",{},"makeDefault",[834,841,842],{"align":820},"Whether to make this the default controls.",[834,844,845],{},[552,846,847],{},"false",[815,849,850,855,858],{},[834,851,852],{"align":820},[837,853,854],{},"camera",[834,856,857],{"align":820},"The camera to control.",[834,859,860],{},[552,861,862],{},"undefined",[815,864,865,870,873],{},[834,866,867],{"align":820},[837,868,869],{},"domElement",[834,871,872],{"align":820},"The DOM element to listen to.",[834,874,875],{},[552,876,862],{},[815,878,879,884,887],{},[834,880,881],{"align":820},[837,882,883],{},"minPolarAngle",[834,885,886],{"align":820},"Minimum vertical angle in radians.",[834,888,889],{},[552,890,891],{},"0",[815,893,894,899,902],{},[834,895,896],{"align":820},[837,897,898],{},"maxPolarAngle",[834,900,901],{"align":820},"Maximum vertical angle in radians.",[834,903,904],{},[552,905,906],{},"Math.PI",[815,908,909,914,917],{},[834,910,911],{"align":820},[837,912,913],{},"minAzimuthAngle",[834,915,916],{"align":820},"Minimum horizontal angle in radians.",[834,918,919],{},[552,920,921],{},"-Infinity",[815,923,924,929,932],{},[834,925,926],{"align":820},[837,927,928],{},"maxAzimuthAngle",[834,930,931],{"align":820},"Maximum horizontal angle in radians.",[834,933,934],{},[552,935,936],{},"Infinity",[815,938,939,944,947],{},[834,940,941],{"align":820},[837,942,943],{},"distance",[834,945,946],{"align":820},"Current distance.",[834,948,949],{},[552,950,951],{},"camera.position.z",[815,953,954,959,962],{},[834,955,956],{"align":820},[837,957,958],{},"minDistance",[834,960,961],{"align":820},"Minimum distance for dolly. PerspectiveCamera only.",[834,963,964],{},[552,965,966],{},"Number.EPSILON",[815,968,969,974,977],{},[834,970,971],{"align":820},[837,972,973],{},"maxDistance",[834,975,976],{"align":820},"Maximum distance for dolly. PerspectiveCamera only.",[834,978,979],{},[552,980,936],{},[815,982,983,988,994],{},[834,984,985],{"align":820},[837,986,987],{},"infinityDolly",[834,989,990,993],{"align":820},[552,991,992],{},"true"," to enable Infinity Dolly for wheel and pinch.",[834,995,996],{},[552,997,847],{},[815,999,1000,1005,1008],{},[834,1001,1002],{"align":820},[837,1003,1004],{},"minZoom",[834,1006,1007],{"align":820},"Minimum camera zoom.",[834,1009,1010],{},[552,1011,1012],{},"0.01",[815,1014,1015,1020,1023],{},[834,1016,1017],{"align":820},[837,1018,1019],{},"maxZoom",[834,1021,1022],{"align":820},"Maximum camera zoom.",[834,1024,1025],{},[552,1026,936],{},[815,1028,1029,1034,1037],{},[834,1030,1031],{"align":820},[837,1032,1033],{},"smoothTime",[834,1035,1036],{"align":820},"Approximate time in seconds to reach the target. A smaller value will reach the target faster.",[834,1038,1039],{},[552,1040,1041],{},"0.25",[815,1043,1044,1049,1052],{},[834,1045,1046],{"align":820},[837,1047,1048],{},"draggingSmoothTime",[834,1050,1051],{"align":820},"The smoothTime while dragging.",[834,1053,1054],{},[552,1055,1056],{},"0.125",[815,1058,1059,1064,1067],{},[834,1060,1061],{"align":820},[837,1062,1063],{},"maxSpeed",[834,1065,1066],{"align":820},"Max transition speed in units per second.",[834,1068,1069],{},[552,1070,936],{},[815,1072,1073,1078,1081],{},[834,1074,1075],{"align":820},[837,1076,1077],{},"azimuthRotateSpeed",[834,1079,1080],{"align":820},"Speed of azimuth (horizontal) rotation.",[834,1082,1083],{},[552,1084,1085],{},"1.0",[815,1087,1088,1093,1096],{},[834,1089,1090],{"align":820},[837,1091,1092],{},"polarRotateSpeed",[834,1094,1095],{"align":820},"Speed of polar (vertical) rotation.",[834,1097,1098],{},[552,1099,1085],{},[815,1101,1102,1107,1110],{},[834,1103,1104],{"align":820},[837,1105,1106],{},"dollySpeed",[834,1108,1109],{"align":820},"Speed of mouse-wheel dollying.",[834,1111,1112],{},[552,1113,1085],{},[815,1115,1116,1121,1126],{},[834,1117,1118],{"align":820},[837,1119,1120],{},"dollyDragInverted",[834,1122,1123,1125],{"align":820},[552,1124,992],{}," to invert direction when dollying or zooming via drag.",[834,1127,1128],{},[552,1129,847],{},[815,1131,1132,1137,1140],{},[834,1133,1134],{"align":820},[837,1135,1136],{},"truckSpeed",[834,1138,1139],{"align":820},"Speed of drag for truck and pedestal.",[834,1141,1142],{},[552,1143,1144],{},"2.0",[815,1146,1147,1152,1157],{},[834,1148,1149],{"align":820},[837,1150,1151],{},"dollyToCursor",[834,1153,1154,1156],{"align":820},[552,1155,992],{}," to enable Dolly-in to the mouse cursor coords.",[834,1158,1159],{},[552,1160,847],{},[815,1162,1163,1168,1171],{},[834,1164,1165],{"align":820},[837,1166,1167],{},"dragToOffset",[834,1169,1170],{"align":820},"Whether to drag to offset.",[834,1172,1173],{},[552,1174,847],{},[815,1176,1177,1182,1189],{},[834,1178,1179],{"align":820},[837,1180,1181],{},"verticalDragToForward",[834,1183,1184,1185,1188],{"align":820},"The same as ",[552,1186,1187],{},".screenSpacePanning"," in Three.js's OrbitControls.",[834,1190,1191],{},[552,1192,847],{},[815,1194,1195,1200,1203],{},[834,1196,1197],{"align":820},[837,1198,1199],{},"boundaryFriction",[834,1201,1202],{"align":820},"Friction ratio of the boundary.",[834,1204,1205],{},[552,1206,1207],{},"0.0",[815,1209,1210,1215,1222],{},[834,1211,1212],{"align":820},[837,1213,1214],{},"restThreshold",[834,1216,1217,1218,1221],{"align":820},"Controls how soon the ",[552,1219,1220],{},"rest"," event fires as the camera slows.",[834,1223,1224],{},[552,1225,1012],{},[815,1227,1228,1233,1236],{},[834,1229,1230],{"align":820},[837,1231,1232],{},"colliderMeshes",[834,1234,1235],{"align":820},"An array of Meshes to collide with the camera. Be aware colliderMeshes may decrease performance. The collision test uses 4 raycasters from the camera since the near plane has 4 corners.",[834,1237,1238],{},[552,1239,1240],{},"[]",[815,1242,1243,1248,1251],{},[834,1244,1245],{"align":820},[837,1246,1247],{},"mouseButtons",[834,1249,1250],{"align":820},"Configuration of actions on mouse input.",[834,1252,1253,1254,1260],{},"See ",[519,1255,1257],{"href":1256},"#user-input-config",[552,1258,1259],{},"User input config"," for details",[815,1262,1263,1268,1271],{},[834,1264,1265],{"align":820},[837,1266,1267],{},"touches",[834,1269,1270],{"align":820},"Configuration of actions on touch.",[834,1272,1253,1273,1260],{},[519,1274,1275],{"href":1256},[552,1276,1259],{},[540,1278,1259],{"id":1279},"user-input-config",[516,1281,1282,1283,1285,1286,1288,1289,1297,1298,1300,1301,1304,1305,1308],{},"You can easily override the default user input config by defining ",[552,1284,1247],{}," and/or ",[552,1287,1267],{}," props that correspond to ",[519,1290,1293,1296],{"href":1291,"rel":1292},"https://github.com/yomotsu/camera-controls?#user-input-config",[523],[552,1294,1295],{},"camera-controls"," settings",". For ease of use, we're re-exporting the ",[552,1299,524],{}," class as ",[552,1302,1303],{},"BaseCameraControls"," which gives you access to the ",[552,1306,1307],{},"ACTION"," enum.",[544,1310,1312],{"className":546,"code":1311,"language":550,"meta":488,"style":488},"\u003Cscript lang=\"ts\" setup>\nimport { BaseCameraControls, CameraControls } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  ...\n  \u003CCameraControls\n    :mouse-buttons=\"{ left: BaseCameraControls.ACTION.DOLLY }\"\n    :touches=\"{ one: BaseCameraControls.ACTION.TOUCH_TRUCK }\"\n  />\n  ...\n\u003C/template>\n",[552,1313,1314,1336,1362,1370,1375,1383,1388,1395,1409,1423,1428,1432],{"__ignoreMap":488},[555,1315,1316,1318,1320,1323,1325,1327,1330,1332,1334],{"class":557,"line":489},[555,1317,561],{"class":560},[555,1319,565],{"class":564},[555,1321,1322],{"class":568}," lang",[555,1324,636],{"class":560},[555,1326,639],{"class":560},[555,1328,1329],{"class":597},"ts",[555,1331,639],{"class":560},[555,1333,569],{"class":568},[555,1335,572],{"class":560},[555,1337,1338,1340,1342,1345,1348,1350,1352,1354,1357,1359],{"class":557,"line":490},[555,1339,578],{"class":577},[555,1341,581],{"class":560},[555,1343,1344],{"class":584}," BaseCameraControls",[555,1346,1347],{"class":560},",",[555,1349,585],{"class":584},[555,1351,588],{"class":560},[555,1353,591],{"class":577},[555,1355,1356],{"class":560}," '",[555,1358,598],{"class":597},[555,1360,1361],{"class":560},"'\n",[555,1363,1364,1366,1368],{"class":557,"line":604},[555,1365,607],{"class":560},[555,1367,565],{"class":564},[555,1369,572],{"class":560},[555,1371,1372],{"class":557,"line":614},[555,1373,1374],{"emptyLinePlaceholder":496},"\n",[555,1376,1377,1379,1381],{"class":557,"line":624},[555,1378,561],{"class":560},[555,1380,619],{"class":564},[555,1382,572],{"class":560},[555,1384,1385],{"class":557,"line":649},[555,1386,1387],{"class":584},"  ...\n",[555,1389,1390,1392],{"class":557,"line":549},[555,1391,627],{"class":560},[555,1393,1394],{"class":564},"CameraControls\n",[555,1396,1397,1400,1402,1404,1407],{"class":557,"line":683},[555,1398,1399],{"class":568},"    :mouse-buttons",[555,1401,636],{"class":560},[555,1403,639],{"class":560},[555,1405,1406],{"class":597},"{ left: BaseCameraControls.ACTION.DOLLY }",[555,1408,601],{"class":560},[555,1410,1411,1414,1416,1418,1421],{"class":557,"line":704},[555,1412,1413],{"class":568},"    :touches",[555,1415,636],{"class":560},[555,1417,639],{"class":560},[555,1419,1420],{"class":597},"{ one: BaseCameraControls.ACTION.TOUCH_TRUCK }",[555,1422,601],{"class":560},[555,1424,1425],{"class":557,"line":727},[555,1426,1427],{"class":560},"  />\n",[555,1429,1430],{"class":557,"line":737},[555,1431,1387],{"class":584},[555,1433,1434,1436,1438],{"class":557,"line":747},[555,1435,607],{"class":560},[555,1437,619],{"class":564},[555,1439,572],{"class":560},[1441,1442,1444],"h3",{"id":1443},"mouse-buttons","Mouse buttons",[809,1446,1447,1459],{},[812,1448,1449],{},[815,1450,1451,1454,1457],{},[818,1452,1453],{},"Button to assign",[818,1455,1456],{},"Options",[818,1458,827],{},[829,1460,1461,1493,1518,1548],{},[815,1462,1463,1468,1489],{},[834,1464,1465],{},[552,1466,1467],{},"mouseButtons.left",[834,1469,1470,1473,1474,1473,1477,1473,1480,1473,1483,1473,1486],{},[552,1471,1472],{},"ROTATE"," | ",[552,1475,1476],{},"TRUCK",[552,1478,1479],{},"OFFSET",[552,1481,1482],{},"DOLLY",[552,1484,1485],{},"ZOOM",[552,1487,1488],{},"NONE",[834,1490,1491],{},[552,1492,1472],{},[815,1494,1495,1500,1514],{},[834,1496,1497],{},[552,1498,1499],{},"mouseButtons.right",[834,1501,1502,1473,1504,1473,1506,1473,1508,1473,1510,1473,1512],{},[552,1503,1472],{},[552,1505,1476],{},[552,1507,1479],{},[552,1509,1482],{},[552,1511,1485],{},[552,1513,1488],{},[834,1515,1516],{},[552,1517,1476],{},[815,1519,1520,1526,1540],{},[834,1521,1522,1525],{},[552,1523,1524],{},"mouseButtons.wheel"," ¹",[834,1527,1528,1473,1530,1473,1532,1473,1534,1473,1536,1473,1538],{},[552,1529,1472],{},[552,1531,1476],{},[552,1533,1479],{},[552,1535,1482],{},[552,1537,1485],{},[552,1539,1488],{},[834,1541,1542,1544,1545,1547],{},[552,1543,1482],{}," for Perspective camera, ",[552,1546,1485],{}," for Orthographic camera.",[815,1549,1550,1556,1570],{},[834,1551,1552,1555],{},[552,1553,1554],{},"mouseButtons.middle"," ²",[834,1557,1558,1473,1560,1473,1562,1473,1564,1473,1566,1473,1568],{},[552,1559,1472],{},[552,1561,1476],{},[552,1563,1479],{},[552,1565,1482],{},[552,1567,1485],{},[552,1569,1488],{},[834,1571,1572],{},[552,1573,1482],{},[1575,1576,1577,1581],"ol",{},[1578,1579,1580],"li",{},"Mouse wheel event for scroll \"up/down\", on mac \"up/down/left/right\".",[1578,1582,1583],{},"Mouse wheel \"button\" click event.",[1441,1585,1586],{"id":1267},"Touches",[809,1588,1589,1600],{},[812,1590,1591],{},[815,1592,1593,1596,1598],{},[818,1594,1595],{},"Fingers to assign",[818,1597,1456],{},[818,1599,827],{},[829,1601,1602,1630,1678],{},[815,1603,1604,1609,1626],{},[834,1605,1606],{},[552,1607,1608],{},"touches.one",[834,1610,1611,1473,1614,1473,1617,1473,1620,1473,1622,1473,1624],{},[552,1612,1613],{},"TOUCH_ROTATE",[552,1615,1616],{},"TOUCH_TRUCK",[552,1618,1619],{},"TOUCH_OFFSET",[552,1621,1482],{},[552,1623,1485],{},[552,1625,1488],{},[834,1627,1628],{},[552,1629,1613],{},[815,1631,1632,1637,1671],{},[834,1633,1634],{},[552,1635,1636],{},"touches.two",[834,1638,1639,1473,1642,1473,1645,1473,1648,1473,1651,1473,1654,1473,1657,1473,1660,1473,1663,1473,1665,1473,1667,1473,1669],{},[552,1640,1641],{},"TOUCH_DOLLY_TRUCK",[552,1643,1644],{},"TOUCH_DOLLY_OFFSET",[552,1646,1647],{},"TOUCH_DOLLY_ROTATE",[552,1649,1650],{},"TOUCH_ZOOM_TRUCK",[552,1652,1653],{},"TOUCH_ZOOM_OFFSET",[552,1655,1656],{},"TOUCH_ZOOM_ROTATE",[552,1658,1659],{},"TOUCH_DOLLY",[552,1661,1662],{},"TOUCH_ZOOM",[552,1664,1613],{},[552,1666,1616],{},[552,1668,1619],{},[552,1670,1488],{},[834,1672,1673,1544,1675,1677],{},[552,1674,1641],{},[552,1676,1650],{}," for Othographic camera.",[815,1679,1680,1685,1707],{},[834,1681,1682],{},[552,1683,1684],{},"touches.three",[834,1686,1687,1473,1689,1473,1691,1473,1693,1473,1695,1473,1697,1473,1699,1473,1701,1473,1703,1473,1705],{},[552,1688,1641],{},[552,1690,1644],{},[552,1692,1647],{},[552,1694,1650],{},[552,1696,1653],{},[552,1698,1656],{},[552,1700,1613],{},[552,1702,1616],{},[552,1704,1619],{},[552,1706,1488],{},[834,1708,1709],{},[552,1710,1616],{},[540,1712,1714],{"id":1713},"events","Events",[544,1716,1718],{"className":546,"code":1717,"language":550,"meta":488,"style":488},"\u003CCameraControls @change=\"onChange\" @start=\"onStart\" @end=\"onEnd\" />\n",[552,1719,1720],{"__ignoreMap":488},[555,1721,1722,1724,1726,1729,1732,1734,1736,1739,1741,1743,1746,1748,1750,1753,1755,1757,1760,1762,1764,1767,1769],{"class":557,"line":489},[555,1723,561],{"class":560},[555,1725,524],{"class":564},[555,1727,1728],{"class":560}," @",[555,1730,1731],{"class":568},"change",[555,1733,636],{"class":560},[555,1735,639],{"class":560},[555,1737,1738],{"class":584},"onChange",[555,1740,639],{"class":560},[555,1742,1728],{"class":560},[555,1744,1745],{"class":568},"start",[555,1747,636],{"class":560},[555,1749,639],{"class":560},[555,1751,1752],{"class":584},"onStart",[555,1754,639],{"class":560},[555,1756,1728],{"class":560},[555,1758,1759],{"class":568},"end",[555,1761,636],{"class":560},[555,1763,639],{"class":560},[555,1765,1766],{"class":584},"onEnd",[555,1768,639],{"class":560},[555,1770,670],{"class":560},[809,1772,1773,1782],{},[812,1774,1775],{},[815,1776,1777,1780],{},[818,1778,1779],{"align":820},"Event",[818,1781,824],{"align":820},[829,1783,1784,1793,1802],{},[815,1785,1786,1790],{},[834,1787,1788],{"align":820},[837,1789,1745],{},[834,1791,1792],{"align":820},"Dispatched when the control starts to change.",[815,1794,1795,1799],{},[834,1796,1797],{"align":820},[837,1798,1731],{},[834,1800,1801],{"align":820},"Dispatched when the control changes.",[815,1803,1804,1808],{},[834,1805,1806],{"align":820},[837,1807,1759],{},[834,1809,1810],{"align":820},"Dispatched when the control ends to change.",[1812,1813,1814],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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}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 .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 .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);}",{"title":488,"searchDepth":489,"depth":490,"links":1816},[1817,1818,1819,1823],{"id":542,"depth":490,"text":15},{"id":803,"depth":490,"text":804},{"id":1279,"depth":490,"text":1259,"children":1820},[1821,1822],{"id":1443,"depth":604,"text":1444},{"id":1267,"depth":604,"text":1586},{"id":1713,"depth":490,"text":1714},{},{"title":91,"description":503},"2hfwAcOw9kCB60pKAgItRmaKk8A71rNBCTtreEGn7EI",{"id":1828,"title":95,"body":1829,"description":1847,"extension":493,"links":494,"meta":2219,"navigation":496,"path":96,"seo":2220,"stem":97,"__hash__":2221},"docs/2.api/2.controls/keyboard-controls.md",{"type":481,"value":1830,"toc":2214},[1831,1836,1842,1851,1868,1870,2030,2034,2036,2117,2119,2175,2211],[510,1832,1833],{},[1834,1835],"controls-keyboard-controls",{},[516,1837,1838,1841],{},[552,1839,1840],{},"\u003CKeyboardControls />"," is a simple keyboard controller for the camera. The camera's movements are bound to:",[1843,1844,1845,1848],"ul",{},[1578,1846,1847],{},"WASD on QWERTY keyboards or equivalent keys on non-QWERTY keyboards",[1578,1849,1850],{},"Arrow keys",[1852,1853,1854],"prose-note",{},[516,1855,1856,1859,1860,1863,1864,538],{},[552,1857,1858],{},"KeyboardControls"," uses ",[552,1861,1862],{},"PointerLockControls"," under the hood. You can use ",[519,1865,1867],{"href":1866},"pointer-lock-controls#props","PointerLockControls props and events",[540,1869,15],{"id":542},[544,1871,1874],{"className":546,"code":1872,"highlights":1873,"language":550,"meta":488,"style":488},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { KeyboardControls, Box } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera />\n    \u003CBox :position-y=\"0.5\" />\n    \u003CKeyboardControls />\n    \u003CTresGridHelper />\n  \u003C/TresCanvas>\n\u003C/template>\n",[604,727],[552,1875,1876,1896,1916,1941,1949,1953,1961,1969,1977,1997,2006,2014,2022],{"__ignoreMap":488},[555,1877,1878,1880,1882,1884,1886,1888,1890,1892,1894],{"class":557,"line":489},[555,1879,561],{"class":560},[555,1881,565],{"class":564},[555,1883,569],{"class":568},[555,1885,1322],{"class":568},[555,1887,636],{"class":560},[555,1889,639],{"class":560},[555,1891,1329],{"class":597},[555,1893,639],{"class":560},[555,1895,572],{"class":560},[555,1897,1898,1900,1902,1905,1907,1909,1911,1914],{"class":557,"line":490},[555,1899,578],{"class":577},[555,1901,581],{"class":560},[555,1903,1904],{"class":584}," TresCanvas",[555,1906,588],{"class":560},[555,1908,591],{"class":577},[555,1910,1356],{"class":560},[555,1912,1913],{"class":597},"@tresjs/core",[555,1915,1361],{"class":560},[555,1917,1919,1921,1923,1926,1928,1931,1933,1935,1937,1939],{"class":1918,"line":604},[557,674],[555,1920,578],{"class":577},[555,1922,581],{"class":560},[555,1924,1925],{"class":584}," KeyboardControls",[555,1927,1347],{"class":560},[555,1929,1930],{"class":584}," Box",[555,1932,588],{"class":560},[555,1934,591],{"class":577},[555,1936,1356],{"class":560},[555,1938,598],{"class":597},[555,1940,1361],{"class":560},[555,1942,1943,1945,1947],{"class":557,"line":614},[555,1944,607],{"class":560},[555,1946,565],{"class":564},[555,1948,572],{"class":560},[555,1950,1951],{"class":557,"line":624},[555,1952,1374],{"emptyLinePlaceholder":496},[555,1954,1955,1957,1959],{"class":557,"line":649},[555,1956,561],{"class":560},[555,1958,619],{"class":564},[555,1960,572],{"class":560},[555,1962,1963,1965,1967],{"class":557,"line":549},[555,1964,627],{"class":560},[555,1966,630],{"class":564},[555,1968,572],{"class":560},[555,1970,1971,1973,1975],{"class":557,"line":683},[555,1972,652],{"class":560},[555,1974,655],{"class":564},[555,1976,670],{"class":560},[555,1978,1979,1981,1983,1986,1988,1990,1993,1995],{"class":557,"line":704},[555,1980,652],{"class":560},[555,1982,201],{"class":564},[555,1984,1985],{"class":568}," :position-y",[555,1987,636],{"class":560},[555,1989,639],{"class":560},[555,1991,1992],{"class":597},"0.5",[555,1994,639],{"class":560},[555,1996,670],{"class":560},[555,1998,2000,2002,2004],{"class":1999,"line":727},[557,674],[555,2001,652],{"class":560},[555,2003,1858],{"class":564},[555,2005,670],{"class":560},[555,2007,2008,2010,2012],{"class":557,"line":737},[555,2009,652],{"class":560},[555,2011,773],{"class":564},[555,2013,670],{"class":560},[555,2015,2016,2018,2020],{"class":557,"line":747},[555,2017,781],{"class":560},[555,2019,630],{"class":564},[555,2021,572],{"class":560},[555,2023,2024,2026,2028],{"class":557,"line":768},[555,2025,607],{"class":560},[555,2027,619],{"class":564},[555,2029,572],{"class":560},[796,2031,2032],{},[516,2033,800],{},[540,2035,804],{"id":803},[809,2037,2038,2048],{},[812,2039,2040],{},[815,2041,2042,2044,2046],{},[818,2043,821],{"align":820},[818,2045,824],{"align":820},[818,2047,827],{},[829,2049,2050,2063,2079,2091,2103],{},[815,2051,2052,2057,2060],{},[834,2053,2054],{"align":820},[837,2055,2056],{},"moveSpeed",[834,2058,2059],{"align":820},"Speed movement.",[834,2061,2062],{},"0.2",[815,2064,2065,2069,2075],{},[834,2066,2067],{"align":820},[837,2068,839],{},[834,2070,2071,2072,2074],{"align":820},"If ",[552,2073,992],{},", the controls will be set as the default controls for the scene.",[834,2076,2077],{},[552,2078,992],{},[815,2080,2081,2085,2087],{},[834,2082,2083],{"align":820},[837,2084,854],{},[834,2086,857],{"align":820},[834,2088,2089],{},[552,2090,862],{},[815,2092,2093,2097,2099],{},[834,2094,2095],{"align":820},[837,2096,869],{},[834,2098,872],{"align":820},[834,2100,2101],{},[552,2102,862],{},[815,2104,2105,2110,2113],{},[834,2106,2107],{"align":820},[837,2108,2109],{},"selector",[834,2111,2112],{"align":820},"Accept an id element as string. If set, the new element will be used as the trigger",[834,2114,2115],{},[552,2116,862],{},[540,2118,1714],{"id":1713},[544,2120,2122],{"className":546,"code":2121,"language":550,"meta":488,"style":488},"\u003CKeyboardControls @change=\"onChange\" @is-lock=\"(state) => isActive(state)\" />\n",[552,2123,2124],{"__ignoreMap":488},[555,2125,2126,2128,2130,2132,2134,2136,2138,2140,2142,2144,2147,2149,2151,2154,2158,2161,2164,2168,2171,2173],{"class":557,"line":489},[555,2127,561],{"class":560},[555,2129,1858],{"class":564},[555,2131,1728],{"class":560},[555,2133,1731],{"class":568},[555,2135,636],{"class":560},[555,2137,639],{"class":560},[555,2139,1738],{"class":584},[555,2141,639],{"class":560},[555,2143,1728],{"class":560},[555,2145,2146],{"class":568},"is-lock",[555,2148,636],{"class":560},[555,2150,639],{"class":560},[555,2152,2153],{"class":560},"(",[555,2155,2157],{"class":2156},"sHdIc","state",[555,2159,2160],{"class":560},")",[555,2162,2163],{"class":568}," =>",[555,2165,2167],{"class":2166},"s2Zo4"," isActive",[555,2169,2170],{"class":584},"(state)",[555,2172,639],{"class":560},[555,2174,670],{"class":584},[809,2176,2177,2185],{},[812,2178,2179],{},[815,2180,2181,2183],{},[818,2182,1779],{"align":820},[818,2184,824],{"align":820},[829,2186,2187,2203],{},[815,2188,2189,2194],{},[834,2190,2191],{"align":820},[837,2192,2193],{},"isLock",[834,2195,2196,2197,2199,2200,2202],{"align":820},"Return ",[552,2198,992],{}," if \"lock\", ",[552,2201,847],{}," if \"unlock\" events are triggered.",[815,2204,2205,2209],{},[834,2206,2207],{"align":820},[837,2208,1731],{},[834,2210,1801],{"align":820},[1812,2212,2213],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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 .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}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 .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}",{"title":488,"searchDepth":489,"depth":490,"links":2215},[2216,2217,2218],{"id":542,"depth":490,"text":15},{"id":803,"depth":490,"text":804},{"id":1713,"depth":490,"text":1714},{},{"title":95,"description":1847},"it5OHUitkTH5lkk35Xy-NQitAzH5KAYajRkEsScL4R4",{"id":2223,"title":99,"body":2224,"description":2519,"extension":493,"links":494,"meta":2520,"navigation":496,"path":100,"seo":2521,"stem":101,"__hash__":2522},"docs/2.api/2.controls/map-controls.md",{"type":481,"value":2225,"toc":2515},[2226,2231,2239,2241,2431,2436,2438,2508,2513],[510,2227,2228],{},[2229,2230],"controls-map-controls",{},[516,2232,2233,2238],{},[519,2234,2237],{"href":2235,"rel":2236},"https://threejs.org/docs/index.html?q=controls#examples/en/controls/MapControls",[523],"MapControls"," similar to OrbitControls, this control is intended for transforming a camera over a map from bird's eye perspective, but uses a specific preset for mouse/touch interaction and disables screen space panning by default.",[540,2240,15],{"id":542},[544,2242,2245],{"className":546,"code":2243,"highlights":2244,"language":550,"meta":488,"style":488},"\u003Cscript setup>\nimport { MapControls } from \"@tresjs/cientos\"\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#82DBC5\">\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" />\n    \u003CMapControls />\n    \u003CBox :scale=\"2\">\n      \u003CTresMeshToonMaterial color=\"orange\" />\n    \u003C/Box>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n    \u003CTresGridHelper />\n  \u003C/TresCanvas>\n\u003C/template>\n",[549],[552,2246,2247,2257,2276,2284,2292,2310,2328,2337,2355,2373,2381,2389,2407,2415,2423],{"__ignoreMap":488},[555,2248,2249,2251,2253,2255],{"class":557,"line":489},[555,2250,561],{"class":560},[555,2252,565],{"class":564},[555,2254,569],{"class":568},[555,2256,572],{"class":560},[555,2258,2259,2261,2263,2266,2268,2270,2272,2274],{"class":557,"line":490},[555,2260,578],{"class":577},[555,2262,581],{"class":560},[555,2264,2265],{"class":584}," MapControls",[555,2267,588],{"class":560},[555,2269,591],{"class":577},[555,2271,594],{"class":560},[555,2273,598],{"class":597},[555,2275,601],{"class":560},[555,2277,2278,2280,2282],{"class":557,"line":604},[555,2279,607],{"class":560},[555,2281,565],{"class":564},[555,2283,572],{"class":560},[555,2285,2286,2288,2290],{"class":557,"line":614},[555,2287,561],{"class":560},[555,2289,619],{"class":564},[555,2291,572],{"class":560},[555,2293,2294,2296,2298,2300,2302,2304,2306,2308],{"class":557,"line":624},[555,2295,627],{"class":560},[555,2297,630],{"class":564},[555,2299,633],{"class":568},[555,2301,636],{"class":560},[555,2303,639],{"class":560},[555,2305,642],{"class":597},[555,2307,639],{"class":560},[555,2309,572],{"class":560},[555,2311,2312,2314,2316,2318,2320,2322,2324,2326],{"class":557,"line":649},[555,2313,652],{"class":560},[555,2315,655],{"class":564},[555,2317,658],{"class":568},[555,2319,636],{"class":560},[555,2321,639],{"class":560},[555,2323,665],{"class":597},[555,2325,639],{"class":560},[555,2327,670],{"class":560},[555,2329,2331,2333,2335],{"class":2330,"line":549},[557,674],[555,2332,652],{"class":560},[555,2334,2237],{"class":564},[555,2336,670],{"class":560},[555,2338,2339,2341,2343,2345,2347,2349,2351,2353],{"class":557,"line":683},[555,2340,652],{"class":560},[555,2342,201],{"class":564},[555,2344,690],{"class":568},[555,2346,636],{"class":560},[555,2348,639],{"class":560},[555,2350,697],{"class":597},[555,2352,639],{"class":560},[555,2354,572],{"class":560},[555,2356,2357,2359,2361,2363,2365,2367,2369,2371],{"class":557,"line":704},[555,2358,707],{"class":560},[555,2360,710],{"class":564},[555,2362,713],{"class":568},[555,2364,636],{"class":560},[555,2366,639],{"class":560},[555,2368,720],{"class":597},[555,2370,639],{"class":560},[555,2372,670],{"class":560},[555,2374,2375,2377,2379],{"class":557,"line":727},[555,2376,730],{"class":560},[555,2378,201],{"class":564},[555,2380,572],{"class":560},[555,2382,2383,2385,2387],{"class":557,"line":737},[555,2384,652],{"class":560},[555,2386,742],{"class":564},[555,2388,670],{"class":560},[555,2390,2391,2393,2395,2397,2399,2401,2403,2405],{"class":557,"line":747},[555,2392,652],{"class":560},[555,2394,752],{"class":564},[555,2396,658],{"class":568},[555,2398,636],{"class":560},[555,2400,639],{"class":560},[555,2402,761],{"class":597},[555,2404,639],{"class":560},[555,2406,670],{"class":560},[555,2408,2409,2411,2413],{"class":557,"line":768},[555,2410,652],{"class":560},[555,2412,773],{"class":564},[555,2414,670],{"class":560},[555,2416,2417,2419,2421],{"class":557,"line":778},[555,2418,781],{"class":560},[555,2420,630],{"class":564},[555,2422,572],{"class":560},[555,2424,2425,2427,2429],{"class":557,"line":788},[555,2426,607],{"class":560},[555,2428,619],{"class":564},[555,2430,572],{"class":560},[796,2432,2433],{},[516,2434,2435],{},"It is really important that the perspective camera is set first in the canvas. Otherwise the scene might break.",[540,2437,804],{"id":803},[809,2439,2440,2450],{},[812,2441,2442],{},[815,2443,2444,2446,2448],{},[818,2445,821],{"align":820},[818,2447,824],{"align":820},[818,2449,827],{},[829,2451,2452,2466,2478,2491],{},[815,2453,2454,2458,2462],{},[834,2455,2456],{"align":820},[837,2457,839],{},[834,2459,2071,2460,2074],{"align":820},[552,2461,992],{},[834,2463,2464],{},[552,2465,847],{},[815,2467,2468,2472,2474],{},[834,2469,2470],{"align":820},[837,2471,854],{},[834,2473,857],{"align":820},[834,2475,2476],{},[552,2477,862],{},[815,2479,2480,2484,2487],{},[834,2481,2482],{"align":820},[837,2483,869],{},[834,2485,2486],{"align":820},"The dom element to listen to.",[834,2488,2489],{},[552,2490,862],{},[815,2492,2493,2498,2504],{},[834,2494,2495],{"align":820},[837,2496,2497],{},"screenSpacePanning",[834,2499,2500,2501,2503],{"align":820},"Defines how the camera's position is translated when panning. If ",[552,2502,992],{},", the camera pans in screen space. Otherwise, the camera pans in the plane orthogonal to the camera's up direction.",[834,2505,2506],{},[552,2507,847],{},[1852,2509,2510],{},[516,2511,2512],{},"All the props of the orbit controls component apply here too.",[1812,2514,1814],{},{"title":488,"searchDepth":489,"depth":490,"links":2516},[2517,2518],{"id":542,"depth":490,"text":15},{"id":803,"depth":490,"text":804},"similar to OrbitControls but for map views",{},{"title":99,"description":2519},"kfzpqZnb7itAV_eVKFqO6wVSm6EFixFWw9fpJO8O0ac",{"id":2524,"title":103,"body":2525,"description":3224,"extension":493,"links":494,"meta":3225,"navigation":496,"path":104,"seo":3226,"stem":105,"__hash__":3227},"docs/2.api/2.controls/orbit-controls.md",{"type":481,"value":2526,"toc":3219},[2527,2532,2539,2541,2731,2735,2737,3130,3132,3181,3217],[510,2528,2529],{},[2530,2531],"controls-orbit-controls",{},[516,2533,2534,2538],{},[519,2535,528],{"href":2536,"rel":2537},"https://threejs.org/docs/index.html?q=orbit#examples/en/controls/OrbitControls",[523]," is a camera controller that allows you to orbit around a target. It's a great way to explore your scene.",[540,2540,15],{"id":542},[544,2542,2545],{"className":546,"code":2543,"highlights":2544,"language":550,"meta":488,"style":488},"\u003Cscript setup>\nimport { OrbitControls } from \"@tresjs/cientos\"\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#82DBC5\">\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" />\n    \u003COrbitControls />\n    \u003CBox :scale=\"2\">\n      \u003CTresMeshToonMaterial color=\"orange\" />\n    \u003C/Box>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n    \u003CTresGridHelper />\n  \u003C/TresCanvas>\n\u003C/template>\n",[549],[552,2546,2547,2557,2576,2584,2592,2610,2628,2637,2655,2673,2681,2689,2707,2715,2723],{"__ignoreMap":488},[555,2548,2549,2551,2553,2555],{"class":557,"line":489},[555,2550,561],{"class":560},[555,2552,565],{"class":564},[555,2554,569],{"class":568},[555,2556,572],{"class":560},[555,2558,2559,2561,2563,2566,2568,2570,2572,2574],{"class":557,"line":490},[555,2560,578],{"class":577},[555,2562,581],{"class":560},[555,2564,2565],{"class":584}," OrbitControls",[555,2567,588],{"class":560},[555,2569,591],{"class":577},[555,2571,594],{"class":560},[555,2573,598],{"class":597},[555,2575,601],{"class":560},[555,2577,2578,2580,2582],{"class":557,"line":604},[555,2579,607],{"class":560},[555,2581,565],{"class":564},[555,2583,572],{"class":560},[555,2585,2586,2588,2590],{"class":557,"line":614},[555,2587,561],{"class":560},[555,2589,619],{"class":564},[555,2591,572],{"class":560},[555,2593,2594,2596,2598,2600,2602,2604,2606,2608],{"class":557,"line":624},[555,2595,627],{"class":560},[555,2597,630],{"class":564},[555,2599,633],{"class":568},[555,2601,636],{"class":560},[555,2603,639],{"class":560},[555,2605,642],{"class":597},[555,2607,639],{"class":560},[555,2609,572],{"class":560},[555,2611,2612,2614,2616,2618,2620,2622,2624,2626],{"class":557,"line":649},[555,2613,652],{"class":560},[555,2615,655],{"class":564},[555,2617,658],{"class":568},[555,2619,636],{"class":560},[555,2621,639],{"class":560},[555,2623,665],{"class":597},[555,2625,639],{"class":560},[555,2627,670],{"class":560},[555,2629,2631,2633,2635],{"class":2630,"line":549},[557,674],[555,2632,652],{"class":560},[555,2634,528],{"class":564},[555,2636,670],{"class":560},[555,2638,2639,2641,2643,2645,2647,2649,2651,2653],{"class":557,"line":683},[555,2640,652],{"class":560},[555,2642,201],{"class":564},[555,2644,690],{"class":568},[555,2646,636],{"class":560},[555,2648,639],{"class":560},[555,2650,697],{"class":597},[555,2652,639],{"class":560},[555,2654,572],{"class":560},[555,2656,2657,2659,2661,2663,2665,2667,2669,2671],{"class":557,"line":704},[555,2658,707],{"class":560},[555,2660,710],{"class":564},[555,2662,713],{"class":568},[555,2664,636],{"class":560},[555,2666,639],{"class":560},[555,2668,720],{"class":597},[555,2670,639],{"class":560},[555,2672,670],{"class":560},[555,2674,2675,2677,2679],{"class":557,"line":727},[555,2676,730],{"class":560},[555,2678,201],{"class":564},[555,2680,572],{"class":560},[555,2682,2683,2685,2687],{"class":557,"line":737},[555,2684,652],{"class":560},[555,2686,742],{"class":564},[555,2688,670],{"class":560},[555,2690,2691,2693,2695,2697,2699,2701,2703,2705],{"class":557,"line":747},[555,2692,652],{"class":560},[555,2694,752],{"class":564},[555,2696,658],{"class":568},[555,2698,636],{"class":560},[555,2700,639],{"class":560},[555,2702,761],{"class":597},[555,2704,639],{"class":560},[555,2706,670],{"class":560},[555,2708,2709,2711,2713],{"class":557,"line":768},[555,2710,652],{"class":560},[555,2712,773],{"class":564},[555,2714,670],{"class":560},[555,2716,2717,2719,2721],{"class":557,"line":778},[555,2718,781],{"class":560},[555,2720,630],{"class":564},[555,2722,572],{"class":560},[555,2724,2725,2727,2729],{"class":557,"line":788},[555,2726,607],{"class":560},[555,2728,619],{"class":564},[555,2730,572],{"class":560},[796,2732,2733],{},[516,2734,800],{},[540,2736,804],{"id":803},[809,2738,2739,2749],{},[812,2740,2741],{},[815,2742,2743,2745,2747],{},[818,2744,821],{"align":820},[818,2746,824],{"align":820},[818,2748,827],{},[829,2750,2751,2765,2777,2789,2803,2819,2838,2852,2870,2884,2899,2914,2935,2953,2966,2979,2992,3005,3018,3031,3045,3059,3073,3088,3102,3116],{},[815,2752,2753,2757,2761],{},[834,2754,2755],{"align":820},[837,2756,839],{},[834,2758,2071,2759,2074],{"align":820},[552,2760,992],{},[834,2762,2763],{},[552,2764,847],{},[815,2766,2767,2771,2773],{},[834,2768,2769],{"align":820},[837,2770,854],{},[834,2772,857],{"align":820},[834,2774,2775],{},[552,2776,862],{},[815,2778,2779,2783,2785],{},[834,2780,2781],{"align":820},[837,2782,869],{},[834,2784,2486],{"align":820},[834,2786,2787],{},[552,2788,862],{},[815,2790,2791,2796,2799],{},[834,2792,2793],{"align":820},[837,2794,2795],{},"target",[834,2797,2798],{"align":820},"The target to orbit around.",[834,2800,2801],{},[552,2802,862],{},[815,2804,2805,2810,2815],{},[834,2806,2807],{"align":820},[837,2808,2809],{},"enableDamping",[834,2811,2071,2812,2814],{"align":820},[552,2813,992],{},", the controls will use damping (inertia), which can be used to give a sense of weight to the controls.",[834,2816,2817],{},[552,2818,992],{},[815,2820,2821,2826,2833],{},[834,2822,2823],{"align":820},[837,2824,2825],{},"dampingFactor",[834,2827,2828,2829,2832],{"align":820},"The damping inertia used if ",[552,2830,2831],{},".enableDamping"," is set to true.",[834,2834,2835],{},[552,2836,2837],{},"0.05",[815,2839,2840,2845,2848],{},[834,2841,2842],{"align":820},[837,2843,2844],{},"autoRotate",[834,2846,2847],{"align":820},"Set to true to automatically rotate around the target.",[834,2849,2850],{},[552,2851,847],{},[815,2853,2854,2859,2866],{},[834,2855,2856],{"align":820},[837,2857,2858],{},"autoRotateSpeed",[834,2860,2861,2862,2865],{"align":820},"How fast to rotate around the target if ",[552,2863,2864],{},".autoRotate"," is true.",[834,2867,2868],{},[552,2869,697],{},[815,2871,2872,2877,2880],{},[834,2873,2874],{"align":820},[837,2875,2876],{},"enablePan",[834,2878,2879],{"align":820},"Whether to enable panning.",[834,2881,2882],{},[552,2883,992],{},[815,2885,2886,2891,2894],{},[834,2887,2888],{"align":820},[837,2889,2890],{},"keyPanSpeed",[834,2892,2893],{"align":820},"How fast to pan the camera when the keyboard is used. Default is 7.0 pixels per keypress.",[834,2895,2896],{},[552,2897,2898],{},"7.0",[815,2900,2901,2906,2909],{},[834,2902,2903],{"align":820},[837,2904,2905],{},"keys",[834,2907,2908],{"align":820},"This object contains references to the keycodes for controlling camera panning. Default is the 4 arrow keys.",[834,2910,2911],{},[552,2912,2913],{},"{ LEFT: 'ArrowLeft', UP: 'ArrowUp', RIGHT: 'ArrowRight', BOTTOM: 'ArrowDown' }",[815,2915,2916,2920,2931],{},[834,2917,2918],{"align":820},[837,2919,928],{},[834,2921,2922,2923,2926,2927,2930],{"align":820},"How far you can orbit horizontally, upper limit. If set, the interval ",[555,2924,2925],{}," min, max"," must be a sub-interval of ",[555,2928,2929],{}," - 2 PI, 2 PI",", with ( max - min \u003C 2 PI ). Default is Infinity.",[834,2932,2933],{},[552,2934,936],{},[815,2936,2937,2941,2949],{},[834,2938,2939],{"align":820},[837,2940,913],{},[834,2942,2943,2944,2926,2946,2948],{"align":820},"How far you can orbit horizontally, lower limit. If set, the interval ",[555,2945,2925],{},[555,2947,2929],{},", with ( max - min \u003C 2 PI ). Default is - Infinity.",[834,2950,2951],{},[552,2952,921],{},[815,2954,2955,2959,2962],{},[834,2956,2957],{"align":820},[837,2958,898],{},[834,2960,2961],{"align":820},"How far you can orbit vertically, upper limit. Range is 0 to Math.PI radians, and default is Math.PI.",[834,2963,2964],{},[552,2965,906],{},[815,2967,2968,2972,2975],{},[834,2969,2970],{"align":820},[837,2971,883],{},[834,2973,2974],{"align":820},"How far you can orbit vertically, lower limit. Range is 0 to Math.PI radians, and default is 0.",[834,2976,2977],{},[552,2978,891],{},[815,2980,2981,2985,2988],{},[834,2982,2983],{"align":820},[837,2984,958],{},[834,2986,2987],{"align":820},"The minimum distance of the camera to the target. Default is 0.",[834,2989,2990],{},[552,2991,891],{},[815,2993,2994,2998,3001],{},[834,2995,2996],{"align":820},[837,2997,973],{},[834,2999,3000],{"align":820},"The maximum distance of the camera to the target. Default is Infinity.",[834,3002,3003],{},[552,3004,936],{},[815,3006,3007,3011,3014],{},[834,3008,3009],{"align":820},[837,3010,1004],{},[834,3012,3013],{"align":820},"The minimum field of view angle, in radians. Default is 0.",[834,3015,3016],{},[552,3017,891],{},[815,3019,3020,3024,3027],{},[834,3021,3022],{"align":820},[837,3023,1019],{},[834,3025,3026],{"align":820},"The maximum field of view angle, in radians. ( OrthographicCamera only ). Default is Infinity.",[834,3028,3029],{},[552,3030,936],{},[815,3032,3033,3037,3040],{},[834,3034,3035],{"align":820},[837,3036,1267],{},[834,3038,3039],{"align":820},"This object contains references to the touch actions used by the controls.",[834,3041,3042],{},[552,3043,3044],{},"{ ONE: TOUCH.ROTATE, TWO: TOUCH.DOLLY_PAN }",[815,3046,3047,3051,3054],{},[834,3048,3049],{"align":820},[837,3050,1247],{},[834,3052,3053],{"align":820},"This object contains references to the mouse actions used by the controls. LEFT: Rotate around the target, MIDDLE: Zoom the camera, RIGHT: Pan the camera.",[834,3055,3056],{},[552,3057,3058],{},"{ LEFT: MOUSE.ROTATE, MIDDLE: MOUSE.DOLLY, RIGHT: MOUSE.PAN }",[815,3060,3061,3066,3069],{},[834,3062,3063],{"align":820},[837,3064,3065],{},"enableZoom",[834,3067,3068],{"align":820},"Whether to enable zooming.",[834,3070,3071],{},[552,3072,992],{},[815,3074,3075,3080,3083],{},[834,3076,3077],{"align":820},[837,3078,3079],{},"zoomSpeed",[834,3081,3082],{"align":820},"How fast to zoom in and out. Default is 1.",[834,3084,3085],{},[552,3086,3087],{},"1",[815,3089,3090,3095,3098],{},[834,3091,3092],{"align":820},[837,3093,3094],{},"enableRotate",[834,3096,3097],{"align":820},"Whether to enable rotating.",[834,3099,3100],{},[552,3101,992],{},[815,3103,3104,3109,3112],{},[834,3105,3106],{"align":820},[837,3107,3108],{},"rotateSpeed",[834,3110,3111],{"align":820},"How fast to rotate around the target. Default is 1.",[834,3113,3114],{},[552,3115,3087],{},[815,3117,3118,3122,3126],{},[834,3119,3120],{"align":820},[837,3121,2497],{},[834,3123,2500,3124,2503],{"align":820},[552,3125,992],{},[834,3127,3128],{},[552,3129,992],{},[540,3131,1714],{"id":1713},[544,3133,3135],{"className":546,"code":3134,"language":550,"meta":488,"style":488},"\u003COrbitControls @change=\"onChange\" @start=\"onStart\" @end=\"onEnd\" />\n",[552,3136,3137],{"__ignoreMap":488},[555,3138,3139,3141,3143,3145,3147,3149,3151,3153,3155,3157,3159,3161,3163,3165,3167,3169,3171,3173,3175,3177,3179],{"class":557,"line":489},[555,3140,561],{"class":560},[555,3142,528],{"class":564},[555,3144,1728],{"class":560},[555,3146,1731],{"class":568},[555,3148,636],{"class":560},[555,3150,639],{"class":560},[555,3152,1738],{"class":584},[555,3154,639],{"class":560},[555,3156,1728],{"class":560},[555,3158,1745],{"class":568},[555,3160,636],{"class":560},[555,3162,639],{"class":560},[555,3164,1752],{"class":584},[555,3166,639],{"class":560},[555,3168,1728],{"class":560},[555,3170,1759],{"class":568},[555,3172,636],{"class":560},[555,3174,639],{"class":560},[555,3176,1766],{"class":584},[555,3178,639],{"class":560},[555,3180,670],{"class":560},[809,3182,3183,3191],{},[812,3184,3185],{},[815,3186,3187,3189],{},[818,3188,1779],{"align":820},[818,3190,824],{"align":820},[829,3192,3193,3201,3209],{},[815,3194,3195,3199],{},[834,3196,3197],{"align":820},[837,3198,1745],{},[834,3200,1792],{"align":820},[815,3202,3203,3207],{},[834,3204,3205],{"align":820},[837,3206,1731],{},[834,3208,1801],{"align":820},[815,3210,3211,3215],{},[834,3212,3213],{"align":820},[837,3214,1759],{},[834,3216,1810],{"align":820},[1812,3218,1814],{},{"title":488,"searchDepth":489,"depth":490,"links":3220},[3221,3222,3223],{"id":542,"depth":490,"text":15},{"id":803,"depth":490,"text":804},{"id":1713,"depth":490,"text":1714},"Allows you to orbit around the scene",{},{"title":103,"description":3224},"XWrClwQmT_iqfXhEFazDO2swYkiJCagLQjTOAb5xuyM",{"id":3229,"title":107,"body":3230,"description":3580,"extension":493,"links":494,"meta":3581,"navigation":496,"path":108,"seo":3582,"stem":109,"__hash__":3583},"docs/2.api/2.controls/pointer-lock-controls.md",{"type":481,"value":3231,"toc":3575},[3232,3237,3244,3263,3265,3420,3424,3426,3491,3493,3540,3573],[510,3233,3234],{},[3235,3236],"controls-pointer-lock-controls",{},[516,3238,3239,3243],{},[519,3240,1862],{"href":3241,"rel":3242},"https://threejs.org/docs/index.html?q=pointe#examples/en/controls/PointerLockControls",[523]," is a camera controller that allows you to capture the mouse movement and simulate a first person camera. It is a perfect choice for first person 3D games.",[796,3245,3246],{},[516,3247,3248,3249,3262],{},"This control uses the ",[555,3250,3252,3255],{"style":3251},"background-color:#222;padding:0.25rem;border-radius:4px;",[519,3253],{"href":104,"style":3254},"color:#f7f7f7;text-decoration:none",[519,3256,3259],{"href":3257,"rel":3258},"https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API",[523],[552,3260,3261],{},"Pointer Lock API",", the same rules are applied, for example, you need to interact with the browser to \"lock\" or start the event.\nIn addition, you need to wait 1 second between canceling and re-starting the event",[540,3264,15],{"id":542},[544,3266,3269],{"className":546,"code":3267,"highlights":3268,"language":550,"meta":488,"style":488},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { PointerLockControls, Box } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera />\n    \u003CBox :position-y=\"0.5\" />\n    \u003CPointerLockControls />\n    \u003CTresGridHelper />\n  \u003C/TresCanvas>\n\u003C/template>\n",[604,727],[552,3270,3271,3291,3309,3333,3341,3345,3353,3361,3369,3387,3396,3404,3412],{"__ignoreMap":488},[555,3272,3273,3275,3277,3279,3281,3283,3285,3287,3289],{"class":557,"line":489},[555,3274,561],{"class":560},[555,3276,565],{"class":564},[555,3278,569],{"class":568},[555,3280,1322],{"class":568},[555,3282,636],{"class":560},[555,3284,639],{"class":560},[555,3286,1329],{"class":597},[555,3288,639],{"class":560},[555,3290,572],{"class":560},[555,3292,3293,3295,3297,3299,3301,3303,3305,3307],{"class":557,"line":490},[555,3294,578],{"class":577},[555,3296,581],{"class":560},[555,3298,1904],{"class":584},[555,3300,588],{"class":560},[555,3302,591],{"class":577},[555,3304,1356],{"class":560},[555,3306,1913],{"class":597},[555,3308,1361],{"class":560},[555,3310,3312,3314,3316,3319,3321,3323,3325,3327,3329,3331],{"class":3311,"line":604},[557,674],[555,3313,578],{"class":577},[555,3315,581],{"class":560},[555,3317,3318],{"class":584}," PointerLockControls",[555,3320,1347],{"class":560},[555,3322,1930],{"class":584},[555,3324,588],{"class":560},[555,3326,591],{"class":577},[555,3328,1356],{"class":560},[555,3330,598],{"class":597},[555,3332,1361],{"class":560},[555,3334,3335,3337,3339],{"class":557,"line":614},[555,3336,607],{"class":560},[555,3338,565],{"class":564},[555,3340,572],{"class":560},[555,3342,3343],{"class":557,"line":624},[555,3344,1374],{"emptyLinePlaceholder":496},[555,3346,3347,3349,3351],{"class":557,"line":649},[555,3348,561],{"class":560},[555,3350,619],{"class":564},[555,3352,572],{"class":560},[555,3354,3355,3357,3359],{"class":557,"line":549},[555,3356,627],{"class":560},[555,3358,630],{"class":564},[555,3360,572],{"class":560},[555,3362,3363,3365,3367],{"class":557,"line":683},[555,3364,652],{"class":560},[555,3366,655],{"class":564},[555,3368,670],{"class":560},[555,3370,3371,3373,3375,3377,3379,3381,3383,3385],{"class":557,"line":704},[555,3372,652],{"class":560},[555,3374,201],{"class":564},[555,3376,1985],{"class":568},[555,3378,636],{"class":560},[555,3380,639],{"class":560},[555,3382,1992],{"class":597},[555,3384,639],{"class":560},[555,3386,670],{"class":560},[555,3388,3390,3392,3394],{"class":3389,"line":727},[557,674],[555,3391,652],{"class":560},[555,3393,1862],{"class":564},[555,3395,670],{"class":560},[555,3397,3398,3400,3402],{"class":557,"line":737},[555,3399,652],{"class":560},[555,3401,773],{"class":564},[555,3403,670],{"class":560},[555,3405,3406,3408,3410],{"class":557,"line":747},[555,3407,781],{"class":560},[555,3409,630],{"class":564},[555,3411,572],{"class":560},[555,3413,3414,3416,3418],{"class":557,"line":768},[555,3415,607],{"class":560},[555,3417,619],{"class":564},[555,3419,572],{"class":560},[796,3421,3422],{},[516,3423,800],{},[540,3425,804],{"id":803},[809,3427,3428,3438],{},[812,3429,3430],{},[815,3431,3432,3434,3436],{},[818,3433,821],{"align":820},[818,3435,824],{"align":820},[818,3437,827],{},[829,3439,3440,3454,3466,3478],{},[815,3441,3442,3446,3450],{},[834,3443,3444],{"align":820},[837,3445,839],{},[834,3447,2071,3448,2074],{"align":820},[552,3449,992],{},[834,3451,3452],{},[552,3453,847],{},[815,3455,3456,3460,3462],{},[834,3457,3458],{"align":820},[837,3459,854],{},[834,3461,857],{"align":820},[834,3463,3464],{},[552,3465,862],{},[815,3467,3468,3472,3474],{},[834,3469,3470],{"align":820},[837,3471,869],{},[834,3473,2486],{"align":820},[834,3475,3476],{},[552,3477,862],{},[815,3479,3480,3484,3487],{},[834,3481,3482],{"align":820},[837,3483,2109],{},[834,3485,3486],{"align":820},"Accept an id element as string, if it is set, the new element will be used as the trigger",[834,3488,3489],{},[552,3490,862],{},[540,3492,1714],{"id":1713},[544,3494,3496],{"className":546,"code":3495,"language":550,"meta":488,"style":488},"\u003CPointerLockControls @change=\"onChange\" @is-lock=\"(state) => isActive(state)\" />\n",[552,3497,3498],{"__ignoreMap":488},[555,3499,3500,3502,3504,3506,3508,3510,3512,3514,3516,3518,3520,3522,3524,3526,3528,3530,3532,3534,3536,3538],{"class":557,"line":489},[555,3501,561],{"class":560},[555,3503,1862],{"class":564},[555,3505,1728],{"class":560},[555,3507,1731],{"class":568},[555,3509,636],{"class":560},[555,3511,639],{"class":560},[555,3513,1738],{"class":584},[555,3515,639],{"class":560},[555,3517,1728],{"class":560},[555,3519,2146],{"class":568},[555,3521,636],{"class":560},[555,3523,639],{"class":560},[555,3525,2153],{"class":560},[555,3527,2157],{"class":2156},[555,3529,2160],{"class":560},[555,3531,2163],{"class":568},[555,3533,2167],{"class":2166},[555,3535,2170],{"class":584},[555,3537,639],{"class":560},[555,3539,670],{"class":584},[809,3541,3542,3550],{},[812,3543,3544],{},[815,3545,3546,3548],{},[818,3547,1779],{"align":820},[818,3549,824],{"align":820},[829,3551,3552,3565],{},[815,3553,3554,3558],{},[834,3555,3556],{"align":820},[837,3557,2193],{},[834,3559,2196,3560,2199,3562,3564],{"align":820},[552,3561,992],{},[552,3563,847],{}," if \"unlock\" events are trigger.",[815,3566,3567,3571],{},[834,3568,3569],{"align":820},[837,3570,1731],{},[834,3572,1801],{"align":820},[1812,3574,2213],{},{"title":488,"searchDepth":489,"depth":490,"links":3576},[3577,3578,3579],{"id":542,"depth":490,"text":15},{"id":803,"depth":490,"text":804},{"id":1713,"depth":490,"text":1714},"Allows you to capture the mouse movement and simulate a first person camera",{},{"title":107,"description":3580},"vV10imj42ZYLgsDF4-C_pkzy24eb_ucQLr8NOacrAsg",{"id":3585,"title":111,"body":3586,"description":4303,"extension":493,"links":494,"meta":4304,"navigation":496,"path":112,"seo":4305,"stem":113,"__hash__":4306},"docs/2.api/2.controls/transform-controls.md",{"type":481,"value":3587,"toc":4293},[3588,3596,3601,3603,3614,3820,3838,3842,3845,3849,3855,3858,3897,3901,3906,3909,3944,3948,3953,3956,3991,3993,4224,4226,4287,4290],[516,3589,3590,3591,3595],{},"The ",[519,3592,111],{"href":3593,"rel":3594},"https://threejs.org/docs/#examples/en/controls/TransformControls",[523]," are a set of three gizmos that can be used to translate, rotate and scale objects in the scene. It adapts a similar interaction model of DCC tools like Blender",[510,3597,3598],{},[3599,3600],"controls-transform-controls",{},[540,3602,15],{"id":542},[516,3604,3605,3606,3609,3610,3613],{},"To use the Transform Controls, simply add the ",[552,3607,3608],{},"TransformControls"," component to your scene. You can pass the ",[552,3611,3612],{},"templateRef","of the instance you want to control as a prop.",[544,3615,3618],{"className":546,"code":3616,"highlights":3617,"language":550,"meta":488,"style":488},"\u003Cscript setup>\nconst boxRef = shallowRef()\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :args=\"[45, 1, 0.1, 1000]\" />\n    \u003COrbitControls make-default />\n    \u003CTransformControls :object=\"boxRef\" />\n    \u003CTresMesh ref=\"boxRef\" :position=\"[0, 4, 0]\" cast-shadow>\n      \u003CTresBoxGeometry :args=\"[1.5, 1.5, 1.5]\" />\n      \u003CTresMeshToonMaterial color=\"#4F4F4F\" />\n    \u003C/TresMesh>\n  \u003C/TresCanvas>\n\u003C/template>\n",[549,683],[552,3619,3620,3630,3646,3654,3662,3670,3690,3702,3723,3757,3777,3796,3804,3812],{"__ignoreMap":488},[555,3621,3622,3624,3626,3628],{"class":557,"line":489},[555,3623,561],{"class":560},[555,3625,565],{"class":564},[555,3627,569],{"class":568},[555,3629,572],{"class":560},[555,3631,3632,3635,3638,3640,3643],{"class":557,"line":490},[555,3633,3634],{"class":568},"const",[555,3636,3637],{"class":584}," boxRef ",[555,3639,636],{"class":560},[555,3641,3642],{"class":2166}," shallowRef",[555,3644,3645],{"class":584},"()\n",[555,3647,3648,3650,3652],{"class":557,"line":604},[555,3649,607],{"class":560},[555,3651,565],{"class":564},[555,3653,572],{"class":560},[555,3655,3656,3658,3660],{"class":557,"line":614},[555,3657,561],{"class":560},[555,3659,619],{"class":564},[555,3661,572],{"class":560},[555,3663,3664,3666,3668],{"class":557,"line":624},[555,3665,627],{"class":560},[555,3667,630],{"class":564},[555,3669,572],{"class":560},[555,3671,3672,3674,3676,3679,3681,3683,3686,3688],{"class":557,"line":649},[555,3673,652],{"class":560},[555,3675,655],{"class":564},[555,3677,3678],{"class":568}," :args",[555,3680,636],{"class":560},[555,3682,639],{"class":560},[555,3684,3685],{"class":597},"[45, 1, 0.1, 1000]",[555,3687,639],{"class":560},[555,3689,670],{"class":560},[555,3691,3693,3695,3697,3700],{"class":3692,"line":549},[557,674],[555,3694,652],{"class":560},[555,3696,528],{"class":564},[555,3698,3699],{"class":568}," make-default",[555,3701,670],{"class":560},[555,3703,3705,3707,3709,3712,3714,3716,3719,3721],{"class":3704,"line":683},[557,674],[555,3706,652],{"class":560},[555,3708,3608],{"class":564},[555,3710,3711],{"class":568}," :object",[555,3713,636],{"class":560},[555,3715,639],{"class":560},[555,3717,3718],{"class":597},"boxRef",[555,3720,639],{"class":560},[555,3722,670],{"class":560},[555,3724,3725,3727,3730,3733,3735,3737,3739,3741,3743,3745,3747,3750,3752,3755],{"class":557,"line":704},[555,3726,652],{"class":560},[555,3728,3729],{"class":564},"TresMesh",[555,3731,3732],{"class":568}," ref",[555,3734,636],{"class":560},[555,3736,639],{"class":560},[555,3738,3718],{"class":597},[555,3740,639],{"class":560},[555,3742,658],{"class":568},[555,3744,636],{"class":560},[555,3746,639],{"class":560},[555,3748,3749],{"class":597},"[0, 4, 0]",[555,3751,639],{"class":560},[555,3753,3754],{"class":568}," cast-shadow",[555,3756,572],{"class":560},[555,3758,3759,3761,3764,3766,3768,3770,3773,3775],{"class":557,"line":727},[555,3760,707],{"class":560},[555,3762,3763],{"class":564},"TresBoxGeometry",[555,3765,3678],{"class":568},[555,3767,636],{"class":560},[555,3769,639],{"class":560},[555,3771,3772],{"class":597},"[1.5, 1.5, 1.5]",[555,3774,639],{"class":560},[555,3776,670],{"class":560},[555,3778,3779,3781,3783,3785,3787,3789,3792,3794],{"class":557,"line":737},[555,3780,707],{"class":560},[555,3782,710],{"class":564},[555,3784,713],{"class":568},[555,3786,636],{"class":560},[555,3788,639],{"class":560},[555,3790,3791],{"class":597},"#4F4F4F",[555,3793,639],{"class":560},[555,3795,670],{"class":560},[555,3797,3798,3800,3802],{"class":557,"line":747},[555,3799,730],{"class":560},[555,3801,3729],{"class":564},[555,3803,572],{"class":560},[555,3805,3806,3808,3810],{"class":557,"line":768},[555,3807,781],{"class":560},[555,3809,630],{"class":564},[555,3811,572],{"class":560},[555,3813,3814,3816,3818],{"class":557,"line":778},[555,3815,607],{"class":560},[555,3817,619],{"class":564},[555,3819,572],{"class":560},[796,3821,3822],{},[516,3823,3824,3825,3829,3830,3832,3833,3835,3836,538],{},"If you are using other controls ",[555,3826,3827],{"style":3251},[519,3828,528],{"href":104,"style":3254}," they will interfere with each other when dragging. To avoid this, you can set the ",[552,3831,839],{}," prop to ",[552,3834,992],{}," on the ",[837,3837,528],{},[540,3839,3841],{"id":3840},"modes","Modes",[516,3843,3844],{},"The Transform Controls can be used in three different modes:",[1441,3846,3848],{"id":3847},"translate","Translate",[516,3850,3851],{},[3852,3853],"img",{"alt":3848,"src":3854},"/cientos/transform-controls-translate.png",[516,3856,3857],{},"The default mode allows you to move the object around the scene.",[544,3859,3861],{"className":546,"code":3860,"language":550,"meta":488,"style":488},"\u003CTransformControls mode=\"translate\" :object=\"sphereRef\" />\n",[552,3862,3863],{"__ignoreMap":488},[555,3864,3865,3867,3869,3872,3874,3876,3878,3880,3883,3886,3888,3890,3893,3895],{"class":557,"line":489},[555,3866,561],{"class":560},[555,3868,3608],{"class":564},[555,3870,3871],{"class":568}," mode",[555,3873,636],{"class":560},[555,3875,639],{"class":560},[555,3877,3847],{"class":597},[555,3879,639],{"class":560},[555,3881,3882],{"class":560}," :",[555,3884,3885],{"class":568},"object",[555,3887,636],{"class":560},[555,3889,639],{"class":560},[555,3891,3892],{"class":584},"sphereRef",[555,3894,639],{"class":560},[555,3896,670],{"class":560},[1441,3898,3900],{"id":3899},"rotate","Rotate",[516,3902,3903],{},[3852,3904],{"alt":3900,"src":3905},"/cientos/transform-controls-rotate.png",[516,3907,3908],{},"The rotate mode allows you to rotate the object around the scene.",[544,3910,3912],{"className":546,"code":3911,"language":550,"meta":488,"style":488},"\u003CTransformControls mode=\"rotate\" :object=\"boxRef\" />\n",[552,3913,3914],{"__ignoreMap":488},[555,3915,3916,3918,3920,3922,3924,3926,3928,3930,3932,3934,3936,3938,3940,3942],{"class":557,"line":489},[555,3917,561],{"class":560},[555,3919,3608],{"class":564},[555,3921,3871],{"class":568},[555,3923,636],{"class":560},[555,3925,639],{"class":560},[555,3927,3899],{"class":597},[555,3929,639],{"class":560},[555,3931,3882],{"class":560},[555,3933,3885],{"class":568},[555,3935,636],{"class":560},[555,3937,639],{"class":560},[555,3939,3718],{"class":584},[555,3941,639],{"class":560},[555,3943,670],{"class":560},[1441,3945,3947],{"id":3946},"scale","Scale",[516,3949,3950],{},[3852,3951],{"alt":3947,"src":3952},"/cientos/transform-controls-scale.png",[516,3954,3955],{},"The scale mode allows you to scale the object around the scene.",[544,3957,3959],{"className":546,"code":3958,"language":550,"meta":488,"style":488},"\u003CTransformControls mode=\"scale\" :object=\"sphereRef\" />\n",[552,3960,3961],{"__ignoreMap":488},[555,3962,3963,3965,3967,3969,3971,3973,3975,3977,3979,3981,3983,3985,3987,3989],{"class":557,"line":489},[555,3964,561],{"class":560},[555,3966,3608],{"class":564},[555,3968,3871],{"class":568},[555,3970,636],{"class":560},[555,3972,639],{"class":560},[555,3974,3946],{"class":597},[555,3976,639],{"class":560},[555,3978,3882],{"class":560},[555,3980,3885],{"class":568},[555,3982,636],{"class":560},[555,3984,639],{"class":560},[555,3986,3892],{"class":584},[555,3988,639],{"class":560},[555,3990,670],{"class":560},[540,3992,804],{"id":803},[809,3994,3995,4005],{},[812,3996,3997],{},[815,3998,3999,4001,4003],{},[818,4000,821],{"align":820},[818,4002,824],{"align":820},[818,4004,827],{},[829,4006,4007,4027,4049,4065,4100,4120,4134,4148,4162,4176,4192,4208],{},[815,4008,4009,4013,4022],{},[834,4010,4011],{"align":820},[837,4012,3885],{},[834,4014,4015,4016,4021],{"align":820},"The instance ",[519,4017,4020],{"href":4018,"rel":4019},"https://threejs.org/docs/index.html#api/en/core/Object3D",[523],"Object3D"," to control.",[834,4023,4024],{},[552,4025,4026],{},"null",[815,4028,4029,4034,4045],{},[834,4030,4031],{"align":820},[837,4032,4033],{},"mode",[834,4035,4036,4037,4039,4040,4042,4043,538],{"align":820},"The mode of the controls. Can be ",[552,4038,3847],{},", ",[552,4041,3899],{}," or ",[552,4044,3946],{},[834,4046,4047],{},[552,4048,3847],{},[815,4050,4051,4056,4061],{},[834,4052,4053],{"align":820},[837,4054,4055],{},"enabled",[834,4057,2071,4058,4060],{"align":820},[552,4059,992],{},", the controls will be enabled.",[834,4062,4063],{},[552,4064,992],{},[815,4066,4067,4072,4096],{},[834,4068,4069],{"align":820},[837,4070,4071],{},"axis",[834,4073,4074,4075,4039,4078,4039,4081,4039,4084,4039,4087,4039,4090,4039,4093,538],{"align":820},"The axis to use for the controls. Can be ",[552,4076,4077],{},"X",[552,4079,4080],{},"Y",[552,4082,4083],{},"Z",[552,4085,4086],{},"XY",[552,4088,4089],{},"YZ",[552,4091,4092],{},"XZ",[552,4094,4095],{},"XYZ",[834,4097,4098],{},[552,4099,4095],{},[815,4101,4102,4107,4116],{},[834,4103,4104],{"align":820},[837,4105,4106],{},"space",[834,4108,4109,4110,4042,4113,538],{"align":820},"The space to use for the controls. Can be ",[552,4111,4112],{},"local",[552,4114,4115],{},"world",[834,4117,4118],{},[552,4119,4112],{},[815,4121,4122,4127,4130],{},[834,4123,4124],{"align":820},[837,4125,4126],{},"size",[834,4128,4129],{"align":820},"The size of the controls.",[834,4131,4132],{},[552,4133,3087],{},[815,4135,4136,4141,4144],{},[834,4137,4138],{"align":820},[837,4139,4140],{},"translationSnap",[834,4142,4143],{"align":820},"The distance to snap to when translating. (World units)",[834,4145,4146],{},[552,4147,4026],{},[815,4149,4150,4155,4158],{},[834,4151,4152],{"align":820},[837,4153,4154],{},"rotationSnap",[834,4156,4157],{"align":820},"The angle to snap to when rotating. (Radians)",[834,4159,4160],{},[552,4161,4026],{},[815,4163,4164,4169,4172],{},[834,4165,4166],{"align":820},[837,4167,4168],{},"scaleSnap",[834,4170,4171],{"align":820},"The scale to snap to when scaling.",[834,4173,4174],{},[552,4175,4026],{},[815,4177,4178,4183,4188],{},[834,4179,4180],{"align":820},[837,4181,4182],{},"showX",[834,4184,2071,4185,4187],{"align":820},[552,4186,992],{},", the X-axis helper will be shown.",[834,4189,4190],{},[552,4191,992],{},[815,4193,4194,4199,4204],{},[834,4195,4196],{"align":820},[837,4197,4198],{},"showY",[834,4200,2071,4201,4203],{"align":820},[552,4202,992],{},", the Y-axis helper will be shown.",[834,4205,4206],{},[552,4207,992],{},[815,4209,4210,4215,4220],{},[834,4211,4212],{"align":820},[837,4213,4214],{},"showZ",[834,4216,2071,4217,4219],{"align":820},[552,4218,992],{},", the Z-axis helper will be shown.",[834,4221,4222],{},[552,4223,992],{},[540,4225,1714],{"id":1713},[809,4227,4228,4236],{},[812,4229,4230],{},[815,4231,4232,4234],{},[818,4233,1779],{"align":820},[818,4235,824],{"align":820},[829,4237,4238,4248,4257,4267,4277],{},[815,4239,4240,4245],{},[834,4241,4242],{"align":820},[837,4243,4244],{},"dragging",[834,4246,4247],{"align":820},"Fired when the user starts or stops dragging the controls.",[815,4249,4250,4254],{},[834,4251,4252],{"align":820},[837,4253,1731],{},[834,4255,4256],{"align":820},"Fired when the user changes the controls.",[815,4258,4259,4264],{},[834,4260,4261],{"align":820},[837,4262,4263],{},"mouseDown",[834,4265,4266],{"align":820},"Fired when the user clicks on the controls.",[815,4268,4269,4274],{},[834,4270,4271],{"align":820},[837,4272,4273],{},"mouseUp",[834,4275,4276],{"align":820},"Fired when the user releases the mouse button on the controls.",[815,4278,4279,4284],{},[834,4280,4281],{"align":820},[837,4282,4283],{},"objectChange",[834,4285,4286],{"align":820},"Fired when the user changes the object.",[1812,4288,4289],{"scoped":496},"\nimg {\n    aspect-ratio: 16/9;\n    object-fit: cover;\n    object-position: top;\n    border-radius: 8px;\n}\n",[1812,4291,4292],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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);}",{"title":488,"searchDepth":489,"depth":490,"links":4294},[4295,4296,4301,4302],{"id":542,"depth":490,"text":15},{"id":3840,"depth":490,"text":3841,"children":4297},[4298,4299,4300],{"id":3847,"depth":604,"text":3848},{"id":3899,"depth":604,"text":3900},{"id":3946,"depth":604,"text":3947},{"id":803,"depth":490,"text":804},{"id":1713,"depth":490,"text":1714},"Set of three gizmos that can be used to translate, rotate and scale objects",{},{"title":111,"description":4303},"rtA5mRjWCioaInPfcKtnEcdh3kG88FfwUz7CBNeBOWs",1782052435810]