配置地图
EvoMap JS API中,EM.Map
类是一个用于构建和管理三维地图场景的类。通过传递一个DIV
元素的ID
和一些初始化可选项,可以轻松地创建一个具有丰富交互性和高度自定义的地图场景。
构造参数
EM.Map(divId, options={})
divId: String 类型,表示将作为场景容器的DIV元素的ID。
options: Object 类型,初始化可选项,用于配置场景。
初始化参数详解
以下是 options 对象中可用的选项及其说明:
- center: Array 类型,指定地图的中心点坐标,默认为
[0, 0, 0]
。 - zoom: Number 类型,设置场景的初始化级别,默认为
3
。 - pitch: Number 类型,设置场景的初始化俯仰角,默认为
0
。 - roll: Number 类型,设置场景的初始化方位角,默认为
0
。 - maxPitch: Number 类型,设置场景的最大俯仰角,默认为
75
。 - minZoom: Number 类型,设置最小地图级别,默认为
0
。 - maxZoom: Number 类型,设置最大地图级别,默认为
30
。 - enableZoom: Boolean 类型,是否允许场景放缩,默认为
true
。 - enablePan: Boolean 类型,是否允许场景平移,默认为
true
。 - enableRotate: Boolean 类型,是否允许场景旋转,默认为
true
。 - enableDamping: Boolean 类型,是否开启相机阻尼效果,默认为
false
。 - autoRotate: Boolean 类型,设置场景是否自动旋转,默认为
false
。 - leaveTime: Number 类型,地图静置超过该时间后场景自动旋转,仅当
autoRotate
为true
时有效,默认为5
秒。 - showMapSwitch: Boolean 类型,是否显示二三维切换控件,默认为
true
。 - showFloorSwitch: Boolean 类型,是否显示楼层切换控件,默认为
false
。 - bgColor: String 类型,设置场景的背景色,默认为
0x112233
。 - bgImage: String 类型,设置场景的静态背景图片,默认为
null
。 - alpha: Number 类型,设置场景的全局透明度,默认为
false
。若设置了透明度,则bgColor
将被忽略。 - skyImages: Array 类型,设置天空盒的背景图片,传入天空盒六张图的地址,默认为空数组
[]
。 - near: Number 类型,固定近裁剪面,如果不设置,地图将根据地图级别动态设置近裁面的值。
- far: Number 类型,固定远裁剪面,如果不设置,地图将根据地图级别动态设置远裁面的值。
使用示例
以下是一个简单的使用示例:
const map = new Map("map", {
center: [116.40, 39.90, 0], // 设置地图中心点为北京
zoom: 10, // 设置初始化级别为10
pitch: 45, // 设置俯仰角为45度
enableZoom: true, // 允许放缩
enablePan: true, // 允许平移
enableRotate: true, // 允许旋转
bgColor: "0xFFFFFF", // 设置背景色为白色
skyImages: ["sky1.jpg", "sky2.jpg", "sky3.jpg", "sky4.jpg", "sky5.jpg", "sky6.jpg"] // 设置天空盒背景图片
});
在上述示例中,我们创建了一个 Map 实例,并将其绑定到ID为map
的DIV元素上。同时,我们还通过options对象配置了地图的中心点、初始化级别、俯仰角、背景色以及天空盒背景图片等属性。