ESMap三维地图开发流程

易景地图（ESMap）它是一个三维地图在线开发平台，通常用于智能城市数据可视化的在线快速开发，广泛应用于室内外定位导航和数字双胞胎技术场景。下面是一个简要的介绍ESMap三维地图的开发过程：

一、场景搭建

进入官网，登录ESMap地图开发工具房间、模型、路径、地板POI等进行绘制

l 房间：自由绘制图形、墙壁、钻孔，拖动点编辑，支持CAD地图识别；

l 模型：免费绘制个性化地图，添加大量三维模型库，调整模型的基本属性和纹理地图，支持3dmax模型上传等；

l 路径：任意规划导航线、导航点，实现室内外一体化融合定位、跨楼层导航；

l 楼层：多层编辑、背景编辑、地板编辑三个功能板块，可对楼梯位置进行打孔编辑；

l POI管理：提供给标准POI还支持自定义图标上传图标库；

ESMap三维地图开发平台

二、在线开发

使用在线开发平台将地图模型添加到我的项目中，并为室内三维地图或城市三维地图或城市三维地图中。在线开发平台主要包括以下四个功能区：

l 项目列表：对项目进行管理和编辑，提供快速分享、离线下载、历史记录等功能；

l 官方示例：提供室内地图和三维地图的功能示例代码参考，涉及显示、标记、导航、特效、搜索、事件、三维模型等，节省了大量的开发时间；

l 代码编辑：集成网页JavaScript代码编辑器不需要用户在本地建立web项目环境，项目在线完成；

l 预览窗口：实时编译三维地图运行预览窗口，实时预览三维地图场景渲染效果。

ESMap在线开发平台

三、数据对接

使用在线开发平台，通过代码编辑直接引入数据对接，与第三方物联网系统或自己的后台系统进行数据传输和通信。支持四种数据对接方式Ajax、Jsonp、MQTT、WebSocket。

1、Ajax

$.ajax({

type: "get",

url: "https://www.esmap.cn/dataapi/getdata",

data: { "tid":12333 },

dataType: "json", // 返回的数据类型 json

success: function (d) {

console.log(d.data)

}

});

2、Jsonp

$.ajax({

type: "get",//JSONP 仅支持 GET 请求

url: "https://www.esmap.cn/dataapi/getdata",

data: { "tid":12333 },

dataType: "jsonp", // 返回的数据类型 jsonp

jsonpCallback: "callbackA", // 设置回调函数名 返回数据 函数名一致

success: function (d) {

console.log(d.data)

不要重复///回调函数名称 jsonpCallback 不要重复设置)，否则可能会导致回调函数 undefined

}

});

3、MQTT

// 创建一个mqtt连接

var client = mqtt.connect("wss:http://www.esmap.cn:8088");

client.subscribe("/public/ESMapTEST/data1");

// 连接成功后发送数据

client.on("message", function (topic, payload) {

console.log('data:' payload);

});

// 关闭连接

client.end();

4、WebSocket

var webSocket = new WebSocket('wss://http://www.esmap.cn/wss');

// 建立 websocket 连接成功触发事件

webSocket.onopen = function () {

console.log("websoket成功连接服务器...");

};

// 接收服务端数据时触发事件

webSocket.onmessage = function (ev) {

console.log(ev.data);

};

webSocket.onclose = function (evt) {

console.log("websoket关闭...");

webSocket = null;

}

// 连接成功后，可使用 send() 该方法向服务器发送数据，如：

// var dataObj = { 'id': 123456 };

webSocket.send(JSON.stringify(dataObj));

// send 数据类型可以是 字符串 或 二进制对象（Blob 对象、ArrayBuffer 对象）

四、离线部署

在线开发完成项目代码后，您可以创建一个共享链接供他人查看。如果您想将其合并到您自己的本地项目中，您需要离线包装和下载。下载包装好的项目开发文件夹，将其解压到任何一个WEB服务器的文件夹可以发布。

欢迎留言讨论。一些图片来自网络。如果您有任何问题，请通过私人信件联系我，或浏览器搜索【ESMap】进行了解。