UNPKG

tedp

Version:

terra dp init

119 lines (97 loc) 3.09 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="./dist/tumap.js"></script> <style> * { margin: 0; padding: 0; } #mapContainer{ position:absolute; width:100%; height:100%; } .control-box{ position:absolute; right:10px; top:5px; background:rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.8); border-radius: 6px; overflow: hidden; color:#fff; font-size:13px; padding: 5px; box-sizing: border-box; } .control-box>span{ margin-left: 5px; } .input-text{ width:200px; height:25px; line-height:25px; box-sizing: border-box; } .control-button{ height:25px; line-height:25px; cursor: pointer; padding: 2px 5px; box-sizing: border-box; margin-left:5px; } </style> </head> <body> <!--地图容器--> <div id="mapContainer"></div> <div class="control-box"> <input class="control-button" type="button" value="创建战略图" onclick="createStrategy()" > <input class="control-button" type="button" value="显示" onclick="showPath(true)" > <input class="control-button" type="button" value="隐藏" onclick="showPath(false)" > <input class="control-button" type="button" value="移除" onclick="removePath()" > </div> <script type="text/javascript"> var map = TUMap.createMap({ //地图容器 id:"mapContainer", //UE4服务地址 必须设置 当前示例以地址栏地址 为服务地址 ,用户需要替换为自己的服务地址 url:window.parent.window.exampleServerUrl ,//"http://localhost:81/", onInit:function(){ createStrategy(); } }) ; //路径对象 var pathObj = null ; //创建标签 function createStrategy(){ //绘制路径 pathObj = map.createStrategy({ startLocation:new TUVector3(77053.6953125,150984.859375),//开始位置 endLocation:new TUVector3(7773.74560546875,-103738.140625),//结束位置 arcScale:.3,//弧度,-1至1,负数左弧,正数右弧 type:0,// 效果类型,0纯色,1亮度渐变 color:"#ff0000",//颜色 brightness:10,//亮度 opacity:1,//透明度 0-1 }) ; //移动下位置 map.focusOn(new TUVector3(115,-243,585),new TURotator(97,-90 ,7),57944); } //显示文字 function showPath(value) { if (pathObj) pathObj.show(value); } //隐藏文字 function removePath() { if (pathObj) pathObj.removeFromMap(); } </script> </body> </html>