### Basic EngineRendering Configuration Examples Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineRendering Provides examples of how to enable bloom effects, control the animation loop, and set the animation loop frame time for the EngineRendering class. ```javascript engine.rendering.features.bloom.enabled = true; engine.rendering.enableAnimationLoop = true; engine.rendering.animationLoopFrameTime = 16; ``` -------------------------------- ### ObjectTracker: Track Method Configuration Example (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.ObjectTracker Illustrates advanced configuration options for the `track` method of the ObjectTracker. This example shows how to specify not only the target object but also detailed tracking parameters like range, pitch, heading, and duration for precise control over object tracking. ```javascript // 追踪 3D 模型,设置相机距离和角度 tracker.track(model, { range: 100, // 距离100米 pitch: 60, // 俯仰角60 heading: 45, // 方位角45 }); ``` -------------------------------- ### RotateTracker: Start Method Parameters Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.RotateTracker Details the various options available when starting the RotateTracker's animation. This includes parameters for targeting objects or coordinates, controlling animation duration, angles, camera pitch and heading, and loop modes. ```javascript // Example demonstrating various parameters for the start method: tracker.start({ object: model, // or center: [lng, lat, alt], or projectedCenter: [x, y, z] radius: 100, duration: 10000, startAngle: 0, endAngle: 360, pitch: 60, heading: 45, loopMode: 'repeat', // 'repeat', 'reverse', 'alternate' easing: 'ease-in-out', keepRunning: true, repeatCount: 5 }); ``` -------------------------------- ### BaiduTrafficTileProvider Methods Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduTrafficTileProvider Details the methods available for interacting with the BaiduTrafficTileProvider, including requesting tile data and getting tile URLs. ```APIDOC ## Methods ### doRequestImageTileData - **Description**: Requests image tile data for the given tile coordinates. - **Method**: `doRequestImageTileData(tile: any, surfaceTile: any): Promise` - **Parameters**: - **tile** (any) - The tile object. - **surfaceTile** (any) - The surface tile object. - **Returns**: `Promise` - An array containing the object to render in a 3D scene and the object to render on the ground. ### `Abstract` doRequestTileData - **Description**: Abstract method to request tile data. Subclasses should override `doRequestImageTileData`. - **Method**: `doRequestTileData(tile: object, surfaceTile: object): Promise` - **Parameters**: - **tile** (object) - The tile object. - **surfaceTile** (object) - The surface tile object. - **Returns**: `Promise` - The tile texture. ### getTileURL - **Description**: Generates the URL for a specific tile based on its zoom level and coordinates. - **Method**: `getTileURL(z: number, x: number, y: number, tile: object): string` - **Parameters**: - **z** (number) - The zoom level. - **x** (number) - The X coordinate of the tile. - **y** (number) - The Y coordinate of the tile. - **tile** (object) - The tile object. - **Returns**: `string` - The URL of the tile. ``` -------------------------------- ### Instantiate PlaneTerrainTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.PlaneTerrainTileProvider Demonstrates how to create an instance of the PlaneTerrainTileProvider class. This involves initializing the provider with optional configuration settings that control aspects like caching, level of detail, and projection targets. ```javascript const provider = new PlaneTerrainTileProvider({ // Configuration options }); ``` -------------------------------- ### Get and Set EngineClock Start and Stop Times (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineClock Demonstrates the retrieval and setting of the start and stop times for the EngineClock. These times define the boundaries for time progression, especially in LOOP or CLAMP modes. ```javascript const clock = engine.clock; // Get start time const startTime = clock.startTime; console.log('Start time:', startTime); // Set start time clock.startTime = new Date('2024-01-01 08:00:00'); // Get stop time const stopTime = clock.stopTime; console.log('Stop time:', stopTime); // Set stop time clock.stopTime = new Date('2024-01-01 18:00:00'); ``` -------------------------------- ### PathTracker: Object Tracking along a Path Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.PathTracker Illustrates how to use PathTracker to move a 3D model along a defined path. This example shows assigning a SimpleModel to the tracker and starting the animation with specific duration and range settings. ```javascript const model = engine.add(new mapvthree.SimpleModel({ url: 'path/to/model.glb' })); const tracker = engine.add(new mapvthree.PathTracker()); tracker.track = pathCoordinates; // Assuming pathCoordinates is defined elsewhere tracker.object = model; // Set the object to track tracker.start({ duration: 8000, range: 50 }); ``` -------------------------------- ### Instantiate TiandituImageryTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.TiandituImageryTileProvider Demonstrates how to create an instance of the TiandituImageryTileProvider. This requires a Tianditu token for authentication and data access. The token can be passed directly during instantiation or configured globally. ```javascript // 创建天地图影像瓦片提供者 const provider = new TiandituImageryTileProvider({ // 配置选项 tk: 'your_tianditu_token', }); ``` -------------------------------- ### EngineMap Methods for Getting Map State (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineMap Provides examples of methods used to retrieve the current state of the map, including its boundaries (`getBounds`), camera position (`getCameraLocation`), center point (`getCenter`), heading (`getHeading`), pitch (`getPitch`), projection center (`getProjectionCenter`), range (`getRange`), resolution (`getResolution`), and view height (`getViewHeight`). ```javascript const bounds = engine.map.getBounds(); const center = engine.map.getCenter(); const heading = engine.map.getHeading(); ``` -------------------------------- ### Baidu09ImageryTileProvider Class Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.Baidu09ImageryTileProvider Documentation for the Baidu09ImageryTileProvider class, including its constructor, properties, methods, and accessors. ```APIDOC ## Class Baidu09ImageryTileProvider 百度09影像瓦片提供者,用于加载和渲染百度地图的影像瓦片数据。 支持Web墨卡托和地理坐标两种投影方式,提供卫星影像和普通影像两种类型。 主要功能: * 支持百度地图影像瓦片加载 * 支持Web墨卡托和地理坐标投影 * 支持卫星影像和普通影像切换 * 自动处理百度地图坐标转换 #### 示例 ```javascript // 创建百度09影像瓦片提供者(普通影像) const provider = new mapvthree.Baidu09ImageryTileProvider({ ak: 'your_baidu_ak', type: 'normal' }); // 创建百度09影像瓦片提供者(卫星影像) const satelliteProvider = new mapvthree.Baidu09ImageryTileProvider({ ak: 'your_baidu_ak', type: 'satellite' }); ``` ## Constructor ### constructor * new Baidu09ImageryTileProvider( options?: { ak?: string; type?: string }, ): Baidu09ImageryTileProvider #### Parameters * options: { ak?: string; type?: string } = {} 配置选项 * ##### `可选`ak?: string 百度地图API密钥,如果不提供则使用全局配置 * ##### `可选`type?: string 影像类型,支持 'satellite'(卫星影像)和 'normal'(普通影像),默认为 'normal' #### Returns Baidu09ImageryTileProvider ## Properties ### `只读`isBaiduProvider * isBaiduProvider: true 是否为百度地图提供者 ### `只读`isBaseImageryTileProvider * isBaseImageryTileProvider: true 是否为基础影像瓦片提供者 ### `只读`isImageryTileProvider * isImageryTileProvider: true 是否为影像瓦片提供者 ### `只读`name * name: "Baidu09ImageryTileProvider" = 'Baidu09ImageryTileProvider' 瓦片提供者名称 ### visible * visible: boolean = true 是否可见 ## Methods ### doRequestImageTileData * doRequestImageTileData(tile: object, surfaceTile: object): Promise 请求瓦片数据 加载影像瓦片纹理,并根据需要进行投影变换 #### Parameters * tile: object 瓦片对象 * surfaceTile: object 表面瓦片对象 #### Returns Promise 瓦片纹理 ### `抽象`doRequestTileData * doRequestTileData(tile: object, surfaceTile: object): Promise 请求瓦片数据 子类需要重写doRequestImageTileData方法 #### Parameters * tile: object 瓦片对象 * surfaceTile: object 表面瓦片对象 #### Returns Promise 瓦片纹理 ### errorFallback * errorFallback(): DataTexture 错误回退处理 当瓦片加载失败时返回透明纹理 #### Returns DataTexture 透明纹理 ### getTileURL * getTileURL(z: number, x: number, y: number, tile: object): string | boolean 获取瓦片URL #### Parameters * z: number 缩放级别 * x: number 瓦片X坐标 * y: number 瓦片Y坐标 * tile: object 瓦片对象 #### Returns string | boolean 瓦片URL或false(如果缩放级别小于3) ### onTileDispose * onTileDispose(tile: object): void 瓦片销毁时的回调 释放瓦片纹理资源 #### Parameters * tile: object 瓦片对象 #### Returns void ### shouldReproject * shouldReproject( sourceProjection: object, targetProjection: object, tile: object, terrainTile: object, ): boolean 判断是否需要进行投影变换 取中心点的像素坐标,计算变换后的像素坐标,判断是否有明显的偏移 #### Parameters * sourceProjection: object 源投影 * targetProjection: object 目标投影 * tile: object 瓦片对象 * terrainTile: object 地形瓦片对象 #### Returns boolean 是否需要重投影 ## Accessors ### addDebugLabel * get addDebugLabel(): boolean 获取是否绘制调试标签 #### Returns boolean * set addDebugLabel(addDebugLabel: boolean): void 设置是否绘制调试标签 #### Parameters * addDebugLabel: boolean 是否绘制调试标签 #### Returns void ### colorTint * get colorTint(): number[] 获取色彩调整值 #### Returns number[] * set colorTint(colorTint: number[]): void 设置色彩调整值 #### Parameters * colorTint: number[] 色彩调整值,RGB分量 #### Returns void ### maxLevel * get maxLevel(): number 获取最大等级 #### Returns number ### minLevel * get minLevel(): number 获取最小等级 #### Returns number ### opacity * get opacity(): number 获取不透明度 #### Returns number * set opacity(opacity: number): void 设置不透明度 #### Parameters * opacity: number 不透明度,取值范围0-1 #### Returns void ### randomColorTint * get randomColorTint(): boolean 获取是否使用随机色彩调整 #### Returns boolean * set randomColorTint(randomColorTint: boolean): void 设置是否使用随机色彩调整 #### Parameters * randomColorTint: boolean 是否使用随机色彩调整 #### Returns void ### sourceProjection * get sourceProjection(): any 获取源投影 #### Returns any ### targetProjection * get targetProjection(): any 获取目标投影 #### Returns any * set targetProjection(value: any): void 设置目标投影 #### Parameters * value: any #### Returns void ``` -------------------------------- ### Geocoder: Perform Address to Coordinate Lookup (Get Point) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.services.Geocoder Provides an example of using the `getPoint` method of the Geocoder class to convert a given address string into geographic coordinates. It accepts an optional `city` parameter to refine the search scope. The result includes the coordinate point and the resolved address, returned via a callback function or a Promise. ```javascript geocoder.getPoint('北京市朝阳区', (result) => { console.log('坐标:', result.point); console.log('地址:', result.address); }, '北京市'); ``` -------------------------------- ### Initialize WMSImageryTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.WMSImageryTileProvider Demonstrates how to create and configure an instance of WMSImageryTileProvider. This involves specifying the WMS service URL and essential parameters like layers, SRS (Spatial Reference System), and WMS version. ```javascript const provider = new WMSImageryTileProvider({ url: 'https://example.com/geoserver/wms', params: { LAYERS: 'layer1,layer2', SRS: 'EPSG:3857', VERSION: '1.1.0', }, }); ``` -------------------------------- ### Initialize WMTSImageryTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.WMTSImageryTileProvider Demonstrates how to create instances of WMTSImageryTileProvider with different configurations, including default TILEMATRIX templates, custom matrix IDs, and RESTful request encoding. ```javascript const provider1 = new WMTSImageryTileProvider({ url: 'https://example.com/geoserver/gwc/service/wmts', params: { LAYER: 'layer1', TILEMATRIXSET: 'EPSG:900913', TILEMATRIX: 'EPSG:900913:{z}', VERSION: '1.0.0', }, }); const provider2 = new WMTSImageryTileProvider({ url: 'https://example.com/geoserver/gwc/service/wmts', params: { LAYER: 'layer1', TILEMATRIXSET: 'EPSG:3857', VERSION: '1.0.0', }, matrixIds: ['EPSG:3857:0', 'EPSG:3857:1', 'EPSG:3857:2'], }); const provider3 = new WMTSImageryTileProvider({ url: 'https://example.com/wmts/{layer}/{style}/{tilematrixset}/{tilematrix}/{tilerow}/{tilecol}.png', params: { LAYER: 'layer1', STYLE: 'default', TILEMATRIXSET: 'EPSG:3857', }, requestEncoding: 'REST', }); ``` -------------------------------- ### Get and Set EngineClock Current Time (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineClock Illustrates how to get and set the current time of the EngineClock using the `currentTime` accessor. It also shows how to get and set the current time in UTC using `currentTimeUTC`. ```javascript const clock = engine.clock; // Get current time const now = clock.currentTime; console.log('Current local time:', now); // Set current time clock.currentTime = new Date('2024-01-02 12:00:00'); // Get current UTC time const nowUTC = clock.currentTimeUTC; console.log('Current UTC time:', nowUTC); // Set current UTC time clock.currentTimeUTC = new Date(Date.UTC(2024, 0, 2, 12, 0, 0)); ``` -------------------------------- ### Initialize and Search with TransitRoute (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.services.TransitRoute Demonstrates how to create an instance of the TransitRoute class for bus route planning using the Baidu map data source. It shows the process of searching for the optimal bus route between two specified points and includes options for rendering and viewport adjustment. ```javascript const transitRoute = new TransitRoute({ apiSource: mapvthree.services.API_SOURCE_BAIDU, // 使用百度地图数据源 renderOptions: { engine: engine, // 渲染引擎 autoViewport: true // 自动调整视野 } }); // 搜索公交路线 const result = await transitRoute.search( new THREE.Vector3(116.404, 39.915, 0), // 起点坐标 new THREE.Vector3(116.414, 39.925, 0) // 终点坐标 ); ``` ```javascript const transitRoute = new TransitRoute({ apiSource: mapvthree.services.API_SOURCE_BAIDU, renderOptions: { engine: engine, autoViewport: true } }); ``` ```javascript const result = await route.search( new THREE.Vector3(116.404, 39.915, 0), // 起点 new THREE.Vector3(116.414, 39.925, 0), // 终点 { waypoints: [new THREE.Vector3(116.409, 39.920, 0)] // 途经点 } ); console.log('路线距离:', result.distance); console.log('预计时间:', result.duration); ``` -------------------------------- ### Instantiate Baidu09ImageryTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.Baidu09ImageryTileProvider Demonstrates how to create instances of the Baidu09ImageryTileProvider class for both normal and satellite imagery types. Requires a Baidu Maps API key (ak) and specifies the desired imagery type. ```javascript const provider = new mapvthree.Baidu09ImageryTileProvider({ ak: 'your_baidu_ak', type: 'normal' }); const satelliteProvider = new mapvthree.Baidu09ImageryTileProvider({ ak: 'your_baidu_ak', type: 'satellite' }); ``` -------------------------------- ### Get and Set EngineClock Tick Mode (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineClock Illustrates how to get and set the tick mode of the EngineClock. This controls the behavior of time progression, such as looping, clamping, or ignoring boundaries. ```javascript const clock = engine.clock; // Get tick mode const mode = clock.tickMode; console.log('Current tick mode:', mode); // Set tick mode to loop clock.tickMode = 2; // TICK_LOOP // Set tick mode to clamp clock.tickMode = 3; // TICK_CLAMP ``` -------------------------------- ### Get Administrative Boundary Coordinates Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.services.Boundary Shows how to use the `get` method of the Boundary service to retrieve the boundary coordinates for a specified administrative region, such as a province or municipality. A callback function processes the returned boundary data. ```javascript boundary.get('山东省', (result) => { console.log('边界坐标:', result.boundaries); }); ``` -------------------------------- ### Instantiate CesiumTerrainTileProvider with Default or Custom Server Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.CesiumTerrainTileProvider Demonstrates how to create an instance of CesiumTerrainTileProvider. It shows usage with the default Cesium ion server by providing an accessToken, and also how to use a custom terrain server by specifying a URL. ```javascript const provider = new CesiumTerrainTileProvider({ accessToken: 'your_access_token' }); const customProvider = new CesiumTerrainTileProvider({ url: 'https://your-terrain-server' }); ``` -------------------------------- ### BaiduTrafficTileProvider Constructor Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduTrafficTileProvider Initializes a new instance of the BaiduTrafficTileProvider with configurable options for loading Baidu Maps traffic data. ```APIDOC ## new BaiduTrafficTileProvider(options) ### Description Initializes a new instance of the BaiduTrafficTileProvider. This provider is used to load and render Baidu Maps traffic data, supporting both online and offline modes, and various projection methods. ### Method `constructor` ### Parameters #### Options - **options** (object) - Optional - Configuration options for the BaiduTrafficTileProvider. - **autoRefresh** (boolean) - Optional - Enables automatic refreshing of traffic data. Defaults to `false`. - **colors** (object) - Optional - Configuration for traffic color styling. - **isOffline** (boolean) - Optional - Specifies if the provider is in offline mode. Defaults to `false`. - **lineWidth** (number) - Optional - Sets the width of the traffic lines. Defaults to `1`. - **params** (object) - Optional - Additional parameters to be sent with tile requests. - **projection** (string) - Optional - The projection method to use, especially for offline mode. Defaults to `'mapvthree.PROJECTION_WEB_MERCATOR'`. - **refreshInterval** (number) - Optional - The interval in milliseconds for automatic refreshing. Minimum value is 60000ms (60 seconds). - **url** (string) - Optional - The URL of the offline traffic server when `isOffline` is true. ### Returns - **BaiduTrafficTileProvider** - An instance of the BaiduTrafficTileProvider. ``` -------------------------------- ### Accessor: parseCoordinates Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.CSVDataSource Gets or sets a custom function for parsing coordinates. ```APIDOC ## Accessor: parseCoordinates ### Description Gets or sets a custom function responsible for parsing coordinates from data items. #### Getter - **Method**: GET - **Endpoint**: /parseCoordinates - **Returns**: undefined | Function - The current coordinate parsing function, or undefined if none is set. #### Setter - **Method**: PUT - **Endpoint**: /parseCoordinates - **Parameters**: - **value** (Function) - Required - The custom coordinate parsing function. It accepts a data item and should return a geometry object. - **Returns**: void ### Request Example (Setter) ```javascript dataSource.parseCoordinates = (item) => { return { type: 'Point', coordinates: [item.lon, item.lat] }; }; ``` ``` -------------------------------- ### Instantiate OSMImageryTileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.OSMImageryTileProvider Demonstrates how to create an instance of the OSMImageryTileProvider. This class is used to load and render OSM map imagery tiles and supports different projection methods. ```javascript // 创建OSM影像瓦片提供者 const provider = new OSMImageryTileProvider({ // 配置选项 }); ``` -------------------------------- ### Accessor: coordinatesKey Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.CSVDataSource Gets or sets the key name used for coordinates. ```APIDOC ## Accessor: coordinatesKey ### Description Gets or sets the key name that identifies the coordinates field within the data items. #### Getter - **Method**: GET - **Endpoint**: /coordinatesKey - **Returns**: string - The current key name for coordinates. #### Setter - **Method**: PUT - **Endpoint**: /coordinatesKey - **Parameters**: - **value** (string) - Required - The new key name for coordinates. - **Returns**: void ### Request Example (Setter) ```javascript dataSource.coordinatesKey = 'geometryField'; ``` ``` -------------------------------- ### Initialize Engine Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.Engine Initializes the Engine core entry point, which is responsible for setting up the rendering engine. It takes an HTMLElement container and an optional options object for configuration. The options can include event, map, rendering, selection, and widgets configurations. ```javascript const engine = new Engine(container, options); ``` -------------------------------- ### Get Objects Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DataSource Retrieves all connected objects associated with the data source. ```APIDOC ## GET /websites/lbsyun_baidu_jsapithree/dataSource/objects ### Description Retrieves an array of all objects that are connected to or associated with this data source. The specific nature of these objects depends on the context of the library. ### Method GET ### Endpoint /websites/lbsyun_baidu_jsapithree/dataSource/objects ### Parameters None ### Request Example ```json {} ``` ### Response #### Success Response (200) - **objects** (any[]) - An array of connected objects. #### Response Example ```json { "objects": [ // ... array of connected objects ] } ``` ``` -------------------------------- ### Initialize Baidu Maps Boundary Service Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.services.Boundary Demonstrates how to create an instance of the Boundary service for Baidu Maps. This involves specifying the API source during initialization. The service is then ready to fetch boundary data. ```javascript const boundary = new mapvthree.services.Boundary({ apiSource: mapvthree.services.API_SOURCE_BAIDU }); ``` -------------------------------- ### Accessor: parseFeature Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.CSVDataSource Gets or sets a custom function for parsing features into DataItem instances. ```APIDOC ## Accessor: parseFeature ### Description Gets or sets a custom function used to parse raw data items into `DataItem` instances. #### Getter - **Method**: GET - **Endpoint**: /parseFeature - **Returns**: undefined | Function - The current feature parsing function, or undefined if none is set. #### Setter - **Method**: PUT - **Endpoint**: /parseFeature - **Parameters**: - **value** (Function) - Required - The custom feature parsing function. It accepts a raw data item and should return a `DataItem` instance. - **Returns**: void ### Request Example (Setter) ```javascript dataSource.parseFeature = (item) => { return new DataItem({ geometry: { type: 'Point', coordinates: [item.lon, item.lat] }, properties: { name: item.name, value: item.value } }); }; ``` ``` -------------------------------- ### Get Size Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DataSource Retrieves the current number of data items in the data source. ```APIDOC ## GET /websites/lbsyun_baidu_jsapithree/dataSource/size ### Description Returns the total number of data items currently present in the data source. ### Method GET ### Endpoint /websites/lbsyun_baidu_jsapithree/dataSource/size ### Parameters None ### Request Example ```json {} ``` ### Response #### Success Response (200) - **size** (number) - The number of data items in the data source. #### Response Example ```json { "size": 150 } ``` ``` -------------------------------- ### EngineRendering Class Initialization and Configuration Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineRendering Demonstrates how to initialize and configure the EngineRendering class using its constructor with various override options for animation, context parameters, features like bloom and antialiasing, and pixel ratio. ```javascript new EngineRendering(engine, { animationLoopFrameTime: 16, contextParameters: { preserveDrawingBuffer: true }, enableAnimationLoop: true, features: { antialias: { enabled: true, method: 'smaa' }, bloom: { enabled: true, radius: 0, strength: 0.1, threshold: 1 } }, pixelRatio: window.devicePixelRatio }); ``` -------------------------------- ### Create and Customize DOMOverlay Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DOMOverlay Demonstrates how to create a basic DOMOverlay and an overlay from an HTML string. It shows how to set initial properties such as the point coordinates, the DOM element or HTML string, offset, and enable dragging. ```javascript const overlay = engine.add(new mapvthree.DOMOverlay({ point: [116.404, 39.915, 0], dom: document.createElement('div'), offset: [0, 0], enableDragging: true })); const htmlOverlay = engine.add(new mapvthree.DOMOverlay({ point: [116.404, 39.915, 0], dom: '
Hello World
' })); ``` -------------------------------- ### getDataItemIndex Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.CSVDataSource Gets the data index within the raw data for a given drawing element index. ```APIDOC ## getDataItemIndex ### Description Gets the data index within the raw data for a given drawing element index. ### Method GET ### Endpoint /getDataItemIndex ### Parameters #### Path Parameters - **index** (number) - Required - The index of the drawing element. ### Response #### Success Response (200) - **number** - The index of the data item in the raw data. #### Response Example ```json 1 ``` ``` -------------------------------- ### Initialize BingImageryTileProvider and Change Style Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BingImageryTileProvider Demonstrates how to create an instance of BingImageryTileProvider and dynamically change its map style. This requires the mapvthree library and specifies the desired Bing map style. ```javascript const provider = new mapvthree.BingImageryTileProvider({ style: mapvthree.mapViewConstants.BING_MAP_STYLE_AERIAL, }); provider.style = mapvthree.mapViewConstants.BING_MAP_STYLE_ROAD; ``` -------------------------------- ### Get Data Items Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DataSource Retrieves all data items currently stored in the data source. ```APIDOC ## GET /websites/lbsyun_baidu_jsapithree/dataSource/dataItems ### Description Retrieves an array containing all data items present in the data source. ### Method GET ### Endpoint /websites/lbsyun_baidu_jsapithree/dataSource/dataItems ### Parameters None ### Request Example ```json {} ``` ### Response #### Success Response (200) - **dataItems** (DataItem[]) - An array of DataItem objects. #### Response Example ```json { "dataItems": [ { "id": "point1", "type": "Feature", "geometry": { "type": "Point", "coordinates": [116.39, 39.9] }, "properties": {} } // ... more data items ] } ``` ``` -------------------------------- ### Engine Constructor Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.Engine Initializes the rendering engine. The constructor takes a container element and optional configuration options for various internal systems. ```APIDOC ## constructor Engine ### Description Initializes the rendering engine. The constructor takes a container element and optional configuration options for various internal systems. ### Method constructor ### Endpoint N/A (Class Constructor) ### Parameters #### Path Parameters None #### Query Parameters None #### Request Body * **container** (HTMLElement) - Required - The DOM element to contain the engine. * **options** (object) - Optional - Configuration options for internal systems. * **event** (object) - Event options, passed to `EngineEvent.constructor`. * **map** (object) - Map options, passed to `EngineMap.constructor`. * **rendering** (object) - Rendering options, passed to `EngineRendering.constructor`. * **selection** (object) - Selection options, passed to `EngineSelection.constructor`. * **widgets** (object) - Widgets options, passed to `EngineWidgets.constructor`. ### Request Example ```javascript const engine = new Engine(container, options); ``` ### Response #### Success Response (200) * **Engine** (object) - The initialized engine instance. #### Response Example ```json { "message": "Engine initialized successfully" } ``` ``` -------------------------------- ### GET /zoom Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.EngineWidgets Retrieves the current zoom object. The zoom component can be enabled or disabled using its `.enable` property. ```APIDOC ## GET /zoom ### Description Retrieves the current zoom object. The zoom component can be enabled or disabled using its `.enable` property. ### Method GET ### Endpoint /zoom ### Parameters #### Query Parameters None ### Request Example None ### Response #### Success Response (200) - **zoom** (Zoom) - The zoom object. #### Response Example ```json { "zoom": { "level": 10, "enabled": true } } ``` ``` -------------------------------- ### Managing Data Items in GeoJSONDataSource Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.GeoJSONDataSource Provides examples for adding, clearing, and retrieving data items from a GeoJSONDataSource instance. ```APIDOC ## Methods: GeoJSONDataSource ### `add` ```javascript // Add a single point const point = new DataItem([116.39, 39.9], { name: '北京' }); dataSource.add(point); // Add multiple features const points = [ new DataItem([116.39, 39.9], { name: '北京' }), new DataItem([121.47, 31.23], { name: '上海' }) ]; dataSource.add(points); ``` ### `clear` ```javascript // Clear all data dataSource.clear(); console.log(dataSource.size); // 0 ``` ### `get` ```javascript // Get the first data item const item = dataSource.get(0); console.log(item.position, item.color); ``` ### `getDataItem` ```javascript // Get the raw data item at a specific index const rawDataItem = dataSource.getDataItem(0); ``` ``` -------------------------------- ### BaiduVectorTileProvider Constructor Options (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduVectorTileProvider Details the configuration options available when creating a new BaiduVectorTileProvider instance. These include API keys, display settings for map features, offline mode parameters, projection types, and styling options. ```javascript new BaiduVectorTileProvider({ ak: 'your_ak_here', // Baidu Maps AK, required for online mode displayOptions: { base: true, // Whether to display base surfaces building: true, // Whether to display 3D buildings flat: false, // Whether to display in flat mode link: true, // Whether to display roads poi: true // Whether to display POI labels }, isOffline: false, // Set to true for offline DuGIS mode projection: 'mapvthree.PROJECTION_WEB_MERCATOR', // Projection for offline mode staticUrl: 'http://your-static-server', // Static resource server address for offline mode styleId: 'your_style_id', // Style ID for personalized Baidu Maps styleJson: '{...}', // JSON string for personalized Baidu Maps style url: 'http://your-tile-server' // Tile DuGIS server address for offline mode }); ``` -------------------------------- ### Create Polyline Instances (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.Polyline Demonstrates how to create both regular screen-space polylines and ground-hugging polylines using the mapvthree.Polyline constructor. These examples show setting basic properties like flatness, color, and line width. ```javascript const polyline = engine.add(new mapvthree.Polyline({ flat: false, color: 0xff0000, lineWidth: 2 })); const fatLine = engine.add(new mapvthree.Polyline({ flat: true, color: 0x00ff00, lineWidth: 5 })); ``` -------------------------------- ### VectorSurface Accessor: tileProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.VectorSurface Explains the tileProvider accessor for the VectorSurface. It allows getting and setting the VectorProvider instance associated with the surface. ```javascript get tileProvider(): VectorProvider set tileProvider(tileProvider: VectorProvider): void ``` -------------------------------- ### BaiduVectorTileProvider Constructor Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduVectorTileProvider Initializes a new instance of the BaiduVectorTileProvider. This constructor allows for configuration of online or offline modes, Baidu Map AK, display options, projection, and custom styles. ```APIDOC ## Constructor: new BaiduVectorTileProvider(options?) ### Description Initializes a new instance of the BaiduVectorTileProvider for loading and rendering Baidu Maps vector tile data. ### Method `new` ### Parameters #### Path Parameters None #### Query Parameters None #### Request Body ##### `options` (object) - Optional Configuration options for the BaiduVectorTileProvider. - **`ak`** (string) - Optional - Baidu Map AK, required for online mode. - **`displayOptions`** (object) - Optional - Display configuration options. - **`base`** (boolean) - Optional - Whether to display the base layer. - **`building`** (boolean) - Optional - Whether to display 3D buildings. - **`flat`** (boolean) - Optional - Whether to display in flat mode. - **`link`** (boolean) - Optional - Whether to display roads. - **`poi`** (boolean) - Optional - Whether to display Points of Interest (POI). - **`isOffline`** (boolean) - Optional - Specifies if it's in offline DuGIS mode. - **`projection`** (string) - Optional - The projection mode for offline mode, defaults to 'mapvthree.PROJECTION_WEB_MERCATOR'. - **`staticUrl`** (string) - Optional - The static resource server address for offline mode. - **`styleId`** (string) - Optional - The StyleId for Baidu Map personalized maps. - **`styleJson`** (string) - Optional - The StyleJson for Baidu Map personalized maps. - **`url`** (string) - Optional - The tile server address for offline mode. ### Request Example ```javascript // Creating an online vector tile provider const provider = new BaiduVectorTileProvider({ ak: 'your_ak_here', displayOptions: { // Display configuration } }); // Creating an offline vector tile provider const offlineProvider = new BaiduVectorTileProvider({ isOffline: true, url: 'http://dugis-offline-server' }); ``` ### Response #### Success Response (200) - **`BaiduVectorTileProvider`** - An instance of the BaiduVectorTileProvider. ``` -------------------------------- ### Access Connected Objects Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DataSource Explains how to get an array of all objects connected to the DataSource. This might include visualization layers or other related components. ```javascript const connectedObjects = dataSource.objects; ``` -------------------------------- ### Manage BaiduVectorTileProvider Properties (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduVectorTileProvider Illustrates how to get and set various properties of the BaiduVectorTileProvider, including visibility, opacity, color tinting, and debug label display. These properties allow for fine-tuning the appearance and behavior of the tile layer. ```javascript // Get properties const isVisible = provider.visible; const currentOpacity = provider.opacity; const tint = provider.colorTint; // Set properties provider.visible = false; provider.opacity = 0.8; provider.colorTint = [255, 0, 0]; // Red tint provider.addDebugLabel = true; ``` -------------------------------- ### Initialize BaiduTrafficTileProvider (JavaScript) Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduTrafficTileProvider Demonstrates how to create instances of BaiduTrafficTileProvider for both online and offline scenarios. The online provider is configured with auto-refresh enabled, while the offline provider specifies a custom URL and projection. ```javascript const provider = new BaiduTrafficTileProvider({ autoRefresh: true, refreshInterval: 60000 }); const offlineProvider = new BaiduTrafficTileProvider({ isOffline: true, url: 'http://offline-traffic-server', projection: 'mapvthree.PROJECTION_WEB_MERCATOR' }); ``` -------------------------------- ### VectorSurface Accessor: loadSiblings Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.VectorSurface Details the loadSiblings accessor for the VectorSurface. It allows getting and setting a value to control whether sibling tiles are loaded. ```javascript get loadSiblings(): any set loadSiblings(value: any): void ``` -------------------------------- ### Initialize and Add SimpleModel Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.SimpleModel Demonstrates how to create and add a SimpleModel to the engine. This involves instantiating SimpleModel with configuration options like name, URL, position, scale, and rotation, then adding it to the engine. Dependencies include the mapvthree library and the engine instance. ```javascript let model = engine.add(new mapvthree.SimpleModel({ name: '模型名称', url: '模型路径', point: [lng, lat, z], scale: [1, 1, 1], rotation: [0, 0, 0], })) ``` -------------------------------- ### RasterSurface Accessor: terrainProvider Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.RasterSurface This accessor allows getting and setting the TerrainProvider for the RasterSurface. The getter returns the current TerrainProvider, and the setter expects a TerrainProvider object. ```javascript // Getter get terrainProvider(): TerrainProvider // Setter set terrainProvider(terrainProvider: TerrainProvider): void ``` -------------------------------- ### DOMOverlay Class Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.DOMOverlay Documentation for the DOMOverlay class, its constructor, methods, and accessors. ```APIDOC ## Class DOMOverlay DOM覆盖物基类,用于在地图上添加HTML元素。支持自定义位置、偏移和拖拽功能。 ### Constructor * **new DOMOverlay(parameters?: { className?: string; dom: string | HTMLElement; enableDragging?: boolean; offset?: number[]; point?: number[]; visible?: boolean; })** * Creates a DOM overlay. #### Parameters * **parameters**: object - Configuration parameters. * **className?**: string - CSS class name. * **dom**: string | HTMLElement - DOM element or HTML string. * **enableDragging?**: boolean - Whether dragging is enabled, defaults to false. * **offset?**: number[] - Pixel offset, defaults to [0, 0]. * **point?**: number[] - Coordinates [longitude, latitude, altitude]. * **visible?**: boolean - Whether visible, defaults to true. ### Methods * **dispose()**: void * Releases memory. ### Accessors * **className**: string (get) * Gets the CSS class name. * **className**: void (set) * Sets the CSS class name. * **Parameters**: * `className`: string - The CSS class name. * **dom**: HTMLElement (get) * Gets the DOM element. * **dom**: void (set) * Sets the DOM element. * **Parameters**: * `value`: string | HTMLElement - The DOM element or HTML string. * **enableDragging**: boolean (get) * Gets whether dragging is enabled, defaults to false. * **enableDragging**: void (set) * Sets whether dragging is enabled. * **Parameters**: * `value`: boolean - Whether to enable dragging. * **offset**: number[] (get) * Gets the pixel offset [x, y], defaults to [0, 0]. * **offset**: void (set) * Sets the pixel offset. * **Parameters**: * `value`: number[] - The pixel offset [x, y]. * **point**: number[] (get) * Gets the coordinates [longitude, latitude, altitude]. * **point**: void (set) * Sets the coordinates. * **Parameters**: * `value`: any - The coordinates [longitude, latitude, altitude] or THREE.Vector2/Vector3 object. * **stopPropagation**: boolean (get) * Gets whether to stop event propagation, defaults to false. * **stopPropagation**: void (set) * Sets whether to stop event propagation. * **Parameters**: * `value`: boolean - Whether to stop event propagation. * **visible**: boolean (get) * Gets whether visible, defaults to true. * **visible**: void (set) * Sets whether visible. * **Parameters**: * `value`: boolean - Whether visible. ``` -------------------------------- ### Get Current Search Results Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.services.AutoComplete Illustrates how to retrieve the current search results obtained from the AutoComplete service. The retrieved results can be processed or displayed to the user. ```javascript const results = autoComplete.getResults(); if (results) { console.log('当前结果:', results); } ``` -------------------------------- ### VectorSurface Accessor: showTileDebugLabel Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.VectorSurface Details the showTileDebugLabel accessor for the VectorSurface. It allows getting and setting a boolean value to control the visibility of tile debug labels. ```javascript get showTileDebugLabel(): boolean set showTileDebugLabel(value: boolean): void ``` -------------------------------- ### BaiduTrafficTileProvider Accessors Source: https://lbsyun.baidu.com/jsapithree/docs/classes/mapvthree.BaiduTrafficTileProvider Describes the accessor methods (getters and setters) for configuring and retrieving various settings of the BaiduTrafficTileProvider, such as refresh intervals, opacity, and color tints. ```APIDOC ## Accessors ### addDebugLabel - **Description**: Gets or sets whether to draw debug labels on the tiles. - **Getter**: Returns `boolean`. - **Setter**: Accepts `boolean`. ### autoRefresh - **Description**: Gets or sets whether automatic refresh is enabled for the traffic data. - **Getter**: Returns `boolean`. - **Setter**: Accepts `boolean` (`enabled`). ### colorTint - **Description**: Gets or sets the color tint applied to the traffic data. - **Getter**: Returns `number[]` (RGB components). - **Setter**: Accepts `number[]` (`colorTint`). ### maxLevel - **Description**: Gets the maximum zoom level supported by this provider. - **Getter**: Returns `number`. ### minLevel - **Description**: Gets the minimum zoom level supported by this provider. - **Getter**: Returns `number`. ### opacity - **Description**: Gets or sets the opacity of the traffic layer. - **Getter**: Returns `number` (0-1). - **Setter**: Accepts `number` (`opacity`). ### randomColorTint - **Description**: Gets or sets whether to use random color tints for the traffic data. - **Getter**: Returns `boolean`. - **Setter**: Accepts `boolean` (`randomColorTint`). ### refreshInterval - **Description**: Gets or sets the interval in milliseconds for automatic data refresh. - **Getter**: Returns `number`. - **Setter**: Accepts `number` (`interval`), minimum 60000ms. ### sourceProjection - **Description**: Gets the source projection of the tile data. - **Getter**: Returns `any`. ### targetProjection - **Description**: Gets or sets the target projection for rendering. - **Getter**: Returns `any`. - **Setter**: Accepts `any` (`value`). ```