tedp
Version:
terra dp init
106 lines (86 loc) • 2.73 kB
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;
}
.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="createBar()" >
<input class="control-button" type="button" value="移除" onclick="removeBar()" >
</div>
<script type="text/javascript">
var map = TUMap.createMap({
//地图容器
id:"mapContainer",
//UE4服务地址 必须设置 当前示例以地址栏地址 为服务地址 ,用户需要替换为自己的服务地址
url:window.parent.window.exampleServerUrl ,//"http://localhost:81/",
onInit:function(){
createBar();
}
}) ;
//标签数组
var barObj = null ;
//创建标签
function createBar(){
//创建
barObj = map.createGroupBar({
location : new TUVector3(Math.random()*-300000,Math.random()*-300000,0),//整体的中心点
radius : 10000,//柱状图距离中心点距离,默认30000
data : [//围绕中心点创建三维图数组
{type: 0, showData : [100,200,300,400,500]},//type:0或1,showData:最多5个数据
{type: 1, showData : [5000,300]},
{type: 1, showData : [1234,65,853]},
{type: 1, showData : [1234,65,853,656]},
{type: 1, showData : [1234,1656,1853,5555]}
]
});
//定位
map.setView(-4000, 2730, 2180, 0, -40, 123 ) ;
}
//隐藏文字
function removeBar(){
if(barObj)
barObj.removeFromMap();
}
</script>
</body>
</html>