fuyuhang
/
Project_yhfu
mirror of http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7,IE=9,IE=10,IE=11"/>
    <title data-i18n="resources.title_printscreen"></title>
    <style type="text/css">
        .editPane {
            position: absolute;
            right: 180px;
            top: 10px;
            text-align: center;
            background: #FFF;
            z-index: 1000;
        }
    </style>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div class='panel panel-primary editPane' id='editPane' style="z-index: 99999">
    <div class='panel-heading'>
        <h5 class='panel-title text-center' data-i18n="resources.text_printscreen"></h5>
    </div>
    <div class='panel-body' id='params'>
        <p></p>
        <div align='right' class='button-group'>
            <input type='button' id='btn1' class='btn btn-primary' data-i18n="[value]resources.btn_marker" onclick="createMarker()"/>
            <input type='button' id='btn2' class='btn btn-primary' data-i18n="[value]resources.btn_printscreen" onclick="mapToImg1()"/>
            <input type='button' id='btn3' class='btn btn-primary' data-i18n="[value]resources.text_input_value_clear" onclick="clearAllFeatures()"/>
        </div>
    </div>
</div>
<div id="map" style="position: relative;height: 100%;"></div>
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
<script type="text/javascript" exclude="iclient-classic" include="MapToImg" src="../../dist/classic/include-classic.js"></script>
<script type="text/javascript">
    var map, layer, markerLayer;
    var host = window.isLocal ? window.server : "https://iserver.supermap.io",
        smCompanyArr = [
            ["北京超图软件股份有限公司上海分公司", 13522414.5106, 3662690.3875, "上海市闸北虬江路1000号聚源大厦办公楼1505室"],
            ["北京超图软件股份有限公司广州分公司", 12608758.6677, 2647887.5456, "广州市体育西路109号高盛大厦9楼G单元"],
            ["北京超图软件股份有限公司成都分公司", 11584664.2393, 3588559.6862, "成都市高新区天府大道中段1268号天府软件园E区"],
            ["北京超图软件股份有限公司杭州分公司", 13375617.5430, 3538667.9064, "杭州市天目山路159号现代国际大厦A座"],
            ["北京超图软件股份有限公司西安分公司", 12127616.0783, 4064501.0071, "西安高新区丈八一路一号 汇鑫IBC（A座）"],
            ["北京超图软件股份有限公司长沙分公司", 12573006.2587, 3277897.5105, "长沙市芙蓉中路二段359号佳天国际新城北栋8H"],
            ["北京超图软件股份有限公司沈阳分公司", 13740261.8165, 5131821.5120, "沈阳市沈河区市府大路262甲号新华科技大厦"]
        ],
        url = host + "/iserver/services/map-china400/rest/maps/China";

    //定义layer图层，TiledDynamicRESTLayer：分块动态 REST 图层
    layer = new SuperMap.Layer.TiledDynamicRESTLayer("China", url, {
        transparent: true,
        cacheEnabled: true
    }, {maxResolution: "auto", useCanvas: false, useCORS: true});
    //为图层初始化完毕添加addLayer()事件
    layer.events.on({"layerInitialized": addLayer});
    map = new SuperMap.Map("map", {
        controls: [
            new SuperMap.Control.LayerSwitcher(),
            new SuperMap.Control.OverviewMap(),
            new SuperMap.Control.ScaleLine(),
            new SuperMap.Control.Zoom(),
            new SuperMap.Control.Navigation({
                dragPanOptions: {
                    enableKinetic: true
                }
            })
        ]
    });
    markerLayer = new SuperMap.Layer.Markers("Markers");

    function addLayer() {
        map.addLayers([layer, markerLayer]);
        map.setCenter(new SuperMap.LonLat(9733502.481499, 4614406.969325), 4);
    }

    //移除整个图层要素
    function clearAllFeatures() {
        markerLayer.clearMarkers();
        if (map.popups.length != 0) {
            var i = 0, lengthPopup = map.popups.length;
            while (i < lengthPopup) {
                map.removePopup(map.popups[0]);
                i++;
            }
        }
    }

    //添加标注
    function createMarker() {
        markerLayer.clearMarkers();
        for (var i = 0, lengthCompany = smCompanyArr.length; i < lengthCompany; i++) {
            var point = new SuperMap.Geometry.Point(parseFloat(smCompanyArr[i][1]), parseFloat(smCompanyArr[i][2])),
                strContent = new Array(smCompanyArr[i][0], smCompanyArr[i][3]),
                size = new SuperMap.Size(32, 32),
                offset = new SuperMap.Pixel(-(size.w / 2), -size.h),
                feature = new SuperMap.Feature(markerLayer, new SuperMap.LonLat(point.x, point.y));
            feature.data.icon = new SuperMap.Icon("images/markerflag.png", size, offset);
            var marker = feature.createMarker();
            var markerClick = function (evt, feature, strContent) {
                SuperMap.Event.stop(evt);
                this.win.open(feature, {
                    "name": strContent[0],
                    "informition": strContent[1]
                });
            };
            marker.events.register("click", feature, function (feature, strContent) {
                return function (evt) {
                    markerClick(evt, feature, strContent);
                }
            }(feature, strContent));
            markerLayer.addMarker(marker);
        }
    }

    this.win = new InforWindow_z({"map": map});
    function InforWindow_z(param) {
        var t = this;
        t.infowin = null;
        t.map = null;
        t.init = function (param) {
            for (var key in param) {
                t[key] = param[key];
            }
        }
        t.open = function (feature, data) {
            t.close();
            t.create(feature, data);
        }
        t.create = function (feature, data) {
            var contentHTML = "<div style='font-size:.8em; opacity: 0.8; overflow-y:hidden;'>" +
                "<span style='font-weight: bold; font-size: 18px;'>"+resources.text_detailedInfo+"</span><br>";
            contentHTML += resources.text_companyName + data.name + "<br>";
            contentHTML += resources.text_companyAddress + data.informition + "</div>";
            //初始化一个弹出窗口，当某个地图要素被选中时会弹出此窗口，用来显示选中地图要素的属性信息
            var popup = new SuperMap.Popup.FramedCloud("chicken",
                feature.marker.lonlat,
                null,
                contentHTML,
                null,
                true);
            feature.popup = popup;
            map.addPopup(popup);
            t.infowin = popup;
        }
        t.close = function () {
            if (t.infowin) {
                try {
                    t.infowin.hide();
                    t.infowin.destroy();
                }
                catch (e) {
                }
            }
        }
        t.init(param);
    }

    function mapToImg1() {
        MapToImg && MapToImg.excute(map);
    }

</script>

</body>
</html>