<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<link
href="http://ua.bigemap.com:30081/bmsdk/bigemap-gl.js/v1.1.0/Widgets/widgets.css"
rel="stylesheet"
/>
<script src="http://ua.bigemap.com:30081/bmsdk/bigemap-gl.js/v1.1.0/bigemap-gl.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
height: 100%;
}
#container {
width: 100%;
height: 100%;
display: flex;
}
.l1,
.l2 {
flex: 1 1 48%;
height: 100%;
}
.bmgl-widget-credits {
display: none;
}
</style>
<title>Google Map Streets</title>
</head>
<body>
<div id="container">
<div class="l1" id="m1"></div>
<div class="l2" id="m2"></div>
</div>
<script>
bmgl.Config.HTTP_URL = 'http://ua.bigemap.com:30081/bmsdk/';
window.viewer = new bmgl.Viewer("m1", {
mapId: "bigemap.dc-satellite",
infoBox:false,
});
window.viewernew = new bmgl.Viewer("m2", {
mapId: "bigemap.dc-map",
infoBox:false,
});
var handler,
handler1 = null;
initHandlerOne(viewer, viewernew);
initHandlerTwo(viewernew, viewer);
function initHandlerOne(viewer, viewer0) {
if (
handler &&
handler.getInputAction(bmgl.ScreenSpaceEventType.MOUSE_MOVE)
) {
return;
}
handler = new bmgl.ScreenSpaceEventHandler(viewer.scene.canvas);
handler.setInputAction(function (movement) {
var _camerca = viewer.camera;
viewer0.camera.setView({
destination: _camerca.position,
orientation: {
direction: _camerca._direction,
up: _camerca.up,
heading: _camerca.heading,
pitch: _camerca.pitch,
roll: _camerca.roll,
},
});
}, bmgl.ScreenSpaceEventType.MOUSE_MOVE);
handler.setInputAction(function (movement) {
var _camerca = viewer.camera;
viewer0.camera.setView({
destination: _camerca.position,
orientation: {
direction: _camerca._direction,
up: _camerca.up,
heading: _camerca.heading,
pitch: _camerca.pitch,
roll: _camerca.roll,
},
});
}, bmgl.ScreenSpaceEventType.WHEEL);
if (
handler &&
handler.getInputAction(bmgl.ScreenSpaceEventType.MOUSE_MOVE)
) {
return;
}
}
function initHandlerTwo(viewer, viewer0) {
if (
handler1 &&
handler1.getInputAction(
bmgl.ScreenSpaceEventType.MOUSE_MOVE
)
) {
return;
}
handler1 = new bmgl.ScreenSpaceEventHandler(
viewer.scene.canvas
);
handler1.setInputAction(function (movement) {
var _camerca = viewer.camera;
viewer0.camera.setView({
destination: _camerca.position,
orientation: {
direction: _camerca._direction,
up: _camerca.up,
heading: _camerca.heading,
pitch: _camerca.pitch,
roll: _camerca.roll,
},
});
}, bmgl.ScreenSpaceEventType.MOUSE_MOVE);
handler1.setInputAction(function (movement) {
var _camerca = viewer.camera;
viewer0.camera.setView({
destination: _camerca.position,
orientation: {
direction: _camerca._direction,
up: _camerca.up,
heading: _camerca.heading,
pitch: _camerca.pitch,
roll: _camerca.roll,
},
});
}, bmgl.ScreenSpaceEventType.WHEEL);
}
</script>
</body>
</html>