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