fuyuhang
/
Project_yhfu
miroir de 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_addressMatchService"></title>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div id="map" style="width: 100%;height:100%"></div>
<script type="text/javascript" include="bootstrap-css,jquery" src="../js/include-web.js"></script>
<script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
<script type="text/javascript">
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var map, codeMarkers = [], decodeMarkers = [],
        url = host + "/iserver/services/map-china400/rest/maps/China_4326",
        addressUrl = host + "/iserver/services/addressmatch-Address/restjsr/v1/address",
        addressMatchService = L.supermap.addressMatchService(addressUrl);
    map = L.map('map', {
        crs: L.CRS.EPSG4326,
        center: [39.914714, 116.383572],
        maxZoom: 18,
        zoom: 11
    });
    L.supermap.tiledMapLayer(url).addTo(map);
    var control = L.control({position: 'topright'});
    control.onAdd = function () {
        var popup = L.DomUtil.create('div');
        popup.style.width = '350px';
        popup.innerHTML = "<div class='panel panel-default'>" +
            "<div class='panel-body'>" +
            "<ul class='nav nav-tabs nav-justified'>" +
            "<li id='geocode' role='presentation' class='active'><a href='#'>" + resources.text_code + "</a></li>" +
            "<li id='geodecode' role='presentation'><a href='#'>" + resources.text_decode + "</a></li>" +
            "</ul><p>" +
            "<div class='tab-content'>" +
            "<div id='geocodeParam' role='tabpanel' class='tab-pane deplistContent active'>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_address + "</span>" +
            "<input id='address' type='text' class='form-control' placeholder='超图软件'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_filterField + "　</span>" +
            "<input id='filters' type='text' class='form-control' placeholder='北京市,朝阳区'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_minIndex + "</span>" +
            "<input id='fromIndex' type='text' class='form-control' placeholder='0'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_maxIndex + "</span>" +
            "<input id='toIndex' type='text' class='form-control' placeholder='10'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_maxCount + "</span>" +
            "<input id='maxReturn' type='text' class='form-control' placeholder='-1'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_coorSystem + "</span>" +
            "<input id='prjCoordSys' type='text' class='form-control' placeholder='{epsgcode:4326}'/>" +
            "</div><p>" +
            "<div align='right'>" +
            "<input type='button' id='codeBtn' class='btn btn-primary' value='" + resources.btn_input_value_match + "'/>" +
            "</div></div>" +
            "<div id='geodecodeParam' role='tabpanel' class='tab-pane deplistContent'>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_abscissa + "</span>" +
            "<input id='xCoord' type='text' class='form-control' placeholder='116.3518541194752'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_ordinate + "　</span>" +
            "<input id='yCoord' type='text' class='form-control' placeholder='40.00097839595237'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_filterField + "</span>" +
            "<input id='filters2' type='text' class='form-control' placeholder=''/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_minIndex + "</span>" +
            "<input id='fromIndex2' type='text' class='form-control' placeholder='0'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_maxIndex + "</span>" +
            "<input id='toIndex2' type='text' class='form-control' placeholder='10'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_maxCount + "</span>" +
            "<input id='maxReturn2' type='text' class='form-control' placeholder='-1'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_queryRadius + "</span>" +
            "<input id='geoDecodingRadius' type='text' class='form-control' placeholder='-1'/>" +
            "</div><p>" +
            "<div class='input-group'>" +
            "<span class='input-group-addon'>" + resources.text_coorSystem + "</span>" +
            "<input id='prjCoordSys2' type='text' class='form-control' placeholder='{epsgcode:4326}'/>" +
            "</div><p>" +
            "<div align='right'>" +
            "<input type='button' id='decodeBtn' class='btn btn-primary' value='" + resources.btn_input_value_match + "'/>" +
            "</div></div></div>";
        handleMapEvent(popup, this._map);
        return popup;
    };
    control.addTo(map);

    $("#geocode").click(function () {
        $("#geocode")[0].className = 'active';
        $("#geodecode")[0].className = '';
        $("#geocodeParam").addClass('active');
        $("#geodecodeParam").removeClass('active');
    });
    $("#geodecode").click(function () {
        $("#geocode")[0].className = '';
        $("#geodecode")[0].className = 'active';
        $("#geodecodeParam").addClass('active');
        $("#geocodeParam").removeClass('active');
    });

    //判断输入字符串是否为空或者全部都是空格
    function isNull(str) {
        if (str == "") return true;
        var regu = "^[ ]+$";
        var re = new RegExp(regu);
        return re.test(str);
    }
    $("#codeBtn").click(function () {
        var geoCodeParam = new SuperMap.GeoCodingParameter({
            address: $('#address').val() || $('#address').attr('placeholder'),
            fromIndex: $('#fromIndex').val() || $('#fromIndex').attr('placeholder'),
            toIndex: $('#toIndex').val() || $('#toIndex').attr('placeholder'),
            filters: $('#filters').val() || $('#filters').attr('placeholder'),
            prjCoordSys: $('#prjCoordSys').val() || $('#prjCoordSys').attr('placeholder'),
            maxReturn: $('#maxReturn').val() || $('#maxReturn').attr('placeholder')
        });
        addressMatchService.code(geoCodeParam, match);
    });
    $("#decodeBtn").click(function () {
        var geoDecodeParam = new SuperMap.GeoDecodingParameter({
            x: $('#xCoord').val() || $('#xCoord').attr('placeholder'),
            y: $('#yCoord').val() || $('#yCoord').attr('placeholder'),
            fromIndex: $('#fromIndex2').val() || $('#fromIndex2').attr('placeholder'),
            toIndex: $('#toIndex2').val() || $('#toIndex2').attr('placeholder'),
            filters: $('#filters2').val() || $('#filters2').attr('placeholder'),
            prjCoordSys: $('#prjCoordSys2').val() || $('#prjCoordSys2').attr('placeholder'),
            maxReturn: $('#maxReturn2').val() || $('#maxReturn2').attr('placeholder'),
            geoDecodingRadius: $('#geoDecodingRadius').val() || $('#geoDecodingRadius').attr('placeholder'),
        });
        addressMatchService.decode(geoDecodeParam, match);
    });

    function match(obj) {
        clearMarkers();
        obj.result.map(function (item) {
            var marker = L.marker([item.location.y, item.location.x]);
            decodeMarkers.push(marker);
            var innerHTML = "";
            innerHTML += resources.text_address + ":" + item.address + "<br>";
            var x = Number(item.location.x.toString().match(/^\d+(?:\.\d{0,2})?/));
            var y = Number(item.location.y.toString().match(/^\d+(?:\.\d{0,2})?/));
            innerHTML += resources.text_coordinate + ":[" + x + "," + y + "]<br>";
            if (item.score > 0) {
                innerHTML += resources.text_matchDegree + ":" + item.score + "<br>";
            }
            innerHTML += resources.text_filterField + ":" + item.filters + "<br>";
            marker.bindPopup(innerHTML);
        });
        for (var i = 0; i < decodeMarkers.length; i++) {
            decodeMarkers[i].addTo(map);
        }
        map.setView(L.latLng(39.914714, 116.383572), 10);
    }

    function clearMarkers() {
        if (codeMarkers) {
            for (var i = 0; i < codeMarkers.length; i++) {
                codeMarkers[i].remove();
            }
        }
        if (decodeMarkers) {
            for (var i = 0; i < decodeMarkers.length; i++) {
                decodeMarkers[i].remove();
            }
        }
        codeMarkers = [];
        decodeMarkers = [];
    }

    function handleMapEvent(div, map) {
        if (!div || !map) {
            return;
        }
        div.addEventListener('mouseover', function () {
            map.dragging.disable();
            map.scrollWheelZoom.disable();
            map.doubleClickZoom.disable();
        });
        div.addEventListener('mouseout', function () {
            map.dragging.enable();
            map.scrollWheelZoom.enable();
            map.doubleClickZoom.enable();
        });
    }
</script>
</body>
</html>