fuyuhang
/
Project_yhfu
镜像自地址 http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title data-i18n="resources.title_mapvNyvTaxi"></title>
    <script type="text/javascript" include="jquery,widgets,dat-gui" src="../js/include-web.js"></script>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
<script type="text/javascript" include="mapv" src="../../dist/leaflet/include-leaflet.js"></script>
<script type="text/javascript">
    var map = L.map('map', {
        center: [40.73231, -73.90086],
        zoom: 11,
    });
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";

    L.supermap.tiledMapLayer(url).addTo(map);
    loadData();

    function loadData() {
        widgets.loader.showLoader();
        $.get('../data/nyc-taxi.csv', function (csvstr) {
            widgets.loader.removeLoader();
            var options = {
                size: 1.5,
                context: 'webgl',
                fillStyle: 'rgba(238, 68, 68, 0.8)',
                draw: 'simple'
            };

            var dataSet = mapv.csv.getDataSet(csvstr);
            dataSet.initGeometry();

            var dataAttr = "数据来源<a target='_blank' href='http://www.nyc.gov/html/tlc/html/about/trip_record_data.shtml'>NYC Taxi</a>,";
            var layer = L.supermap.mapVLayer(dataSet, options, {attributionPrefix: dataAttr});

            layer.on('loaded', function () {
                initDatGUI(layer, options)
            });
            layer.addTo(map);

        });

        //设置菜单
        function initDatGUI(layer, options) {
            var gui = new dat.GUI();
            var configDiv = L.DomUtil.create('div');
            configDiv.appendChild(gui.domElement);

            gui.add(options, 'size', 0.1, 10).onFinishChange(finished);
            gui.addColor(options, 'fillStyle').onChange(finished);

            function finished() {
                layer.update({
                    options: options
                });
            }

            var configControl = L.control({position: 'topright'});
            configControl.onAdd = function () {
                return configDiv;
            };
            configControl.addTo(map);
            handleMapEvent(configDiv, map);
        }
    }

    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>