@realsee/five 6.8.0-alpha.2 → 6.8.0-alpha.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS_READ_ME.md +4 -0
- package/AI_CONTEXT.md +4 -0
- package/README.md +9 -6
- package/{guides → ai_guides}/README.md +12 -2
- package/ai_guides/ai-doc-guidelines.md +102 -0
- package/{guides → ai_guides}/api.md +24 -1
- package/ai_guides/features/3dtile.md +172 -0
- package/{guides → ai_guides}/features/camera-animation.md +24 -3
- package/{guides → ai_guides}/features/clipper.md +2 -0
- package/{guides/features/coordnate-system.md → ai_guides/features/coordinate-system.md} +2 -0
- package/{guides → ai_guides}/features/event.md +2 -0
- package/{guides → ai_guides}/features/five.md +4 -0
- package/ai_guides/features/flowing-light-2d-pass.md +438 -0
- package/ai_guides/features/flowing-light-3d-pass.md +420 -0
- package/ai_guides/features/gaussian-blur-pass.md +202 -0
- package/{guides → ai_guides}/features/gesture.md +3 -0
- package/{guides → ai_guides}/features/get-screen-pixels.md +2 -0
- package/{guides → ai_guides}/features/image-options.md +3 -0
- package/{guides → ai_guides}/features/load-external-model.md +21 -0
- package/ai_guides/features/load-progress.md +140 -0
- package/ai_guides/features/material.md +153 -0
- package/{guides → ai_guides}/features/mode.md +4 -0
- package/{guides → ai_guides}/features/model.md +4 -1
- package/{guides → ai_guides}/features/move-pano-effect.md +2 -0
- package/{guides → ai_guides}/features/multi-work.md +2 -0
- package/ai_guides/features/pano-filter.md +148 -0
- package/{guides → ai_guides}/features/pano-tile.md +7 -14
- package/ai_guides/features/pano-uv.md +131 -0
- package/ai_guides/features/parameter.md +153 -0
- package/ai_guides/features/plugin.md +210 -0
- package/{guides → ai_guides}/features/postprocessing.md +39 -4
- package/{guides → ai_guides}/features/raycast.md +11 -0
- package/{guides → ai_guides}/features/request-proxy.md +2 -0
- package/{guides → ai_guides}/features/screen-project.md +2 -0
- package/{guides → ai_guides}/features/state.md +2 -0
- package/ai_guides/features/view-layer.md +187 -0
- package/{guides → ai_guides}/features/work.md +63 -2
- package/{guides → ai_guides}/glossary.md +26 -5
- package/{guides → ai_guides}/intro.md +1 -1
- package/{guides → ai_guides}/quick-start.md +1 -0
- package/ai_guides/release_notes/6.8.md +208 -0
- package/{guides → ai_guides}/template.md +17 -3
- package/docs/00_FOR_AI_AGENTS.md +11 -0
- package/docs/README.md +4 -7
- package/docs/assets/hierarchy.js +1 -1
- package/docs/assets/navigation.js +1 -1
- package/docs/assets/search.js +1 -1
- package/docs/classes/five.AdaptiveLuminancePass.html +7 -6
- package/docs/classes/five.BoundingMesh.html +2 -2
- package/docs/classes/five.Camera.html +1 -1
- package/docs/classes/five.EyeDomeLightingPass.html +1 -1
- package/docs/classes/five.Five.html +73 -72
- package/docs/classes/five.FivePass.html +1 -1
- package/docs/classes/five.Histogram.html +19 -0
- package/docs/classes/five.InternalWebGLRenderer.html +1 -1
- package/docs/classes/five.Model.html +31 -31
- package/docs/classes/five.ModelScene.html +1 -1
- package/docs/classes/five.NetworkSubscribe.html +1 -1
- package/docs/classes/five.PBMContainer.html +1 -1
- package/docs/classes/five.PBMCustomShader.html +42 -3
- package/docs/classes/five.PBMGSObject.html +5 -3
- package/docs/classes/five.PBMGroup.html +1 -1
- package/docs/classes/five.PBMMesh.html +1 -1
- package/docs/classes/five.PBMMeshMaterial.html +16 -7
- package/docs/classes/five.PBMPanoFilter.html +61 -0
- package/docs/classes/five.PBMPointCloud.html +1 -1
- package/docs/classes/five.PBMPointCloudMaterial.html +5 -6
- package/docs/classes/five.PBMSkinnedMesh.html +1 -1
- package/docs/classes/five.PBMUpdateable.html +41 -0
- package/docs/classes/five.PanoCircleMesh.html +1 -1
- package/docs/classes/five.PanoCircleMeshCustom.html +1 -1
- package/docs/classes/five.PanoCircleMeshSolid.html +1 -1
- package/docs/classes/five.Parameter.html +57 -53
- package/docs/classes/five.Scene.html +1 -1
- package/docs/classes/five.Subscribe.html +1 -1
- package/docs/classes/five.Tile.html +1 -1
- package/docs/classes/five.Tile3D.html +30 -26
- package/docs/classes/five.TileNode.html +1 -1
- package/docs/classes/five.Trajectory.html +1 -1
- package/docs/classes/five.TrajectoryNode.html +1 -1
- package/docs/classes/five.Work.html +16 -16
- package/docs/classes/five.WorkResolvedObserver.html +27 -2
- package/docs/classes/gltf-loader.DDSLoader.html +1 -1
- package/docs/classes/gltf-loader.DRACOLoader.html +1 -1
- package/docs/classes/gltf-loader.GLTFLoader.html +1 -1
- package/docs/classes/gltf-loader.GLTFObject.html +1 -1
- package/docs/classes/gltf-loader.GLTFParser.html +1 -1
- package/docs/classes/gltf-loader.THREEGLTFLoader.html +1 -1
- package/docs/classes/line.Line.html +1 -1
- package/docs/classes/line.LineGeometry.html +1 -1
- package/docs/classes/line.LineMaterial.html +1 -1
- package/docs/classes/line.LineSegmentsGeometry.html +1 -1
- package/docs/classes/line.THREE_Line2.html +1 -1
- package/docs/classes/line.THREE_LineSegments2.html +1 -1
- package/docs/classes/plugins.BasePlugin.Controller.html +1 -1
- package/docs/classes/plugins.RoundedBoxGeometry.html +1 -1
- package/docs/classes/sticker.Sticker.html +1 -1
- package/docs/classes/vfx.Airflow.html +1 -1
- package/docs/classes/vfx.Flame.html +1 -1
- package/docs/classes/vfx.Particle.html +1 -1
- package/docs/classes/vfx.ParticleGPU.html +1 -1
- package/docs/classes/vfx.SpotLight.html +1 -1
- package/docs/documents/README.html +11 -2
- package/docs/documents/ai-doc-guidelines.html +60 -15
- package/docs/documents/api.html +40 -15
- package/docs/documents/features_3dtile.html +142 -45
- package/docs/documents/features_camera-animation.html +62 -5
- package/docs/documents/features_clipper.html +3 -0
- package/docs/documents/{features_coordnate-system.html → features_coordinate-system.html} +4 -1
- package/docs/documents/features_event.html +3 -0
- package/docs/documents/features_five.html +4 -0
- package/docs/documents/features_flowing-light-2d-pass.html +356 -0
- package/docs/documents/features_flowing-light-3d-pass.html +351 -0
- package/docs/documents/features_gaussian-blur-pass.html +182 -0
- package/docs/documents/features_gesture.html +4 -0
- package/docs/documents/features_get-screen-pixels.html +3 -0
- package/docs/documents/features_image-options.html +3 -0
- package/docs/documents/features_load-external-model.html +25 -2
- package/docs/documents/features_load-progress.html +110 -0
- package/docs/documents/features_material.html +341 -0
- package/docs/documents/features_mode.html +5 -0
- package/docs/documents/features_model.html +5 -1
- package/docs/documents/features_move-pano-effect.html +3 -0
- package/docs/documents/features_multi-work.html +3 -0
- package/docs/documents/features_pano-filter.html +122 -0
- package/docs/documents/features_pano-tile.html +34 -19
- package/docs/documents/features_pano-uv.html +82 -0
- package/docs/documents/features_parameter.html +76 -56
- package/docs/documents/features_plugin.html +105 -0
- package/docs/documents/features_postprocessing.html +22 -5
- package/docs/documents/features_raycast.html +4 -1
- package/docs/documents/features_request-proxy.html +3 -0
- package/docs/documents/features_screen-project.html +3 -0
- package/docs/documents/features_state.html +3 -0
- package/docs/documents/features_view-layer.html +158 -0
- package/docs/documents/features_work.html +63 -2
- package/docs/documents/glossary.html +31 -6
- package/docs/documents/intro.html +1 -1
- package/docs/documents/quick-start.html +1 -0
- package/docs/documents/release_notes_6.8.html +189 -0
- package/docs/documents/template.html +45 -4
- package/docs/functions/five.loadAt3d.html +1 -1
- package/docs/functions/five.loadB3dm.html +1 -1
- package/docs/functions/five.loadDome.html +1 -1
- package/docs/functions/five.loadDomez.html +1 -1
- package/docs/functions/five.loadFbx.html +1 -1
- package/docs/functions/five.loadGltf.html +1 -1
- package/docs/functions/five.loadPbm.html +1 -1
- package/docs/functions/five.loadPly.html +1 -1
- package/docs/functions/five.loadPnts.html +1 -1
- package/docs/functions/five.loadSplat.html +1 -1
- package/docs/functions/five.loadSpz.html +1 -1
- package/docs/functions/five.loadX3p.html +1 -1
- package/docs/functions/five.parseWork.html +1 -1
- package/docs/functions/vue.useFiveWorks.html +2 -2
- package/docs/hierarchy.html +1 -1
- package/docs/index.html +11 -2
- package/docs/interfaces/five.AddableObject.html +1 -1
- package/docs/interfaces/five.AjaxOptions.html +1 -1
- package/docs/interfaces/five.BaseEvent.html +2 -2
- package/docs/interfaces/five.EventCallback.html +53 -47
- package/docs/interfaces/five.FloorplanControllerCustomInitArgs.html +9 -9
- package/docs/interfaces/five.GestureEvent.html +2 -2
- package/docs/interfaces/five.ImageOptions.html +1 -1
- package/docs/interfaces/five.IntersectEvent.html +2 -2
- package/docs/interfaces/five.IntersectMesh.html +1 -1
- package/docs/interfaces/five.IntersectMeshInterface.html +1 -1
- package/docs/interfaces/five.Intersection.html +4 -3
- package/docs/interfaces/five.LooseWorkWithExtrinsics.html +6 -6
- package/docs/interfaces/five.MapviewControllerCustomInitArgs.html +9 -9
- package/docs/interfaces/five.ModeChangeEvent.html +2 -2
- package/docs/interfaces/five.ModelControllerCustomInitArgs.html +1 -1
- package/docs/interfaces/five.ModelEvent.html +2 -2
- package/docs/interfaces/five.ModelSceneEvent.html +2 -2
- package/docs/interfaces/five.ModelTileEvent.html +8 -0
- package/docs/interfaces/five.MovePanoOptions.html +7 -7
- package/docs/interfaces/five.NetworkAbortError.html +1 -1
- package/docs/interfaces/five.NetworkFirbiddenError.html +1 -1
- package/docs/interfaces/five.NetworkOptions.html +1 -1
- package/docs/interfaces/five.NetworkProxyError.html +1 -1
- package/docs/interfaces/five.NetworkResourceEvent.html +2 -2
- package/docs/interfaces/five.NetworkResponseError.html +1 -1
- package/docs/interfaces/five.NetworkTimeoutError.html +1 -1
- package/docs/interfaces/five.ObjectEvent.html +2 -2
- package/docs/interfaces/five.PBMClipperParameter.html +2 -2
- package/docs/interfaces/five.PBMCustomShaderInitArgs.html +2 -2
- package/docs/interfaces/five.PBMCustomShaderSlots.html +2 -2
- package/docs/interfaces/five.PBMMaterial.html +1 -1
- package/docs/interfaces/five.PBMMeshMaterialParameters.html +5 -3
- package/docs/interfaces/five.PBMPanoDepth.html +5 -5
- package/docs/interfaces/five.PBMPanoFilterValue.html +6 -0
- package/docs/interfaces/five.PBMPanoPicture.html +8 -6
- package/docs/interfaces/five.PBMPointCloudMaterialParameters.html +2 -3
- package/docs/interfaces/five.PBMRefinedScreen.html +2 -2
- package/docs/interfaces/five.PanoCircleMeshInterface.html +1 -1
- package/docs/interfaces/five.PanoEvent.html +2 -2
- package/docs/interfaces/five.PanoTextureEvent.html +2 -2
- package/docs/interfaces/five.PanoramaControllerCustomInitArgs.html +1 -1
- package/docs/interfaces/five.PanoramaLikeControllerCustomInitArgs.html +1 -1
- package/docs/interfaces/five.ParameterMaterialValue.html +42 -38
- package/docs/interfaces/five.ParameterTilesetValue.html +15 -15
- package/docs/interfaces/five.ParameterValue.html +56 -52
- package/docs/interfaces/five.Pose.html +1 -1
- package/docs/interfaces/five.RenderEvent.html +2 -2
- package/docs/interfaces/five.ResolvedParameterValue.html +56 -52
- package/docs/interfaces/five.RgbaData.html +7 -0
- package/docs/interfaces/five.SplatData.html +2 -2
- package/docs/interfaces/five.State.html +1 -1
- package/docs/interfaces/five.StateEvent.html +2 -2
- package/docs/interfaces/five.TextureOptions.html +1 -1
- package/docs/interfaces/five.Tile3DOptions.html +2 -2
- package/docs/interfaces/five.TopviewControllerCustomInitArgs.html +7 -7
- package/docs/interfaces/five.VRPanoramaControllerCustomInitArgs.html +1 -1
- package/docs/interfaces/five.ViewLayer.html +30 -26
- package/docs/interfaces/five.WorkCubeImage.html +1 -1
- package/docs/interfaces/five.WorkImage.html +1 -1
- package/docs/interfaces/five.WorkModel.html +8 -8
- package/docs/interfaces/five.WorkModelLayer.html +6 -6
- package/docs/interfaces/five.WorkObserver.html +27 -2
- package/docs/interfaces/five.WorkTile.html +1 -1
- package/docs/interfaces/five.WorksEvent.html +2 -2
- package/docs/interfaces/five.XRControllerEvent.html +2 -2
- package/docs/interfaces/five.XRGestureEvent.html +2 -2
- package/docs/interfaces/five.XRPanoramaControllerCustomInitArgs.html +1 -1
- package/docs/interfaces/five.XRSessionEvent.html +2 -2
- package/docs/interfaces/plugins.BackgroundPluginController.html +1 -1
- package/docs/interfaces/plugins.BackgroundPluginType.EventMap.html +1 -1
- package/docs/interfaces/plugins.BasePlugin.State.html +1 -1
- package/docs/interfaces/plugins.DynamicPathLinePluginController.html +1 -1
- package/docs/interfaces/plugins.DynamicPathLinePluginType.EventMap.html +1 -1
- package/docs/interfaces/plugins.DynamicPathLinePluginType.State.html +1 -1
- package/docs/interfaces/plugins.ItemMaskController.html +1 -1
- package/docs/interfaces/plugins.ItemMaskPluginType.EventMap.html +1 -1
- package/docs/interfaces/plugins.ItemMaskPluginType.State.html +1 -1
- package/docs/interfaces/plugins.OrientationPluginController.html +1 -1
- package/docs/interfaces/plugins.OrientationPluginType.EventMap.html +1 -1
- package/docs/interfaces/plugins.OrientationPluginType.State.html +1 -1
- package/docs/interfaces/plugins.PanoAnimeController.html +1 -1
- package/docs/interfaces/plugins.PanoAnimePluginType.EventMap.html +1 -1
- package/docs/interfaces/plugins.PanoAnimePluginType.State.html +1 -1
- package/docs/interfaces/plugins.PluginTemplateType.EventMap.html +1 -1
- package/docs/interfaces/plugins.PluginTemplateType.State.html +1 -1
- package/docs/interfaces/plugins.TrajectoryController.html +1 -1
- package/docs/interfaces/react.FiveInjectionTypes.html +13 -13
- package/docs/modules/five.html +1 -1
- package/docs/modules.html +1 -1
- package/docs/types/five.ControllerEventTypes.html +27 -25
- package/docs/types/five.EasingFunction.html +1 -0
- package/docs/types/five.EventTypes.html +27 -25
- package/docs/types/five.FivePlugin.html +1 -1
- package/docs/types/five.FivePluginInit.html +1 -1
- package/docs/types/five.FivePluginInstance.html +1 -1
- package/docs/types/five.NetworkProgressCallback.html +1 -1
- package/docs/types/five.PBMAlphaMode.html +1 -1
- package/docs/types/five.PBMColorStyle.html +1 -1
- package/docs/types/five.PBMFloorStyle.html +1 -1
- package/docs/types/five.PBMMeshShaderType.html +1 -1
- package/docs/types/five.PBMPointBack.html +1 -1
- package/docs/types/five.PBMPointCloudShaderType.html +1 -1
- package/docs/types/five.PBMPointShape.html +1 -1
- package/docs/types/five.PBMPointSize.html +1 -1
- package/docs/types/five.PBMTransition.html +1 -1
- package/docs/types/five.ParseOptions.html +6 -6
- package/docs/types/plugins.BasePlugin.EventMap.html +1 -1
- package/docs/variables/five.PROXY_CONTROLLER_EVENT_NAMES.html +1 -1
- package/five/application/analysis.d.ts +40 -0
- package/five/application/controllers.d.ts +41 -0
- package/five/application/events-legacy.d.ts +454 -0
- package/five/application/events.d.ts +69 -0
- package/five/application/five.d.ts +519 -0
- package/five/application/fiveInitArgs.d.ts +176 -0
- package/five/application/fiveLoadOptions.d.ts +21 -0
- package/five/application/generateDefaultVideoElement.d.ts +2 -0
- package/five/application/getViewportScale.d.ts +2 -0
- package/five/application/initLights.d.ts +3 -0
- package/five/application/mode.d.ts +28 -0
- package/five/application/renderPoweredByRealsee.d.ts +3 -0
- package/five/assets/cardboard-png-data-url.d.ts +2 -0
- package/five/assets/gradient-png-data-url.d.ts +2 -0
- package/five/assets/loading-png-data-url.d.ts +2 -0
- package/five/assets/phone-png-data-url.d.ts +2 -0
- package/five/assets/realsee-png-data-url.d.ts +2 -0
- package/five/bvh/bvhMath.d.ts +33 -0
- package/five/bvh/bvhMesh.d.ts +7 -0
- package/five/bvh/bvhNode.d.ts +29 -0
- package/five/bvh/bvhObject.d.ts +18 -0
- package/five/bvh/bvhPoints.d.ts +6 -0
- package/five/bvh/index.d.ts +10 -0
- package/five/bvh/worker.d.ts +35 -0
- package/five/cardboard/helper.d.ts +2 -0
- package/five/cardboard/index.d.ts +13 -0
- package/five/cardboard/sensor.d.ts +158 -0
- package/five/certificates/hardware.d.ts +1 -0
- package/five/controllers/base.d.ts +167 -0
- package/five/controllers/events.d.ts +71 -0
- package/five/controllers/floorplan.d.ts +119 -0
- package/five/controllers/mapview.d.ts +139 -0
- package/five/controllers/model.d.ts +57 -0
- package/five/controllers/panorama.d.ts +143 -0
- package/five/controllers/panoramaLike.d.ts +87 -0
- package/five/controllers/topview.d.ts +42 -0
- package/five/controllers/vrPanorama.d.ts +56 -0
- package/five/controllers/xrPanorama.d.ts +81 -0
- package/five/core/camera.d.ts +65 -0
- package/five/core/internalWebGLRenderer.d.ts +14 -0
- package/five/core/panoVideo.d.ts +18 -0
- package/five/core/scene.d.ts +10 -0
- package/five/core/tiling.d.ts +43 -0
- package/five/declare.d.ts +2 -1
- package/five/gaussian-splatting/util/renderData.d.ts +52 -0
- package/five/gaussian-splatting/wasm/data.d.ts +20 -0
- package/five/gaussian-splatting/wasm/sort.d.ts +18 -0
- package/five/gaussian-splatting/worker/dataWorker.d.ts +1 -0
- package/five/gaussian-splatting/worker/sortWorker.d.ts +1 -0
- package/five/index.d.ts +60 -4637
- package/five/index.js +193 -341
- package/five/index.mjs +26455 -31011
- package/five/meshes/boundingMesh.d.ts +12 -0
- package/five/meshes/intersectMesh.d.ts +8 -0
- package/five/meshes/panoCircleMesh.d.ts +35 -0
- package/five/meshes/panoCircleMeshCustom.d.ts +40 -0
- package/five/meshes/panoCircleMeshSolid.d.ts +34 -0
- package/five/meshes/panoSphereMesh.d.ts +27 -0
- package/five/model/helpers/coordinate-transform.d.ts +3 -0
- package/five/model/helpers/ellipsoid-coordinates.d.ts +14 -0
- package/five/model/helpers/get-edges-by-sphere.d.ts +8 -0
- package/five/model/helpers/get-recommend-tile3d-parameters.d.ts +8 -0
- package/five/model/index.d.ts +70 -0
- package/five/model/intersection.d.ts +18 -0
- package/five/model/loaders/at3d.d.ts +12 -0
- package/five/model/loaders/b3dm.d.ts +9 -0
- package/five/model/loaders/dome.d.ts +22 -0
- package/five/model/loaders/domez.d.ts +11 -0
- package/five/model/loaders/fbx.d.ts +8 -0
- package/five/model/loaders/glTF-helpers/extensions/CESIUM_RTC.d.ts +9 -0
- package/five/model/loaders/glTF-helpers/extensions/EXT_meshopt_compression.d.ts +8 -0
- package/five/model/loaders/glTF-helpers/extensions/EXT_texture_webp.d.ts +11 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_animation_pointer.d.ts +6 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_binary_glTF.d.ts +25 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_draco_mesh_compression.d.ts +11 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_gaussian_splatting_compression_spz.d.ts +9 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_materials_clearcoat.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_materials_emissive_strength.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_materials_sheen.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_materials_transmission.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_materials_unlit.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_mesh_quantization.d.ts +6 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_node_visibility.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_texture_basisu.d.ts +9 -0
- package/five/model/loaders/glTF-helpers/extensions/KHR_texture_transform.d.ts +10 -0
- package/five/model/loaders/glTF-helpers/extensions/REALSEE_materials_lightmap.d.ts +7 -0
- package/five/model/loaders/glTF-helpers/extensions/base.d.ts +24 -0
- package/five/model/loaders/glTF-helpers/glTF.d.ts +713 -0
- package/five/model/loaders/glTF-helpers/index.d.ts +47 -0
- package/five/model/loaders/glTF-helpers/parser.d.ts +114 -0
- package/five/model/loaders/glTF-helpers/type.d.ts +14 -0
- package/five/model/loaders/gltf.d.ts +10 -0
- package/five/model/loaders/obj.d.ts +9 -0
- package/five/model/loaders/pbm.d.ts +26 -0
- package/five/model/loaders/ply.d.ts +24 -0
- package/five/model/loaders/pnts.d.ts +8 -0
- package/five/model/loaders/protobuf/dome.d.ts +540 -0
- package/five/model/loaders/protobuf/pbm.d.ts +203 -0
- package/five/model/loaders/shared.d.ts +16 -0
- package/five/model/loaders/splat.d.ts +8 -0
- package/five/model/loaders/spz.d.ts +14 -0
- package/five/model/loaders/tile3d-helpers/feature-table.d.ts +15 -0
- package/five/model/loaders/tile3d-helpers/gl-type.d.ts +20 -0
- package/five/model/loaders/tile3d-helpers/parse-gltf-array-buffer.d.ts +2 -0
- package/five/model/loaders/tile3d-helpers/parse-header.d.ts +2 -0
- package/five/model/loaders/tile3d-helpers/parse-point-cloud-attributes.d.ts +2 -0
- package/five/model/loaders/tile3d-helpers/parse-point-cloud-attributes.worker.d.ts +6 -0
- package/five/model/loaders/tile3d-helpers/parse-table.d.ts +3 -0
- package/five/model/loaders/tile3d-helpers/tile3d-type.d.ts +35 -0
- package/five/model/loaders/x3p.d.ts +22 -0
- package/five/model/materials/pbmMaterial.d.ts +137 -0
- package/five/model/materials/pbmMeshMaterial.d.ts +126 -0
- package/five/model/materials/pbmPointCloudMaterial.d.ts +70 -0
- package/five/model/model-scene.d.ts +172 -0
- package/five/model/model.d.ts +209 -0
- package/five/model/objects/pbmContainer.d.ts +28 -0
- package/five/model/objects/pbmGaussianSplattingObject.d.ts +43 -0
- package/five/model/objects/pbmGaussianSplattingRenderMesh.d.ts +55 -0
- package/five/model/objects/pbmGaussianSplattingTestMesh.d.ts +7 -0
- package/five/model/objects/pbmGroup.d.ts +8 -0
- package/five/model/objects/pbmMesh.d.ts +10 -0
- package/five/model/objects/pbmPointCloud.d.ts +7 -0
- package/five/model/parameter.d.ts +140 -0
- package/five/model/shaders/pbm_gaussian_splatting/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_gaussian_splatting/vertex.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_basic/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_basic/vertex.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_none/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_none/vertex.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_phong/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_phong/vertex.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_standard/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_mesh_standard/vertex.d.ts +2 -0
- package/five/model/shaders/pbm_pointcloud/fragment.d.ts +2 -0
- package/five/model/shaders/pbm_pointcloud/vertex.d.ts +2 -0
- package/five/model/tile3d/header.d.ts +88 -0
- package/five/model/tile3d/index.d.ts +214 -0
- package/five/model/tile3d/tile-cache.d.ts +18 -0
- package/five/model/tile3d/tile-content.d.ts +10 -0
- package/five/model/tile3d/tile-node.d.ts +24 -0
- package/five/model/tile3d/tile-request-scheduler.d.ts +17 -0
- package/five/model/tile3d/tile.d.ts +79 -0
- package/five/model/tile3d/tileset-base-traverser.d.ts +59 -0
- package/five/model/tile3d/tileset-most-detail-traverser.d.ts +14 -0
- package/five/model/tile3d/tileset-normal-traverser.d.ts +15 -0
- package/five/model/tile3d/tileset-skip-traverser.d.ts +60 -0
- package/five/model/tile3d/tileset.d.ts +69 -0
- package/five/model/tile3d/trajectory-content.d.ts +9 -0
- package/five/model/tile3d/trajectory-node.d.ts +15 -0
- package/five/model/tile3d/trajectory.d.ts +30 -0
- package/five/model/tile3d/types.d.ts +33 -0
- package/five/model/view-layer.d.ts +20 -0
- package/five/renderer/five-renderer.d.ts +17 -0
- package/five/renderer/index.d.ts +3 -0
- package/five/renderer/postprocessing/composer.d.ts +37 -0
- package/five/renderer/postprocessing/index.d.ts +7 -0
- package/five/renderer/postprocessing/passes/adaptive-luminance-pass.d.ts +17 -0
- package/five/renderer/postprocessing/passes/eye-dome-lighting-pass.d.ts +14 -0
- package/five/renderer/postprocessing/passes/flowing-light-2d-pass.d.ts +36 -0
- package/five/renderer/postprocessing/passes/flowing-light-3d-pass.d.ts +36 -0
- package/five/renderer/postprocessing/passes/gaussian-blur-pass.d.ts +12 -0
- package/five/renderer/postprocessing/passes/pass.d.ts +38 -0
- package/five/renderer/scene-renderers/point-cloud-high-quality-scene-renderer.d.ts +11 -0
- package/five/renderer/scene-renderers/scene-renderer.d.ts +9 -0
- package/five/renderer/scene-renderers/ssaa-scene-renderer.d.ts +15 -0
- package/five/renderer/tools/full-screen-quad.d.ts +15 -0
- package/five/renderer/tools/render-cube-to-equirectangular.d.ts +7 -0
- package/five/renderer/tools/render-full-screen-depth.d.ts +2 -0
- package/five/renderer/tools/render-full-screen.d.ts +2 -0
- package/five/texture/histogram.d.ts +54 -0
- package/five/texture/imageBitmap.d.ts +13 -0
- package/five/texture/initTexture.d.ts +3 -0
- package/five/texture/loader.d.ts +39 -0
- package/five/texture/textureData.d.ts +11 -0
- package/five/thirdparty/fflate.d.ts +1407 -0
- package/five/thirdparty/hammer.d.ts +375 -0
- package/five/thirdparty/jsrsasign.d.ts +753 -0
- package/five/thirdparty/meshopt_decoder.d.ts +15 -0
- package/five/three-version-check.d.ts +1 -0
- package/five/types/addableObject.d.ts +12 -0
- package/five/types/cube.d.ts +1 -0
- package/five/types/gestureInput.d.ts +24 -0
- package/five/types/imageOptions.d.ts +20 -0
- package/five/types/intersectMeshInterface.d.ts +8 -0
- package/five/types/movePanoEffect.d.ts +13 -0
- package/five/types/movePanoOptions.d.ts +36 -0
- package/five/types/panoCircleMeshInterface.d.ts +34 -0
- package/five/types/plugin.d.ts +25 -0
- package/five/types/pose.d.ts +17 -0
- package/five/types/state.d.ts +20 -0
- package/five/types/viewport.d.ts +22 -0
- package/five/utils/ajax.d.ts +66 -0
- package/five/utils/animationFrameLoop.d.ts +45 -0
- package/five/utils/array.d.ts +31 -0
- package/five/utils/asyncTaskQueue.d.ts +8 -0
- package/five/utils/bufferGeometry.d.ts +33 -0
- package/five/utils/calculateProgress.d.ts +39 -0
- package/five/utils/calculateThreeMouse.d.ts +13 -0
- package/five/utils/canplayVideo.d.ts +2 -0
- package/five/utils/clamp.d.ts +2 -0
- package/five/utils/clock.d.ts +17 -0
- package/five/utils/createSymbol.d.ts +5 -0
- package/five/utils/decodeText.d.ts +2 -0
- package/five/utils/deepEqual.d.ts +2 -0
- package/five/utils/deepFreeze.d.ts +2 -0
- package/five/utils/defineProperty.d.ts +9 -0
- package/five/utils/detector.d.ts +14 -0
- package/five/utils/distance.d.ts +10 -0
- package/five/utils/draco.d.ts +26 -0
- package/five/utils/easing.d.ts +63 -0
- package/five/utils/event.d.ts +159 -0
- package/five/utils/formatRad.d.ts +7 -0
- package/five/utils/imageSupport.d.ts +6 -0
- package/five/utils/imageURL.d.ts +42 -0
- package/five/utils/isEmptyObject.d.ts +2 -0
- package/five/utils/isNil.d.ts +6 -0
- package/five/utils/isNumber.d.ts +2 -0
- package/five/utils/isPowerOfTwo.d.ts +2 -0
- package/five/utils/isPromise.d.ts +2 -0
- package/five/utils/isSimilar.d.ts +6 -0
- package/five/utils/json.d.ts +7 -0
- package/five/utils/ktx2.d.ts +30 -0
- package/five/utils/lzma/index.d.ts +2 -0
- package/five/utils/lzma/lzma.d.ts +3 -0
- package/five/utils/lzma/lzmaWASM.d.ts +2 -0
- package/five/utils/lzma/lzmaWorker.d.ts +14 -0
- package/five/utils/memoryUsage.d.ts +29 -0
- package/five/utils/motion.d.ts +38 -0
- package/five/utils/noop.d.ts +6 -0
- package/five/utils/now.d.ts +7 -0
- package/five/utils/pano.d.ts +9 -0
- package/five/utils/pick.d.ts +3 -0
- package/five/utils/poseUtils.d.ts +5 -0
- package/five/utils/renderCubeTextureToCubeRenderTarget.d.ts +3 -0
- package/five/utils/renderDepth.d.ts +2 -0
- package/five/utils/renderTexturesToCubeRenderTarget.d.ts +10 -0
- package/five/utils/requestPermission.d.ts +3 -0
- package/five/utils/shaderContentFix.d.ts +7 -0
- package/five/utils/shaderMaterial.d.ts +20 -0
- package/five/utils/stateUtils.d.ts +5 -0
- package/five/utils/string-pattern.d.ts +8 -0
- package/five/utils/subscribe.d.ts +67 -0
- package/five/utils/tileCube.d.ts +19 -0
- package/five/utils/toFastProperties.d.ts +1 -0
- package/five/utils/typedCache.d.ts +10 -0
- package/five/utils/uniform.d.ts +15 -0
- package/five/utils/url.d.ts +35 -0
- package/five/utils/uuid.d.ts +5 -0
- package/five/utils/values.d.ts +2 -0
- package/five/utils/vectorCoordinates.d.ts +29 -0
- package/five/utils/volume.d.ts +111 -0
- package/five/utils/webglError.d.ts +7 -0
- package/five/utils/worker.d.ts +26 -0
- package/five/webxr/XRControllerModelFactory.d.ts +28 -0
- package/five/webxr/motionHelper.d.ts +68 -0
- package/five/webxr/xrButton.d.ts +4 -0
- package/five/webxr/xrController.d.ts +24 -0
- package/five/webxr/xrManager.d.ts +84 -0
- package/five/work/_ALLOW_HOST.d.ts +2 -0
- package/five/work/index.d.ts +6 -0
- package/five/work/keychain.d.ts +5 -0
- package/five/work/looseWorkType.d.ts +121 -0
- package/five/work/verify.d.ts +7 -0
- package/five/work/work.d.ts +236 -0
- package/five/work/workFetcher.d.ts +4 -0
- package/five/work/workJson.d.ts +3 -0
- package/five/work/workJsonType.d.ts +73 -0
- package/five/work/workObserverUtils.d.ts +36 -0
- package/five/work/workParser.d.ts +6 -0
- package/five/work/workResolvedObserver.d.ts +12 -0
- package/five/work/workVerify.d.ts +2 -0
- package/five/work/works.d.ts +10 -0
- package/gltf-loader/gltf-object.d.ts +17 -0
- package/gltf-loader/index.d.ts +60 -160
- package/gltf-loader/index.js +9 -9
- package/gltf-loader/index.mjs +1351 -1451
- package/gltf-loader/thirdparty/DDSLoader.d.ts +23 -0
- package/gltf-loader/thirdparty/DRACOLoader.d.ts +18 -0
- package/gltf-loader/thirdparty/GLTFLoader.d.ts +59 -0
- package/line/circle_png.d.ts +1 -0
- package/line/index.d.ts +19 -69
- package/line/index.js +4 -4
- package/line/index.mjs +334 -513
- package/line/utils/Line2.d.ts +7 -0
- package/line/utils/LineGeometry.d.ts +10 -0
- package/line/utils/LineMaterial.d.ts +20 -0
- package/line/utils/LineSegments2.d.ts +11 -0
- package/line/utils/LineSegmentsGeometry.d.ts +15 -0
- package/llms.txt +43 -31
- package/package.json +11 -2
- package/plugins/BackgroundPlugin/Controller.d.ts +20 -0
- package/plugins/BackgroundPlugin/index.d.ts +5 -0
- package/plugins/BackgroundPlugin/typings.d.ts +44 -0
- package/plugins/BasePlugin/index.d.ts +119 -0
- package/plugins/DynamicPathLinePlugin/Controller.d.ts +167 -0
- package/plugins/DynamicPathLinePlugin/index.d.ts +5 -0
- package/plugins/DynamicPathLinePlugin/line2/Line2.d.ts +7 -0
- package/plugins/DynamicPathLinePlugin/line2/LineGeometry.d.ts +10 -0
- package/plugins/DynamicPathLinePlugin/line2/LineMaterial.d.ts +17 -0
- package/plugins/DynamicPathLinePlugin/line2/LineSegments2.d.ts +11 -0
- package/plugins/DynamicPathLinePlugin/line2/LineSegmentsGeometry.d.ts +15 -0
- package/plugins/DynamicPathLinePlugin/typing.d.ts +129 -0
- package/plugins/DynamicPathLinePlugin/typings.d.ts +72 -0
- package/plugins/ItemMaskPlugin/Controller.d.ts +48 -0
- package/plugins/ItemMaskPlugin/index.d.ts +5 -0
- package/plugins/ItemMaskPlugin/typing.d.ts +58 -0
- package/plugins/OrientationPlugin/Controller.d.ts +82 -0
- package/plugins/OrientationPlugin/RoundedBoxGeometry.d.ts +11 -0
- package/plugins/OrientationPlugin/index.d.ts +6 -0
- package/plugins/OrientationPlugin/typing.d.ts +25 -0
- package/plugins/PanoAnimePlugin/Controller.d.ts +46 -0
- package/plugins/PanoAnimePlugin/index.d.ts +5 -0
- package/plugins/PanoAnimePlugin/typing.d.ts +37 -0
- package/plugins/PluginTemplate/Controller.d.ts +27 -0
- package/plugins/PluginTemplate/index.d.ts +5 -0
- package/plugins/PluginTemplate/typing.d.ts +21 -0
- package/plugins/TrajectoryPlugin/Controller.d.ts +85 -0
- package/plugins/TrajectoryPlugin/index.d.ts +6 -0
- package/plugins/TrajectoryPlugin/typing.d.ts +25 -0
- package/plugins/index.d.ts +9 -1102
- package/plugins/index.js +17 -21
- package/plugins/index.mjs +3342 -4245
- package/plugins/thirdParty/CSS3DRenderer.d.ts +32 -0
- package/plugins/thirdParty/OrbitControls.d.ts +78 -0
- package/plugins/utils/absoluteUrl.d.ts +5 -0
- package/plugins/utils/clamp.d.ts +2 -0
- package/plugins/utils/loadImage.d.ts +1 -0
- package/plugins/utils/motion.d.ts +38 -0
- package/plugins/utils/now.d.ts +6 -0
- package/plugins/utils/uuid.d.ts +5 -0
- package/react/canvas.d.ts +19 -0
- package/react/context.d.ts +11 -0
- package/react/createProvider.d.ts +95 -0
- package/react/createStore.d.ts +144 -0
- package/react/hooks/unsafe__useFiveInstance.d.ts +9 -0
- package/react/hooks/useFiveAction.d.ts +147 -0
- package/react/hooks/useFiveCameraDirection.d.ts +7 -0
- package/react/hooks/useFiveCameraRaycaster.d.ts +7 -0
- package/react/hooks/useFiveCurrentObserver.d.ts +11 -0
- package/react/hooks/useFiveCurrentState.d.ts +15 -0
- package/react/hooks/useFiveEventCallback.d.ts +12 -0
- package/react/hooks/useFiveFloor.d.ts +15 -0
- package/react/hooks/useFiveHelper.d.ts +14 -0
- package/react/hooks/useFiveModelBounding.d.ts +5 -0
- package/react/hooks/useFiveModelEffect.d.ts +14 -0
- package/react/hooks/useFiveModelIntersectRaycaster.d.ts +22 -0
- package/react/hooks/useFiveModelReadyState.d.ts +8 -0
- package/react/hooks/useFiveProject2d.d.ts +20 -0
- package/react/hooks/useFiveSceneEffect.d.ts +21 -0
- package/react/hooks/useFiveState.d.ts +6 -0
- package/react/hooks/useFiveWork.d.ts +29 -0
- package/react/index.d.ts +24 -830
- package/react/index.js +3 -3
- package/react/index.mjs +572 -783
- package/react/rendererPool.d.ts +7 -0
- package/react/withFive.d.ts +213 -0
- package/shader-lib/EvenessPlane/index.d.ts +10 -0
- package/shader-lib/PointCloudExpand/index.d.ts +59 -0
- package/shader-lib/PolygonCuter/index.d.ts +52 -0
- package/shader-lib/PolygonCuter/worker.d.ts +14 -0
- package/shader-lib/ShineModel/index.d.ts +7 -0
- package/shader-lib/SweepModel/index.d.ts +7 -0
- package/shader-lib/index.d.ts +5 -86
- package/shader-lib/index.js +13 -14
- package/shader-lib/index.mjs +424 -824
- package/sticker/geometry.d.ts +3 -0
- package/sticker/index.d.ts +68 -71
- package/sticker/index.js +3 -3
- package/sticker/index.mjs +102 -142
- package/umd/five-gltf-loader.js +9 -9
- package/umd/five-line.js +4 -4
- package/umd/five-plugins.js +17 -21
- package/umd/five-react.js +3 -3
- package/umd/five-shader-lib.js +13 -14
- package/umd/five-sticker.js +3 -3
- package/umd/five-vfx.js +21 -21
- package/umd/five-vue.js +3 -3
- package/umd/five.js +188 -336
- package/vfx/airflow/airflow.d.ts +18 -0
- package/vfx/airflow/fragment-shader.d.ts +2 -0
- package/vfx/airflow/vertex-shader.d.ts +2 -0
- package/vfx/common/scale-shader.d.ts +2 -0
- package/vfx/common/simplex-noise-shader.d.ts +2 -0
- package/vfx/frame/fragment-shader.d.ts +2 -0
- package/vfx/frame/frame.d.ts +22 -0
- package/vfx/frame/vertex-shader.d.ts +2 -0
- package/vfx/index.d.ts +7 -363
- package/vfx/index.js +21 -21
- package/vfx/index.mjs +454 -910
- package/vfx/particle/fragment-shader.d.ts +2 -0
- package/vfx/particle/instance.d.ts +36 -0
- package/vfx/particle/particle.d.ts +205 -0
- package/vfx/particle/utils.d.ts +11 -0
- package/vfx/particle/vertex-shader.d.ts +2 -0
- package/vfx/particle-gpu/fragment-shader.d.ts +2 -0
- package/vfx/particle-gpu/instance.d.ts +36 -0
- package/vfx/particle-gpu/particle.d.ts +95 -0
- package/vfx/particle-gpu/utils.d.ts +11 -0
- package/vfx/particle-gpu/vertex-shader.d.ts +2 -0
- package/vfx/spotLight/fragment-shader.d.ts +2 -0
- package/vfx/spotLight/spotLight.d.ts +15 -0
- package/vfx/spotLight/vertex-shader.d.ts +2 -0
- package/vue/context.d.ts +7 -0
- package/vue/hooks/FiveCanvas.d.ts +36 -0
- package/vue/hooks/FiveProvider.d.ts +35 -0
- package/vue/hooks/unsafe__useFiveInject.d.ts +9 -0
- package/vue/hooks/useFiveAction.d.ts +178 -0
- package/vue/hooks/useFiveCameraDirection.d.ts +8 -0
- package/vue/hooks/useFiveCameraRaycaster.d.ts +8 -0
- package/vue/hooks/useFiveCurrentObserver.d.ts +12 -0
- package/vue/hooks/useFiveCurrentState.d.ts +16 -0
- package/vue/hooks/useFiveEventCallback.d.ts +11 -0
- package/vue/hooks/useFiveFloor.d.ts +16 -0
- package/vue/hooks/useFiveHelper.d.ts +15 -0
- package/vue/hooks/useFiveModel.d.ts +7 -0
- package/vue/hooks/useFiveModelBounding.d.ts +7 -0
- package/vue/hooks/useFiveModelIntersectRaycaster.d.ts +23 -0
- package/vue/hooks/useFiveModelReadyState.d.ts +9 -0
- package/vue/hooks/useFiveProject2d.d.ts +26 -0
- package/vue/hooks/useFiveScene.d.ts +6 -0
- package/vue/hooks/useFiveState.d.ts +16 -0
- package/vue/hooks/useFiveWork.d.ts +30 -0
- package/vue/index.d.ts +23 -467
- package/vue/index.js +3 -3
- package/vue/index.mjs +309 -301
- package/vue/rendererPool.d.ts +10 -0
- package/work-downloader/components/model-3d-tile.d.ts +2 -0
- package/work-downloader/components/model.d.ts +3 -0
- package/work-downloader/components/observer.d.ts +7 -0
- package/work-downloader/download.d.ts +16 -0
- package/work-downloader/index.d.ts +2 -33
- package/work-downloader/index.js +3 -3
- package/work-downloader/index.mjs +317 -556
- package/work-downloader/type.d.ts +28 -0
- package/work-downloader/utils/download-to-file.d.ts +1 -0
- package/work-downloader/utils/image-processing.d.ts +7 -0
- package/work-downloader/utils/join-url.d.ts +2 -0
- package/work-downloader/utils/log.d.ts +1 -0
- package/work-downloader/utils/relative-url.d.ts +1 -0
- package/docs/documents/five.FivePlugin.plugin.html +0 -60
- package/docs/documents/plugin.html +0 -60
- package/docs/media/five.ts +0 -2881
- package/docs/media/pass.ts +0 -64
- package/guides/ai-doc-guidelines.md +0 -72
- package/guides/features/3dtile.md +0 -264
- package/guides/features/parameter.md +0 -178
- package/guides/plugin.md +0 -206
- /package/{guides → ai_guides}/release_notes/6.6.md +0 -0
- /package/{guides → ai_guides}/release_notes/6.7.md +0 -0
- /package/{guides → ai_guides}/support.md +0 -0
|
@@ -0,0 +1,351 @@
|
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en" data-base="../"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>features/flowing-light-3d-pass | 如视 Five SDK</title><meta name="description" content="Documentation for 如视 Five SDK"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script><script async src="../assets/hierarchy.js" id="tsd-hierarchy-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => window.app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><a href="../index.html" class="title">如视 Five SDK</a><div id="tsd-toolbar-links"></div><button id="tsd-search-trigger" class="tsd-widget" aria-label="Search"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></button><dialog id="tsd-search" aria-label="Search"><input role="combobox" id="tsd-search-input" aria-controls="tsd-search-results" aria-autocomplete="list" aria-expanded="true" autocapitalize="off" autocomplete="off" placeholder="Search the docs" maxLength="100"/><ul role="listbox" id="tsd-search-results"></ul><div id="tsd-search-status" aria-live="polite" aria-atomic="true"><div>Preparing search index...</div></div></dialog><a href="#" class="tsd-widget menu" id="tsd-toolbar-menu-trigger" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb" aria-label="Breadcrumb"><li><a href="" aria-current="page">features/flowing-light-3d-pass</a></li></ul></div><div class="tsd-panel tsd-typography"><h1 id="flowing-light-3d-pass-流光-3d-通道" class="tsd-anchor-link">Flowing Light 3D Pass (流光 3D 通道)<a href="#flowing-light-3d-pass-流光-3d-通道" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h1>
|
|
2
|
+
<ul>
|
|
3
|
+
<li><strong>Summary</strong>: <code>FlowingLight3DPass</code> 基于 3D 世界坐标绘制流光效果,使用 InstancedMesh 实例化渲染优化性能,自动投影到屏幕空间,适合沿模型表面、路径或空间轨迹演示动态流动光带。</li>
|
|
4
|
+
<li><strong>Schema</strong>: <code>FlowingLight3DPass</code> 类及 Line 数据结构。</li>
|
|
5
|
+
<li><strong>Concepts</strong>: 基于相机投影的 3D 光带、InstancedMesh 实例化渲染、世界坐标到屏幕坐标映射、头尾追逐动画。</li>
|
|
6
|
+
<li><strong>Configuration</strong>: 3D 路径点、颜色、不透明度、线宽、动画周期、延迟。</li>
|
|
7
|
+
<li><strong>Examples</strong>: 空间轨迹演示、结合相机动画、多条 3D 路径、高 DPR 场景优化。</li>
|
|
8
|
+
</ul>
|
|
9
|
+
<h2 id="schema" class="tsd-anchor-link">Schema<a href="#schema" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
10
|
+
<blockquote>
|
|
11
|
+
<p><strong>Definition</strong>: <a href="../../five/renderer/postprocessing/passes/flowing-light-3d-pass.d.ts">FlowingLight3DPass</a></p>
|
|
12
|
+
</blockquote>
|
|
13
|
+
<p><code>FlowingLight3DPass</code> 继承自 <code>FivePass</code>,支持投影到当前相机视锥。核心接口如下:</p>
|
|
14
|
+
<pre><code class="ts"><span class="hl-10">import</span><span class="hl-1"> </span><span class="hl-3">*</span><span class="hl-1"> </span><span class="hl-10">as</span><span class="hl-1"> </span><span class="hl-6">THREE</span><span class="hl-1"> </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-9">'three'</span><span class="hl-1">;</span><br/><span class="hl-10">import</span><span class="hl-1"> { </span><span class="hl-6">FivePass</span><span class="hl-1"> } </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-9">'./pass'</span><span class="hl-1">;</span><br/><span class="hl-10">import</span><span class="hl-1"> { </span><span class="hl-10">type</span><span class="hl-1"> </span><span class="hl-6">Camera</span><span class="hl-1"> } </span><span class="hl-10">from</span><span class="hl-1"> </span><span class="hl-9">'../../../core/camera'</span><span class="hl-1">;</span><br/><br/><span class="hl-3">type</span><span class="hl-1"> </span><span class="hl-7">Line</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-6">id</span><span class="hl-1">?: </span><span class="hl-7">string</span><span class="hl-1">; </span><span class="hl-8">// 可选的唯一标识符,不传则自动生成 UUID</span><br/><span class="hl-1"> </span><span class="hl-6">points</span><span class="hl-1">: </span><span class="hl-7">THREE</span><span class="hl-1">.</span><span class="hl-7">Vector3</span><span class="hl-1">[]; </span><span class="hl-8">// 世界坐标系路径点</span><br/><span class="hl-1"> </span><span class="hl-6">totalLength</span><span class="hl-1">: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 路径总长度(世界单位)</span><br/><span class="hl-1"> </span><span class="hl-6">color</span><span class="hl-1">: </span><span class="hl-7">THREE</span><span class="hl-1">.</span><span class="hl-7">Color</span><span class="hl-1">; </span><span class="hl-8">// 光带颜色</span><br/><span class="hl-1"> </span><span class="hl-6">opacity</span><span class="hl-1">?: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 光带不透明度(0-1)</span><br/><span class="hl-1"> </span><span class="hl-6">duration</span><span class="hl-1">?: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 动画周期(毫秒)</span><br/><span class="hl-1"> </span><span class="hl-6">delay</span><span class="hl-1">?: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 动画延迟(毫秒)</span><br/><span class="hl-1"> </span><span class="hl-6">lineWidth</span><span class="hl-1">?: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 线宽(像素)</span><br/><span class="hl-1"> </span><span class="hl-6">tailLengthRatio</span><span class="hl-1">?: </span><span class="hl-7">number</span><span class="hl-1">; </span><span class="hl-8">// 尾巴长度比例(0-1),默认 0.2</span><br/><span class="hl-1">};</span><br/><br/><span class="hl-10">export</span><span class="hl-1"> </span><span class="hl-3">class</span><span class="hl-1"> </span><span class="hl-7">FlowingLight3DPass</span><span class="hl-1"> </span><span class="hl-3">extends</span><span class="hl-1"> </span><span class="hl-7">FivePass</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-3">constructor</span><span class="hl-1">(</span><span class="hl-6">camera</span><span class="hl-1">: </span><span class="hl-7">Camera</span><span class="hl-1">);</span><br/><br/><span class="hl-1"> </span><span class="hl-8">// 设置要渲染的路径列表</span><br/><span class="hl-1"> </span><span class="hl-3">public</span><span class="hl-1"> </span><span class="hl-5">setLines</span><span class="hl-1">(</span><span class="hl-6">lines</span><span class="hl-1">: </span><span class="hl-7">Line</span><span class="hl-1">[]): </span><span class="hl-7">void</span><span class="hl-1">;</span><br/><br/><span class="hl-1"> </span><span class="hl-8">// 修改单条线的参数(通过 id)</span><br/><span class="hl-1"> </span><span class="hl-3">public</span><span class="hl-1"> </span><span class="hl-5">setLine</span><span class="hl-1">(</span><span class="hl-6">params</span><span class="hl-1">: { </span><span class="hl-6">id</span><span class="hl-1">: </span><span class="hl-7">string</span><span class="hl-1"> } & </span><span class="hl-7">Partial</span><span class="hl-1"><</span><span class="hl-7">Omit</span><span class="hl-1"><</span><span class="hl-7">Line</span><span class="hl-1">, </span><span class="hl-9">'id'</span><span class="hl-1">>>): </span><span class="hl-7">void</span><span class="hl-1">;</span><br/><br/><span class="hl-1"> </span><span class="hl-3">public</span><span class="hl-1"> </span><span class="hl-5">render</span><span class="hl-1">(</span><br/><span class="hl-1"> </span><span class="hl-6">renderer</span><span class="hl-1">: </span><span class="hl-7">THREE</span><span class="hl-1">.</span><span class="hl-7">WebGLRenderer</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">writeBuffer</span><span class="hl-1">: </span><span class="hl-7">THREE</span><span class="hl-1">.</span><span class="hl-7">WebGLRenderTarget</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">readBuffer</span><span class="hl-1">: </span><span class="hl-7">THREE</span><span class="hl-1">.</span><span class="hl-7">WebGLRenderTarget</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">deltaTime</span><span class="hl-1">: </span><span class="hl-7">number</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">maskActive</span><span class="hl-1">?: </span><span class="hl-7">boolean</span><span class="hl-1">,</span><br/><span class="hl-1"> ): </span><span class="hl-7">void</span><span class="hl-1">;</span><br/><br/><span class="hl-1"> </span><span class="hl-3">public</span><span class="hl-1"> </span><span class="hl-5">dispose</span><span class="hl-1">(): </span><span class="hl-7">void</span><span class="hl-1">;</span><br/><span class="hl-1">}</span>
|
|
15
|
+
</code><button type="button">Copy</button></pre>
|
|
16
|
+
|
|
17
|
+
<h2 id="concepts" class="tsd-anchor-link">Concepts<a href="#concepts" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
18
|
+
<h3 id="instancedmesh-实例化渲染-instanced-rendering" class="tsd-anchor-link">InstancedMesh 实例化渲染 (Instanced Rendering)<a href="#instancedmesh-实例化渲染-instanced-rendering" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
19
|
+
<p>为了优化高 DPR(Device Pixel Ratio)场景下的性能,该 Pass 使用 InstancedMesh 代替全屏着色器。每个线段作为一个实例,只渲染线段覆盖的区域,避免了对每个像素的全屏检查,显著提升了渲染效率。</p>
|
|
20
|
+
<h3 id="世界空间路径与投影-world-space-projection" class="tsd-anchor-link">世界空间路径与投影 (World-space Projection)<a href="#世界空间路径与投影-world-space-projection" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
21
|
+
<p>路径点定义在 3D 世界坐标系中。Pass 内部自动根据当前相机投影矩阵将 3D 点映射到屏幕空间,从而实现"随相机变化"的动态光带效果。</p>
|
|
22
|
+
<h3 id="头尾追逐动画-head-tail-chase-animation" class="tsd-anchor-link">头尾追逐动画 (Head-Tail Chase Animation)<a href="#头尾追逐动画-head-tail-chase-animation" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
23
|
+
<p>流光效果采用"头尾追逐"模式:</p>
|
|
24
|
+
<ul>
|
|
25
|
+
<li><strong>头部(Head)</strong>: 光流的前端,沿路径循环移动</li>
|
|
26
|
+
<li><strong>尾部(Tail)</strong>: 光流的后端,跟随头部移动</li>
|
|
27
|
+
<li><strong>渐变</strong>: 从尾部(透明度 0)到头部(透明度 1)线性渐变</li>
|
|
28
|
+
<li><strong>尾长</strong>: 尾部长度由 <code>tailLengthRatio</code> 参数控制(默认 0.2,即路径总长的 20%)</li>
|
|
29
|
+
</ul>
|
|
30
|
+
<p>光头在路径上循环流动,通过 <code>gl_FragCoord</code> 投影到线段上计算每个像素的渐变位置,确保渐变效果准确。尾巴长度会在动画开始时逐渐增长,直到达到 <code>tailLengthRatio * totalLength</code>。</p>
|
|
31
|
+
<h3 id="相机同步" class="tsd-anchor-link">相机同步<a href="#相机同步" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
32
|
+
<p>Pass 自动同步相机的投影矩阵和视图矩阵,无需手动管理。支持相机运动时光带跟随。</p>
|
|
33
|
+
<h3 id="dpr-处理" class="tsd-anchor-link">DPR 处理<a href="#dpr-处理" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
34
|
+
<p>自动处理高 DPR 场景,渲染目标尺寸根据 <code>readBuffer</code> 自动调整,确保在 Retina 等高分辨率屏幕上位置准确且性能优化。</p>
|
|
35
|
+
<h2 id="configuration" class="tsd-anchor-link">Configuration<a href="#configuration" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
36
|
+
<h3 id="line-配置参数" class="tsd-anchor-link">Line 配置参数<a href="#line-配置参数" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
37
|
+
<table>
|
|
38
|
+
<thead>
|
|
39
|
+
<tr>
|
|
40
|
+
<th style="text-align:left">Parameter</th>
|
|
41
|
+
<th style="text-align:left">Type</th>
|
|
42
|
+
<th style="text-align:left">Required</th>
|
|
43
|
+
<th style="text-align:left">Default</th>
|
|
44
|
+
<th style="text-align:left">Description</th>
|
|
45
|
+
</tr>
|
|
46
|
+
</thead>
|
|
47
|
+
<tbody>
|
|
48
|
+
<tr>
|
|
49
|
+
<td style="text-align:left"><code>id</code></td>
|
|
50
|
+
<td style="text-align:left"><code>string</code></td>
|
|
51
|
+
<td style="text-align:left"></td>
|
|
52
|
+
<td style="text-align:left">自动生成 UUID</td>
|
|
53
|
+
<td style="text-align:left">唯一标识符,用于 <code>setLine</code> 方法更新单条线。</td>
|
|
54
|
+
</tr>
|
|
55
|
+
<tr>
|
|
56
|
+
<td style="text-align:left"><code>points</code></td>
|
|
57
|
+
<td style="text-align:left"><code>THREE.Vector3[]</code></td>
|
|
58
|
+
<td style="text-align:left">✓</td>
|
|
59
|
+
<td style="text-align:left">-</td>
|
|
60
|
+
<td style="text-align:left">世界坐标系路径点数组。至少 2 个点。</td>
|
|
61
|
+
</tr>
|
|
62
|
+
<tr>
|
|
63
|
+
<td style="text-align:left"><code>totalLength</code></td>
|
|
64
|
+
<td style="text-align:left"><code>number</code></td>
|
|
65
|
+
<td style="text-align:left">✓</td>
|
|
66
|
+
<td style="text-align:left">-</td>
|
|
67
|
+
<td style="text-align:left">路径总长度(世界单位)。通常为所有相邻点间距离之和。</td>
|
|
68
|
+
</tr>
|
|
69
|
+
<tr>
|
|
70
|
+
<td style="text-align:left"><code>color</code></td>
|
|
71
|
+
<td style="text-align:left"><code>THREE.Color</code></td>
|
|
72
|
+
<td style="text-align:left">✓</td>
|
|
73
|
+
<td style="text-align:left">-</td>
|
|
74
|
+
<td style="text-align:left">光带颜色(RGB)。</td>
|
|
75
|
+
</tr>
|
|
76
|
+
<tr>
|
|
77
|
+
<td style="text-align:left"><code>opacity</code></td>
|
|
78
|
+
<td style="text-align:left"><code>number</code></td>
|
|
79
|
+
<td style="text-align:left"></td>
|
|
80
|
+
<td style="text-align:left"><code>1.0</code></td>
|
|
81
|
+
<td style="text-align:left">光带不透明度(0-1)。控制与背景的混合强度。</td>
|
|
82
|
+
</tr>
|
|
83
|
+
<tr>
|
|
84
|
+
<td style="text-align:left"><code>duration</code></td>
|
|
85
|
+
<td style="text-align:left"><code>number</code></td>
|
|
86
|
+
<td style="text-align:left"></td>
|
|
87
|
+
<td style="text-align:left"><code>1000</code></td>
|
|
88
|
+
<td style="text-align:left">动画周期(毫秒)。光头完成一个循环所需时长。</td>
|
|
89
|
+
</tr>
|
|
90
|
+
<tr>
|
|
91
|
+
<td style="text-align:left"><code>delay</code></td>
|
|
92
|
+
<td style="text-align:left"><code>number</code></td>
|
|
93
|
+
<td style="text-align:left"></td>
|
|
94
|
+
<td style="text-align:left"><code>0</code></td>
|
|
95
|
+
<td style="text-align:left">动画延迟(毫秒)。延迟后才开始播放动画。</td>
|
|
96
|
+
</tr>
|
|
97
|
+
<tr>
|
|
98
|
+
<td style="text-align:left"><code>lineWidth</code></td>
|
|
99
|
+
<td style="text-align:left"><code>number</code></td>
|
|
100
|
+
<td style="text-align:left"></td>
|
|
101
|
+
<td style="text-align:left"><code>3.0</code></td>
|
|
102
|
+
<td style="text-align:left">线宽(像素)。控制光带在屏幕上的宽度。</td>
|
|
103
|
+
</tr>
|
|
104
|
+
<tr>
|
|
105
|
+
<td style="text-align:left"><code>tailLengthRatio</code></td>
|
|
106
|
+
<td style="text-align:left"><code>number</code></td>
|
|
107
|
+
<td style="text-align:left"></td>
|
|
108
|
+
<td style="text-align:left"><code>0.2</code></td>
|
|
109
|
+
<td style="text-align:left">尾巴长度比例(0-1)。控制流光尾巴相对于路径总长的比例。</td>
|
|
110
|
+
</tr>
|
|
111
|
+
</tbody>
|
|
112
|
+
</table>
|
|
113
|
+
<blockquote>
|
|
114
|
+
<p><strong>注意</strong>: <code>totalLength</code> 应为世界坐标单位。若不准确,流速会偏差。</p>
|
|
115
|
+
</blockquote>
|
|
116
|
+
<h2 id="instance-methods" class="tsd-anchor-link">Instance Methods<a href="#instance-methods" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
117
|
+
<h3 id="_" class="tsd-anchor-link"><code>constructor(camera: Camera)</code><a href="#_" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
118
|
+
<p>初始化 Pass,需传入相机以获取投影矩阵和视图矩阵。</p>
|
|
119
|
+
<h3 id="_-1" class="tsd-anchor-link"><code>setLines(lines: Line[])</code><a href="#_-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
120
|
+
<p>更新要渲染的路径列表。支持运行时动态更改。</p>
|
|
121
|
+
<p><strong>自动生成 ID</strong>: 如果 line 没有提供 <code>id</code>,会自动生成 UUID。</p>
|
|
122
|
+
<p><strong>示例</strong>:</p>
|
|
123
|
+
<pre><code class="ts"><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-4">pathLine</span><span class="hl-1">: </span><span class="hl-7">Line</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-9">'my-3d-line'</span><span class="hl-1">, </span><span class="hl-8">// 可选,不传则自动生成</span><br/><span class="hl-1"> </span><span class="hl-6">points:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">5</span><span class="hl-1">, </span><span class="hl-11">2</span><span class="hl-1">, </span><span class="hl-11">3</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">10</span><span class="hl-1">, </span><span class="hl-11">1</span><span class="hl-1">, </span><span class="hl-11">6</span><span class="hl-1">),</span><br/><span class="hl-1"> ],</span><br/><span class="hl-1"> </span><span class="hl-6">totalLength:</span><span class="hl-1"> </span><span class="hl-11">12</span><span class="hl-1">, </span><span class="hl-8">// 世界坐标单位</span><br/><span class="hl-1"> </span><span class="hl-6">color:</span><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Color</span><span class="hl-1">(</span><span class="hl-11">0xff6600</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-6">opacity:</span><span class="hl-1"> </span><span class="hl-11">0.85</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">duration:</span><span class="hl-1"> </span><span class="hl-11">3000</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">delay:</span><span class="hl-1"> </span><span class="hl-11">500</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">lineWidth:</span><span class="hl-1"> </span><span class="hl-11">4.0</span><span class="hl-1">,</span><br/><span class="hl-1">};</span><br/><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLines</span><span class="hl-1">([</span><span class="hl-6">pathLine</span><span class="hl-1">]);</span>
|
|
124
|
+
</code><button type="button">Copy</button></pre>
|
|
125
|
+
|
|
126
|
+
<h3 id="_-2" class="tsd-anchor-link"><code>setLine(params: { id: string } & Partial<Omit<Line, 'id'>>)</code><a href="#_-2" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
127
|
+
<p>通过 <code>id</code> 修改单条线的参数。支持部分更新,只更新传入的字段。</p>
|
|
128
|
+
<p><strong>性能优化</strong>:</p>
|
|
129
|
+
<ul>
|
|
130
|
+
<li>如果 <code>points</code> 数量不变,只更新 GPU 的 instance attributes,性能极高</li>
|
|
131
|
+
<li>如果 <code>points</code> 数量改变,会重建整个 mesh,性能开销较大</li>
|
|
132
|
+
</ul>
|
|
133
|
+
<p><strong>示例</strong>:</p>
|
|
134
|
+
<pre><code class="ts"><span class="hl-8">// 只修改颜色 - 高性能</span><br/><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-9">'my-3d-line'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">color:</span><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Color</span><span class="hl-1">(</span><span class="hl-11">0xff0000</span><span class="hl-1">),</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-8">// 修改多个属性 - 高性能</span><br/><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-9">'my-3d-line'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">color:</span><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Color</span><span class="hl-1">(</span><span class="hl-11">0x00ff00</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-6">opacity:</span><span class="hl-1"> </span><span class="hl-11">0.5</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">duration:</span><span class="hl-1"> </span><span class="hl-11">3000</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">lineWidth:</span><span class="hl-1"> </span><span class="hl-11">5.0</span><span class="hl-1">,</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-8">// 修改 points (相同数量) - 高性能</span><br/><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-9">'my-3d-line'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">points:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">6</span><span class="hl-1">, </span><span class="hl-11">3</span><span class="hl-1">, </span><span class="hl-11">4</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">12</span><span class="hl-1">, </span><span class="hl-11">2</span><span class="hl-1">, </span><span class="hl-11">8</span><span class="hl-1">),</span><br/><span class="hl-1"> ], </span><span class="hl-8">// 仍是 3 个点</span><br/><span class="hl-1"> </span><span class="hl-6">totalLength:</span><span class="hl-1"> </span><span class="hl-11">15</span><span class="hl-1">,</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-8">// 修改 points (不同数量) - 会重建 mesh</span><br/><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-9">'my-3d-line'</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">points:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">10</span><span class="hl-1">, </span><span class="hl-11">5</span><span class="hl-1">, </span><span class="hl-11">5</span><span class="hl-1">),</span><br/><span class="hl-1"> ], </span><span class="hl-8">// 从 3 个点变为 2 个点</span><br/><span class="hl-1"> </span><span class="hl-6">totalLength:</span><span class="hl-1"> </span><span class="hl-11">12</span><span class="hl-1">,</span><br/><span class="hl-1">});</span>
|
|
135
|
+
</code><button type="button">Copy</button></pre>
|
|
136
|
+
|
|
137
|
+
<p><strong>注意事项</strong>:</p>
|
|
138
|
+
<ul>
|
|
139
|
+
<li>如果 <code>id</code> 不存在,会在控制台输出警告</li>
|
|
140
|
+
<li>动画时间(<code>uTime</code>)不会被重置,流光继续从当前位置播放</li>
|
|
141
|
+
<li>建议修改 <code>points</code> 时同时更新 <code>totalLength</code></li>
|
|
142
|
+
</ul>
|
|
143
|
+
<h3 id="_-3" class="tsd-anchor-link"><code>render(...)</code><a href="#_-3" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
144
|
+
<p>由 EffectComposer 自动调用,无需手动调用。自动同步相机矩阵和渲染目标尺寸。</p>
|
|
145
|
+
<h3 id="_-4" class="tsd-anchor-link"><code>dispose()</code><a href="#_-4" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
146
|
+
<p>释放 InstancedMesh、着色材质和渲染目标资源,销毁 Pass 时必须调用。</p>
|
|
147
|
+
<h2 id="examples" class="tsd-anchor-link">Examples<a href="#examples" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
148
|
+
<h3 id="快速上手-quick-example" class="tsd-anchor-link">快速上手 (Quick Example)<a href="#快速上手-quick-example" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
149
|
+
<p>import { Five } from '@realsee/five';
|
|
150
|
+
import { FlowingLight3DPass } from '../../lib/five/renderer/postprocessing';
|
|
151
|
+
import * as THREE from 'three';</p>
|
|
152
|
+
<p>const five = new Five();</p>
|
|
153
|
+
<p>// 创建 3D 流光通道
|
|
154
|
+
const flowing3D = new FlowingLight3DPass(five.camera);</p>
|
|
155
|
+
<p>// 定义一条 3D 路径(世界坐标)
|
|
156
|
+
const path = [
|
|
157
|
+
new THREE.Vector3(-5, 0, 0),
|
|
158
|
+
new THREE.Vector3(-2, 3, 2),
|
|
159
|
+
new THREE.Vector3(2, 3, -2),
|
|
160
|
+
new THREE.Vector3(5, 0, 0),
|
|
161
|
+
];
|
|
162
|
+
const totalLen = 15; // 世界单位</p>
|
|
163
|
+
<p>flowing3D.setLines([{
|
|
164
|
+
points: path,
|
|
165
|
+
totalLength: totalLen,
|
|
166
|
+
color: new THREE.Color(0x00ff88),
|
|
167
|
+
opacity: 0.8,
|
|
168
|
+
duration: 4000,
|
|
169
|
+
lineWidth: 3.0,
|
|
170
|
+
}]);</p>
|
|
171
|
+
<p>five.addPass(flowing3D);</p>
|
|
172
|
+
<p>function animate() {
|
|
173
|
+
requestAnimationFrame(animate);
|
|
174
|
+
five.render();
|
|
175
|
+
}
|
|
176
|
+
animate();</p>
|
|
177
|
+
<h3 id="多条-3d-路径" class="tsd-anchor-link">多条 3D 路径<a href="#多条-3d-路径" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
178
|
+
<p>const pass = new FlowingLight3DPass(camera);</p>
|
|
179
|
+
<p>const paths = [
|
|
180
|
+
{
|
|
181
|
+
points: [
|
|
182
|
+
new THREE.Vector3(0, 0, 0),
|
|
183
|
+
new THREE.Vector3(10, 5, 0),
|
|
184
|
+
],
|
|
185
|
+
totalLength: 11,
|
|
186
|
+
color: new THREE.Color(0xff0000),
|
|
187
|
+
duration: 2000,
|
|
188
|
+
lineWidth: 3.0,
|
|
189
|
+
},
|
|
190
|
+
{
|
|
191
|
+
points: [
|
|
192
|
+
new THREE.Vector3(0, 0, 0),
|
|
193
|
+
new THREE.Vector3(0, 10, 5),
|
|
194
|
+
],
|
|
195
|
+
totalLength: 12,
|
|
196
|
+
color: new THREE.Color(0x00ff00),
|
|
197
|
+
duration: 2500,
|
|
198
|
+
delay: 500,
|
|
199
|
+
lineWidth: 4.0,
|
|
200
|
+
},
|
|
201
|
+
{
|
|
202
|
+
points: [
|
|
203
|
+
new THREE.Vector3(0, 0, 0),
|
|
204
|
+
new THREE.Vector3(5, 0, 10),
|
|
205
|
+
],
|
|
206
|
+
totalLength: 11,
|
|
207
|
+
color: new THREE.Color(0x0000ff),
|
|
208
|
+
duration: 2200,
|
|
209
|
+
delay: 1000,
|
|
210
|
+
lineWidth: 2.5,
|
|
211
|
+
},
|
|
212
|
+
];</p>
|
|
213
|
+
<p>pass.setLines(paths);</p>
|
|
214
|
+
<h3 id="计算-3d-路径长度" class="tsd-anchor-link">计算 3D 路径长度<a href="#计算-3d-路径长度" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
215
|
+
<p>function calculatePath3DLength(points: THREE.Vector3[]): number {
|
|
216
|
+
let length = 0;
|
|
217
|
+
for (let i = 1; i < points.length; i++) {
|
|
218
|
+
length += points[i].distanceTo(points[i - 1]);
|
|
219
|
+
}
|
|
220
|
+
return length;
|
|
221
|
+
}</p>
|
|
222
|
+
<p>const points = [
|
|
223
|
+
new THREE.Vector3(0, 0, 0),
|
|
224
|
+
new THREE.Vector3(5, 2, 3),
|
|
225
|
+
new THREE.Vector3(10, 1, 6),
|
|
226
|
+
];</p>
|
|
227
|
+
<p>const pathLine = {
|
|
228
|
+
points: points,
|
|
229
|
+
totalLength: calculatePath3DLength(points),
|
|
230
|
+
color: new THREE.Color(0x00ccff),
|
|
231
|
+
duration: 3000,
|
|
232
|
+
lineWidth: 3.0,
|
|
233
|
+
};</p>
|
|
234
|
+
<h3 id="结合相机动画" class="tsd-anchor-link">结合相机动画<a href="#结合相机动画" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
235
|
+
<p>// 光带路径随相机移动自动投影
|
|
236
|
+
const pass = new FlowingLight3DPass(camera);</p>
|
|
237
|
+
<p>pass.setLines([{
|
|
238
|
+
points: [
|
|
239
|
+
new THREE.Vector3(-10, 0, 0),
|
|
240
|
+
new THREE.Vector3(0, 5, 0),
|
|
241
|
+
new THREE.Vector3(10, 0, 0),
|
|
242
|
+
],
|
|
243
|
+
totalLength: 20,
|
|
244
|
+
color: new THREE.Color(0xffff00),
|
|
245
|
+
duration: 3000,
|
|
246
|
+
lineWidth: 4.0,
|
|
247
|
+
}]);</p>
|
|
248
|
+
<p>// 相机动画过程中光带自动跟随投影
|
|
249
|
+
five.setState({
|
|
250
|
+
mode: Five.Mode.Model,
|
|
251
|
+
// ... 其他参数
|
|
252
|
+
});</p>
|
|
253
|
+
<h3 id="高-dpr-场景优化" class="tsd-anchor-link">高 DPR 场景优化<a href="#高-dpr-场景优化" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
254
|
+
<p>// InstancedMesh 实现自动优化高 DPR 性能
|
|
255
|
+
// 在 DPR=2 的 Retina 屏幕上,性能显著优于全屏着色器方案</p>
|
|
256
|
+
<p>const pass = new FlowingLight3DPass(camera);</p>
|
|
257
|
+
<p>// 多条路径在高 DPR 下仍能保持流畅
|
|
258
|
+
const paths = Array.from({ length: 10 }, (_, i) => ({
|
|
259
|
+
points: [
|
|
260
|
+
new THREE.Vector3(i * 2, 0, 0),
|
|
261
|
+
new THREE.Vector3(i * 2, 5, 5),
|
|
262
|
+
],
|
|
263
|
+
totalLength: 7,
|
|
264
|
+
color: new THREE.Color(Math.random() * 0xffffff),
|
|
265
|
+
duration: 2000 + i * 100,
|
|
266
|
+
delay: i * 200,
|
|
267
|
+
lineWidth: 3.0,
|
|
268
|
+
}));</p>
|
|
269
|
+
<p>pass.setLines(paths);</p>
|
|
270
|
+
<h2 id="debugging" class="tsd-anchor-link">Debugging<a href="#debugging" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
271
|
+
<ul>
|
|
272
|
+
<li><strong>光带不可见</strong>: 检查路径点是否在相机视锥内;验证 <code>color</code> 和 <code>opacity</code> 非全透明。</li>
|
|
273
|
+
<li><strong>光带抖动或消失</strong>: 确认路径在相机背面时自动丢弃(3D 投影的预期行为)。</li>
|
|
274
|
+
<li><strong>流速不对</strong>: 检查 <code>totalLength</code> 计算是否为世界单位;调整 <code>duration</code> 以改变流速。</li>
|
|
275
|
+
<li><strong>位置偏移</strong>: 确认在高 DPR 场景下渲染目标尺寸正确,Pass 会自动同步 <code>readBuffer</code> 尺寸。</li>
|
|
276
|
+
<li><strong>性能问题</strong>: InstancedMesh 实现已优化,但过多路径点仍会影响性能。建议单条路径不超过 20 个点。</li>
|
|
277
|
+
</ul>
|
|
278
|
+
<h2 id="performance" class="tsd-anchor-link">Performance<a href="#performance" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
279
|
+
<h3 id="与全屏着色器对比" class="tsd-anchor-link">与全屏着色器对比<a href="#与全屏着色器对比" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
280
|
+
<ul>
|
|
281
|
+
<li><strong>全屏着色器</strong>: 每帧检查所有像素,DPR=2 时像素数增加 4 倍,性能下降明显</li>
|
|
282
|
+
<li><strong>InstancedMesh</strong>: 仅渲染线段覆盖区域,DPR=2 时性能影响较小</li>
|
|
283
|
+
<li><strong>实测</strong>: 在 DPR=2 场景下,InstancedMesh 方案 FPS 提升约 3-5 倍</li>
|
|
284
|
+
</ul>
|
|
285
|
+
<h3 id="setline-性能优化" class="tsd-anchor-link">setLine 性能优化<a href="#setline-性能优化" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
286
|
+
<p><code>setLine</code> 方法根据修改类型自动选择最优更新策略:</p>
|
|
287
|
+
<table>
|
|
288
|
+
<thead>
|
|
289
|
+
<tr>
|
|
290
|
+
<th>修改类型</th>
|
|
291
|
+
<th>性能</th>
|
|
292
|
+
<th>说明</th>
|
|
293
|
+
</tr>
|
|
294
|
+
</thead>
|
|
295
|
+
<tbody>
|
|
296
|
+
<tr>
|
|
297
|
+
<td>只修改颜色/透明度</td>
|
|
298
|
+
<td>⚡️ 极快 (~100x)</td>
|
|
299
|
+
<td>只更新 instanceColor attribute</td>
|
|
300
|
+
</tr>
|
|
301
|
+
<tr>
|
|
302
|
+
<td>只修改 duration/delay</td>
|
|
303
|
+
<td>⚡️ 极快 (~100x)</td>
|
|
304
|
+
<td>只更新 instanceMeta attribute</td>
|
|
305
|
+
</tr>
|
|
306
|
+
<tr>
|
|
307
|
+
<td>只修改 lineWidth</td>
|
|
308
|
+
<td>⚡️ 极快 (~100x)</td>
|
|
309
|
+
<td>只更新 instanceData attribute</td>
|
|
310
|
+
</tr>
|
|
311
|
+
<tr>
|
|
312
|
+
<td>修改 points (相同数量)</td>
|
|
313
|
+
<td>⚡️ 快 (~50x)</td>
|
|
314
|
+
<td>只更新 instanceStart/End attributes</td>
|
|
315
|
+
</tr>
|
|
316
|
+
<tr>
|
|
317
|
+
<td>修改 points (不同数量)</td>
|
|
318
|
+
<td>⚠️ 慢</td>
|
|
319
|
+
<td>重建整个 mesh</td>
|
|
320
|
+
</tr>
|
|
321
|
+
</tbody>
|
|
322
|
+
</table>
|
|
323
|
+
<p><strong>最佳实践</strong>:</p>
|
|
324
|
+
<pre><code class="ts"><span class="hl-8">// ✅ 高性能 - 频繁修改颜色</span><br/><span class="hl-5">requestAnimationFrame</span><span class="hl-1">(() </span><span class="hl-3">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-6">lineId</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">color:</span><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Color</span><span class="hl-1">(</span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">random</span><span class="hl-1">(), </span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">random</span><span class="hl-1">(), </span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">random</span><span class="hl-1">())</span><br/><span class="hl-1"> });</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-8">// ✅ 高性能 - 动画路径(保持点数)</span><br/><span class="hl-3">function</span><span class="hl-1"> </span><span class="hl-5">animatePath</span><span class="hl-1">(</span><span class="hl-6">t</span><span class="hl-1">: </span><span class="hl-7">number</span><span class="hl-1">) {</span><br/><span class="hl-1"> </span><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-6">lineId</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">points:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">5</span><span class="hl-1"> + </span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">sin</span><span class="hl-1">(</span><span class="hl-6">t</span><span class="hl-1">) * </span><span class="hl-11">2</span><span class="hl-1">, </span><span class="hl-11">2</span><span class="hl-1">, </span><span class="hl-11">3</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-3">new</span><span class="hl-1"> </span><span class="hl-4">THREE</span><span class="hl-1">.</span><span class="hl-5">Vector3</span><span class="hl-1">(</span><span class="hl-11">10</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">, </span><span class="hl-11">0</span><span class="hl-1">),</span><br/><span class="hl-1"> ] </span><span class="hl-8">// 始终 3 个点</span><br/><span class="hl-1"> });</span><br/><span class="hl-1">}</span><br/><br/><span class="hl-8">// ⚠️ 低性能 - 避免频繁改变点数</span><br/><span class="hl-5">setInterval</span><span class="hl-1">(() </span><span class="hl-3">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-4">pointCount</span><span class="hl-1"> = </span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">floor</span><span class="hl-1">(</span><span class="hl-6">Math</span><span class="hl-1">.</span><span class="hl-5">random</span><span class="hl-1">() * </span><span class="hl-11">5</span><span class="hl-1">) + </span><span class="hl-11">2</span><span class="hl-1">;</span><br/><span class="hl-1"> </span><span class="hl-6">pass</span><span class="hl-1">.</span><span class="hl-5">setLine</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">id:</span><span class="hl-1"> </span><span class="hl-6">lineId</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">points:</span><span class="hl-1"> </span><span class="hl-5">generateRandomPoints</span><span class="hl-1">(</span><span class="hl-6">pointCount</span><span class="hl-1">) </span><span class="hl-8">// 点数不固定</span><br/><span class="hl-1"> });</span><br/><span class="hl-1">}, </span><span class="hl-11">100</span><span class="hl-1">);</span>
|
|
325
|
+
</code><button type="button">Copy</button></pre>
|
|
326
|
+
|
|
327
|
+
<h3 id="优化建议" class="tsd-anchor-link">优化建议<a href="#优化建议" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
328
|
+
<ol>
|
|
329
|
+
<li>减少路径点数量,使用更简化的路径</li>
|
|
330
|
+
<li>降低 <code>lineWidth</code>,减少渲染区域</li>
|
|
331
|
+
<li>控制同时渲染的路径数量</li>
|
|
332
|
+
<li>使用 <code>setLine</code> 而非 <code>setLines</code> 来更新单条线</li>
|
|
333
|
+
<li>保持 points 数量不变,只修改坐标</li>
|
|
334
|
+
<li>在低端设备上可通过 <code>pass.enabled = false</code> 禁用</li>
|
|
335
|
+
</ol>
|
|
336
|
+
<h2 id="common-pitfalls" class="tsd-anchor-link">Common Pitfalls<a href="#common-pitfalls" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
337
|
+
<ol>
|
|
338
|
+
<li><strong>totalLength 单位混淆</strong>: 必须使用世界坐标单位,不能混用屏幕像素或其他单位。</li>
|
|
339
|
+
<li><strong>投影失败</strong>: 确保相机矩阵有效,相机在构造时已初始化。</li>
|
|
340
|
+
<li><strong>路径在背面</strong>: 相机背后的点自动投影到屏幕外,无需手动处理。</li>
|
|
341
|
+
<li><strong>未调用 dispose()</strong>: 销毁 Pass 时必须调用 <code>dispose()</code>,避免 GPU 资源泄漏。</li>
|
|
342
|
+
<li><strong>DPR 不匹配</strong>: 确保渲染目标尺寸与实际屏幕 DPR 匹配,Pass 会自动处理。</li>
|
|
343
|
+
</ol>
|
|
344
|
+
<h2 id="related" class="tsd-anchor-link">Related<a href="#related" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
345
|
+
<ul>
|
|
346
|
+
<li><a href="features_postprocessing.html">Postprocessing</a>: 后处理通用概念与 EffectComposer 使用指南。</li>
|
|
347
|
+
<li><a href="features_flowing-light-2d-pass.html">Flowing Light 2D Pass</a>: 屏幕空间的流光效果。</li>
|
|
348
|
+
</ul>
|
|
349
|
+
<hr>
|
|
350
|
+
<p>tags: [postprocessing, effect, flowing, light, pass, rendering, worldspace, projection, instanced, performance]</p>
|
|
351
|
+
</div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg><h3>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg><h3>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#flowing-light-3d-pass-流光-3d-通道"><span>Flowing <wbr/>Light 3<wbr/>D <wbr/>Pass (流光 3<wbr/>D 通道)</span></a><ul><li><a href="#schema"><span>Schema</span></a></li><li><a href="#concepts"><span>Concepts</span></a></li><li><ul><li><a href="#instancedmesh-实例化渲染-instanced-rendering"><span>Instanced<wbr/>Mesh 实例化渲染 (<wbr/>Instanced <wbr/>Rendering)</span></a></li><li><a href="#世界空间路径与投影-world-space-projection"><span>世界空间路径与投影 (<wbr/>World-<wbr/>space <wbr/>Projection)</span></a></li><li><a href="#头尾追逐动画-head-tail-chase-animation"><span>头尾追逐动画 (<wbr/>Head-<wbr/>Tail <wbr/>Chase <wbr/>Animation)</span></a></li><li><a href="#相机同步"><span>相机同步</span></a></li><li><a href="#dpr-处理"><span>DPR 处理</span></a></li></ul></li><li><a href="#configuration"><span>Configuration</span></a></li><li><ul><li><a href="#line-配置参数"><span>Line 配置参数</span></a></li></ul></li><li><a href="#instance-methods"><span>Instance <wbr/>Methods</span></a></li><li><ul><li><a href="#_"><span></span></a></li><li><a href="#_-1"><span></span></a></li><li><a href="#_-2"><span></span></a></li><li><a href="#_-3"><span></span></a></li><li><a href="#_-4"><span></span></a></li></ul></li><li><a href="#examples"><span>Examples</span></a></li><li><ul><li><a href="#快速上手-quick-example"><span>快速上手 (<wbr/>Quick <wbr/>Example)</span></a></li><li><a href="#多条-3d-路径"><span>多条 3<wbr/>D 路径</span></a></li><li><a href="#计算-3d-路径长度"><span>计算 3<wbr/>D 路径长度</span></a></li><li><a href="#结合相机动画"><span>结合相机动画</span></a></li><li><a href="#高-dpr-场景优化"><span>高 <wbr/>DPR 场景优化</span></a></li></ul></li><li><a href="#debugging"><span>Debugging</span></a></li><li><a href="#performance"><span>Performance</span></a></li><li><ul><li><a href="#与全屏着色器对比"><span>与全屏着色器对比</span></a></li><li><a href="#setline-性能优化"><span>set<wbr/>Line 性能优化</span></a></li><li><a href="#优化建议"><span>优化建议</span></a></li></ul></li><li><a href="#common-pitfalls"><span>Common <wbr/>Pitfalls</span></a></li><li><a href="#related"><span>Related</span></a></li></ul></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">如视 Five SDK</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|