小地图导航

小地图实时位置导航

参数

new MMSDT.miniMap( parameter )

parameter: 初始化参数

var parameter = {
div: "map", //HTML中的ID号，小地图附加在上面
mapUrl: dirUrl+"textures/map.png", //地图的图片地址
spotUrl: dirUrl+"textures/myPoint.png", //中心圆点图标
spot: 30, //中心人物圆点大小
color: 0xff0000, //圆点颜色
positionRevise: [0,-60], //原点与地图对位置（X，Z）
coefficient: 1.8, //移动系数比
scale: 0.8, //地图整体缩放大小
}

属性

.updata()

实时位置刷新渲染

html代码示例

<!-- 建一个 div放置小地图画布 --> <div id="map" style="position: absolute; z-index: 10; width:300px; height:400px;top:20px;left:50px; background-image: url(textures/bg.png); background-size:100% 100%"></div>

javascript代码示例

//小地图 var parameter = { div: "map", //HTML中的ID号，小地图附加在上面 mapUrl: dirUrl+"textures/map.png", //地图的图片地址 (注意：制作地图需按经纬度方向，与实际比例一致) spotUrl: dirUrl+"textures/myPoint.png", //中心圆点图标 spot: 30, //中心人物圆点大小 color: 0xff0000, //圆点颜色 positionRevise: [0,-60], //原点与地图对位置（X，Z） coefficient: 1.8, //移动系数比 scale: 0.8, //地图整体缩放大小 } var smap = new MMSDT.miniMap( parameter ); //初始化构建函数 //监听鼠标控制器动作 controls.addEventListener( 'change', function(){ smap.updata(); //小地图位置刷新 });

在线演示