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


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title data-i18n="resources.title_featureRightClick"></title>
    <style type="text/css">
        .editPane {
            position: absolute;
            right: 50px;
            top: 50px;
            text-align: center;
            background: #FFF;
            z-index: 1000;
        }

        #myMenu {
            position: absolute;
            background-color: silver;
            visibility: hidden;
        }

        ul {
            list-style-type: none;
            width: 112px;
        }

        #myMenu ul {
            float: left;
            border: 1px solid #979797;
            background: #f1f1f1 url(./images/line.png) 36px 0 repeat-y;
            padding: 2px;
            box-shadow: 2px 2px 2px rgba(0, 0, 0, .6);
        }

        #myMenu ul li {
            width: 112px;
            float: left;
            clear: both;
            height: 35px;
            cursor: pointer;
            line-height: 32px;
        }

        #myMenu ul li:hover {
            background-color: #CAE1FF;
        }
    </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_featureRightClick"></h5>
    </div>
    <div class='panel-body' id='params'>
        <p></p>
        <div align='center' class='button-group'>
            <input type='button' id='btn1' class='btn btn-primary' data-i18n="[value]resources.text_input_value_addData"
                   onclick="addData()"/>
        </div>
    </div>
</div>

<div id="map" style="margin:0 auto;width: 100%;height: 100%; position: relative;"></div>
<div id="myMenu">
    <ul style="margin-top: 0px; margin-bottom: 0px;margin-left: 0px">
        <li onclick="setCenter()">
            <div style="float:left;padding-right: 5px;width:30px;height:30px"><img src="./images/center.png"/></div>
            <div data-i18n="resources.text_mediacy"
                 style="float:left;width:52px;height:30px;  text-align: center; font-size: 15px;">
            </div>
        </li>
        <li onclick="deleteSelect()">
            <div style="float:left;padding-right: 5px;width:30px;height:30px"><img src="./images/delete.png"/></div>
            <div data-i18n="resources.text_input_value_delete"
                 style="float:left;width:52px;height:30px;  text-align: center; font-size: 15px;">
            </div>
        </li>
        </li>
    </ul>
</div>

<script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
<script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
<script type="text/javascript">
    var map, layer, vectorLayer, gFeature, pointVector,
        host = window.isLocal ? window.server : "https://iserver.supermap.io",
        url = host + "/iserver/services/map-world/rest/maps/World";

    function init() {
        var broz = SuperMap.Util.getBrowser();
        if (broz.device === 'android' || broz.device === 'apple') {
            widgets.alert.showAlert(resopurces.msg_supportEquipment, false);
            return;
        }
        map = new SuperMap.Map("map", {
            eventListeners: {
                "movestart": function () {
                    menu.style.visibility = "hidden";
                },
                "click": function () {
                    menu.style.visibility = "hidden";
                }
            }
        });
        layer = new SuperMap.Layer.TiledDynamicRESTLayer("world", url, {
            transparent: true,
            cacheEnabled: true
        }, {maxResolution: "auto"});
        layer.events.on({"layerInitialized": addLayer});
        vectorLayer = new SuperMap.Layer.Vector("vectorlayer");
        var callbacks = {
            rightclick: creatMenu
        };
        var selectFeature = new SuperMap.Control.SelectFeature(vectorLayer,
            {
                callbacks: callbacks
            });
        map.addControl(selectFeature);
        selectFeature.activate();
    }

    $(document).ready(function () {
        init();
    });

    function addLayer() {
        map.addLayers([layer, vectorLayer]);
        map.setCenter(new SuperMap.LonLat(0, 0), 0);
    }

    //创建EventUtil对象
    var EventUtil = {
        addHandler: function (element, type, handler) {
            if (element.addEventListener) {
                element.addEventListener(type, handler, false);
            }
            else if (element.attachEvent) {
                element.attachEvent("on" + type, handler);
            }
        },
        getEvent: function (event) {
            return event ? event : window.event;
        },
        //取消事件的默认行为
        preventDefault: function (event) {
            if (event.preventDefault) {
                event.preventDefault();
            } else {
                event.returnValue = false;
            }
        }
    };
    EventUtil.addHandler(window, "load", function (event) {
        menu = document.getElementById("myMenu");
        EventUtil.addHandler(myMenu, "contextmenu", function (event) {
            event = EventUtil.getEvent(event);
            EventUtil.preventDefault(event);
            menu.style.visibility = "visible";
        });
        EventUtil.addHandler(document, "click", function (event) {
            menu.style.visibility = "hidden";
        });
    });

    function creatMenu(currentFeature) {
        var centerPoint = currentFeature.geometry.getCentroid();
        var pos = new SuperMap.LonLat(centerPoint.x, centerPoint.y);
        var p = map.getPixelFromLonLat(pos);
        menu.style.left = p.x + "px";
        menu.style.top = p.y + 50 + "px";
        menu.style.visibility = "visible";
        gFeature = currentFeature;

    }

    function addData() {
        vectorLayer.removeFeatures(pointVector);
        //点
        var point = new SuperMap.Geometry.Point(0, 0);
        pointVector = new SuperMap.Feature.Vector(point);
        pointVector.style = {
            fillColor: "red",
            strokeColor: "yellow",
            pointRadius: 10
        };
        vectorLayer.addFeatures([pointVector]);
        widgets.alert.showAlert(resources.msg_rightClick, true);
    }

    function setCenter() {
        var centerP = gFeature.geometry.getCentroid();
        menu.style.visibility = "hidden";
        map.setCenter(new SuperMap.LonLat(centerP.x, centerP.y), 0);
    }

    function deleteSelect() {
        menu.style.visibility = "hidden";
        vectorLayer.removeFeatures(gFeature);
        widgets.alert.clearAlert();
    }
</script>
</body>
</html>