GeoMultiScreenWidget

new Cesium.GeoMultiScreenWidget(options)

吉奥多屏控件
Name Type Description
options Object optional 参数选项:
Name Type Description
layoutId String optional 多屏视图布局页面元素所对应的ID
viewers Array optional 视图构造参数组,数组项内容为构造单个对象所需的键值对参数。
Example:
HTML代码:

<div id="layout" style="position: relative;height: 100%;width: 100%;overflow:hidden;">
    <div id="leftContainer" style="position: absolute;width: 50%;border: 1px solid gray;height: 100%;left: 0;"></div>
    <div id="rightContainer" style="position: absolute;width: 50%;border: 1px solid gray;height: 100%;right: 0;"></div>
</div>

JavaScript代码:

 //创建多屏视图
 multiScreenWidget = new Cesium.GeoMultiScreenWidget({
     layoutId: "layout",
     viewers:[{
         {container:"leftContainer",options:{
             timeline: true
         }},
         {container:"rightContainer",options:{
             timeline: false
         }}
     }]
 });

 //加载图层
 var viewerleft = multiScreenWidget.getViewerById("leftContainer");
 
 var tdt_img_provider = new Cesium.UrlTemplateImageryProvider({
     url: "http://{s}.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e90d56e5a09d1767899ad45846b0cefd",
     subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7']
 });

 var tdt_img_note_provider = new Cesium.UrlTemplateImageryProvider({
     url: "http://{s}.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=e90d56e5a09d1767899ad45846b0cefd",
     subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7']
 });

 var tdt_img_layer = viewerleft.imageryLayers.addImageryProvider(tdt_img_provider);
 var tdt_img_note_layer = viewerleft.imageryLayers.addImageryProvider(tdt_img_note_provider);

 //加载图层
 var viewerright = multiScreenWidget.getViewerById("rightContainer");
 
 var tdt_vec_provider = new Cesium.UrlTemplateImageryProvider({
     url: "http://{s}.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=e90d56e5a09d1767899ad45846b0cefd",
     subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7']
 });

 var tdt_vec_note_provider = new Cesium.UrlTemplateImageryProvider({
     url: "http://{s}.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=e90d56e5a09d1767899ad45846b0cefd",
     subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7']
 });

 var tdt_vec_layer = viewerright.imageryLayers.addImageryProvider(tdt_vec_provider);
 var tdt_vec_note_layer = viewerright.imageryLayers.addImageryProvider(tdt_vec_note_provider);

 //定位
 viewerleft.camera.flyTo({
     destination: Cesium.Cartesian3.fromDegrees(114.31, 30.52, 500000.0)
 });