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