1.1.6 • Published 2 months ago
51timapi v1.1.6
介绍
51timapi是一个交通行业的Wdp插件，其运行依赖于wdpapi
安装
$ npm i 51timapi --registry http://10.100.10.63/引入
import WdpApi from 'wdpapi'
import TimApi from '51timapi'初始化
const config = {
"id": "player", //[required] Render scene container(DOM node id)
"url": "http://10.66.8.158:8889/Renderers/Any/order", //[optional] Cloud rendering service address
"order": "cba557541abbdccaed3c2043b7e9db35", //[optional] Rendering order, obtained on the cloud rendering client
"resolution": [ window.screen.width, window.screen.height ], //[optional] Set the cloud rendering output resolution[width, height]
"debugMode": "normal", //[optional] none: does not print logs, normal: normal logs
"keyboard": { //[optional] keyboard event
"normal": false, //[optional] Keyboard event, exclude F1~F12 [default disabled]
"func": false //[optional] Browser F1 ~ F12 function keys [default disabled]
}
}
const App = new WdpApi(config) as WdpApi & TimApi
App.Plugin.Install(TimApi).then(r=>{
App.Renderer.Start().then((res) => {
if (res.success) {
App.Renderer.RegisterEvent([
{
name: 'onVideoStreamLoaded', func: function () {
// 视频流加载成功
}
}
])
}
})
});
/** 停止推流 **/
App.Renderer.Stop();加载 Xodr 高精路网
const TrafficOdRoad = new App.TrafficODRoad({
"Online": true, // 是否为离线数据
"AutoFocus": true, // 加载后自动聚焦至路网
"Url": "test.xodr", // 路网地址
"Lon": 116.31,
"Lat": 31.31,
"Height": 20000
})
const res = await App.Scene.Add(TrafficODRoad)
/** 更新车流 **/
TrafficODRoad.Update({
"Url": "ws://10.66.9.186:5681/965" // 符合规范的websocket链接
})
/** 删除车流 **/
TrafficODRoad.Delete()车流
/** 创建车流 **/
const TrafficFlow = new App.TrafficFlow({
trafficDataUrl: "ws://10.66.9.186:5681/965" // 符合规范的websocket链接
})
const res = await App.Scene.Add(TrafficFlow)
/** 更新车流 **/
TrafficFlow.Update({
trafficDataUrl: "ws://10.66.9.186:5681/965" // 符合规范的websocket链接
})
/** 删除车流 **/
TrafficFlow.Delete()
/** 获取车流信息 **/
TrafficFlow.GetTrafficFlowInfo()
/** 根据id获取车流中的车辆信息 **/
TrafficFlow.GetTrafficVehicleInfo("v-10") // v-10为车辆ID
/** 获取全量车辆信息 **/
TrafficFlow.GetAllTrafficVehicleInfo() // v-10为车辆ID
/** 车流和气泡控制 **/
TrafficFlow.RunTrafficFlowAction({
actionName: "Pause" //车流暂停：Pause；播放：Play；显示：Show；隐藏：Hide；气泡隐藏：HideBubbles；气泡显示：ShowBubbles；开启点击查询：EnableQuery；关闭点击查询：DisableQuery
})
/** 设置聚焦显示交通体气泡 **/
TrafficFlow.FocusTrafficVehicles(["id1","id2"]) //仅显示当前气泡交通体id的气泡。传空数组表示显示所有气泡
/** 获取聚焦显示交通体id **/
TrafficFlow.GetFocusedTrafficVehicles()跟车
/** 点击鼠标跟车 **/
App.TrafficCamAPI.FollowVehicleByClick({
clickToFollow: true,
followMode: "Follower" //None不跟车，Driver驾驶视角，Follower第三人称跟车视角
})
/** 通过车辆ID跟车 **/
App.TrafficCamAPI.FollowVehicleByID({
vehicleId: "", // 车辆ID
followMode: "Follower" //None不跟车，Driver驾驶视角，Follower第三人称跟车视角
})
/** 取消跟车模式 **/
App.TrafficCamAPI.CancelFollowVehicle()
/** 相机变化回调事件 **/
App.TrafficCamAPI.OnTrafficCamStatusChanged((info) => {
console.log(info)
});高精路网热力图
/** 创建高精路网热力图 **/
const TrafficRoadHeatMap = new App.TrafficRoadHeatMap({
openDriveUrl: "v1.xodr", //路网文件路径
densitySettings:
{
mode: "MaxSpeed", //车道最大速度：MaxSpeed;车道内所有车辆平均速度：AvgSpeed;VehCount:车道上的最大车辆数。
min: 10, //阈值下限。当Mode中的统计类型值小于等于LevelMin值时，热力图显示为绿色。
max: 100 //阈值上限。当Mode中的统计类型值大于等于LevelMax值时，热力图显示为红色。
},
isVisible: false //是否可见
})
const res = await App.Scene.Add(TrafficRoadHeatMap)
/** 更新热力图 **/
TrafficRoadHeatMap.Update({
openDriveUrl: "v1.xodr", //路网文件路径
densitySettings:
{
mode: "MaxSpeed", //车道最大速度：MaxSpeed;车道内所有车辆平均速度：AvgSpeed;VehCount:车道上的最大车辆数。
min: 10, //阈值下限。当Mode中的统计类型值小于等于LevelMin值时，热力图显示为绿色。
max: 100 //阈值上限。当Mode中的统计类型值大于等于LevelMax值时，热力图显示为红色。
},
isVisible: false //是否可见
})
/** 删除热力图 **/
TrafficRoadHeatMap.Delete()GeoJson线段热力图
/** 创建GeoJson线段热力图 **/
const TrafficAnalysis = new App.TrafficAnalysis({
"roadDataUrl": "roadDataUrl", // Geojson在线请求地址
"height": 30,
"width": 5,
"field": "fieldKey", // Geojson中需计算的属性
"symbolMap": {
"0": "#00ffff",
"0.5": "#ffff00",
"1": "#ff00ff"
}
});
const res = await App.Scene.Add(TrafficRoadHeatMap)
/** 更新热力图 **/
TrafficAnalysis.Update({
"height": 30,
"width": 5,
"field": "fieldKey", // Geojson中需计算的属性
"symbolMap": {
"0": "#00ffff",
"0.5": "#ffff00",
"1": "#ff00ff"
}
})
/** 删除热力图 **/
TrafficAnalysis.Delete()截面流量统计
/** 创建截面流量统计 **/
const TrafficSectionFlow = new App.TrafficSectionFlow({
startLonLat: [],//截面起点
endLonLat: [], //截面终点
opacity: 0, //透明度，取值范围0到1
hexColor: "",//颜色，HEX值
height: 0 //高度
})
const res = await App.Scene.Add(TrafficSectionFlow)
/** 获取截面流量统计 **/
TrafficSectionFlow.GetSectionFlowStatistics()
/** 删除截面 **/
TrafficSectionFlow.Delete()全局设置
/** 启用 / 关闭 编辑模式 此模式在下方模型点击回调 OnModelClicked 中有模型信息 **/
App.TimGlobal.toggleEditMode(true);
/** 启用 / 关闭 Gizmo **/
App.TimGlobal.toggleGizmo(true);模型
/** 模型加载 **/
const Asset = new App.TimAsset({
"model": {
"sourceType": "Imported", // BuiltIn内置模型, Imported外部导入模型
"url": "http://10.66.8.158:5173/1.fbx" // fbx文件地址
},
"scale": [0,0,0],
"location": [0,0,0],
"rotation": [0,0,0]
})
/** 模型更新 **/
Asset.Update({
"scale": [0,0,0],
})
/** 模型删除 **/
Asset.Delete()
/** 模型材质替换 **/
App?.Scene.Covering.TimAsset.UpdateSelectionMaterial(
{
"materialInfo": {
"materialParams":
{
"textures": {},
"colors": {},
"scalars": {}
},
"sourceType": "BuiltIn",
"assetId": "",
"url": ""
}
}
)
/** 模型加载状态回调 **/
App.Scene.Covering.TimAsset.OnModelProcessState(()=>{
console.log("=============OnModelProcessState===========")
})
/** 开启编辑状态后的模型点击回调 **/
App.Scene.Covering.TimAsset.OnModelProcessState(()=>{
console.log("=============OnModelProcessState===========")
})
/** 加载储存场景 **/
App?.Scene.Covering.TimAsset.LoadTimModelScene()
App?.Scene.Covering.TimAsset.SaveTimModelScene()
App?.Scene.Covering.TimAsset.LoadTimModelSceneOnline()
App?.Scene.Covering.TimAsset.SaveTimModelSceneOnline()License
Copyright (c) 2023-present, 51WORLD