三维可视化平台项目免费在线开发数据对接
在线开发平台是易景空间三维场景开发的在线 3D 可视化应用开发平台，支持以下四种数据对接方式，可与第三方物联网系统或者自己后台系统进行数据传输通信。
| 方法 | 数据对接方式 | 技术说明 |
|---|---|---|
| 1 | Ajax | 通过浏览器的 XMLHttpRequest 对象向服务器发送 HTTP 请求，得到服务器返回的数据后进行数据处理的数据交互方式 |
| 2 | JSONP | JSON请求解决不了跨域名的问题，使用此方法可以让网页从别的网域获取资料，主要解决跨域名访问数据-Cross-origin resource sharing(CORS) |
| 3 | MQTT | MQTT是一个轻量级协议，使用MQTT协议的中心是broker（服务器/代理），客户端通过订阅消息和发布消息进行数据交互 |
| 4 | WebSocket | 服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，真正实现了数据的实时双向通信。并且 WebSocket 通信不受同源策略的限制，即不存在跨域问题 |
项目数据对接Ajax方法1
在线开发平台环境中，可以通过在网页中直接引入
<script src="https://www.esmap.cn/escopemap/plug-in/jquery/jquery-2.1.4.min.js"></script>
使用 JQurey 封装的 Ajax 方法进行数据对接，例如：
$.ajax({
type: "get",
url: "https://www.esmap.cn/dataapi/getdata",
data: { "tid":12333 },
dataType: "json", // 返回的数据类型 json
success: function (d) {
console.log(d.data)
}
});
项目数据对接JSONP方法2
在线开发平台环境中，可以通过在网页中直接引入
<script src="https://www.esmap.cn/escopemap/plug-in/jquery/jquery-2.1.4.min.js"></script>
由于 JQuery 的 Ajax 请求对 JSONP 进行了封装，因此我们可以直接使用相关方法请求 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
}
});
项目数据对接MQTT方法3
在线开发平台环境中，可以通过在网页中直接引入
<script src="https://www.esmap.cn/escopemap/plug-in/mqtt/mqtt.js"></script>
由于 JQuery 的 Ajax 请求对 JSONP 进行了封装，因此我们可以直接使用相关方法请求 JSONP 数据，例如：
// 创建一个mqtt连接
var client = mqtt.connect("wss:www.esmap.cn:8088");
client.subscribe("/public/ESMapTEST/data1");
// 连接成功后发送数据
client.on("message", function (topic, payload) {
console.log('data:' + payload);
});
// 关闭连接
client.end();
项目数据对接WebSocket方法4
WebSocket 是 HTML5 一种新的协议，实现了浏览器与服务器之间的全双工通信。
WebSocket 最大的优点在，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，真正实现了数据的实时双向通信。并且 WebSocket 通信不受同源策略的限制，即不存在跨域问题。
在线开发平台环境中，可以通过在网页中直接引入
<script src="https://www.esmap.cn/escopemap/plug-in/websocket/websocket.js"></script>
var webSocket = new WebSocket('wss://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 对象）