fuyuhang
/
Project_yhfu
kopia lustrzana http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <script type="text/javascript" include="mapv" src="../../dist/ol/include-ol.js"></script>
    <title data-i18n="resources.title_mapvNyvTaxi"></title>
    <style type="text/css">
        .ol-popup {
            position: absolute;
            top: 10px;
            right: 10px;
        }
    </style>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%; position: absolute;top: 0;">
<div id="popup" class="ol-popup" style='width:20%'>
</div>
<div id="map" style="width: 100%;height:100%"></div>
<script type="text/javascript" include="jquery,widgets,dat-gui" src="../js/include-web.js"></script>
<script type="text/javascript">
    var map = new ol.Map({
        target: 'map',
        controls: ol.control.defaults({attributionOptions: {collapsed: false}})
            .extend([new ol.supermap.control.Logo()]),
        view: new ol.View({
            center: ol.proj.transform([-73.931577, 40.745654], 'EPSG:4326', 'EPSG:3857'),
            zoom: 11,
            projection: 'EPSG:3857',
            multiWorld: true
        })
    });

    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
    map.addLayer(new ol.layer.Tile({
        source: new ol.source.TileSuperMapRest({
            url: url,
            attributions: "Map Data © <a href='https://www.supermapol.com/' target='_blank'> SuperMap Online</a>"
        })
    }));
    widgets.loader.showLoader();
    $.get('../data/nyc-taxi.csv', function (csvstr) {
        widgets.loader.removeLoader();
        var dataSet = mapv.csv.getDataSet(csvstr);

        dataSet.initGeometry(function (data) {
            data = {
                type: 'Point',
                coordinates: ol.proj.transform([parseFloat(data.lng), parseFloat(data.lat)], 'EPSG:4326', 'EPSG:3857')
            };
            return data;
        });

        dataSet.initGeometry();
        var mapvOptions = {
            size: 1.5,
            context: 'webgl',
            fillStyle: 'rgba(250, 50, 50, 0.8)',
            draw: 'simple'
        };
        var options = {
            map: map, dataSet: dataSet, mapvOptions: mapvOptions, attributions: resources.text_dataSources + "<a href='https://www1.nyc.gov/site/tlc/about/tlc-trip-record-data.page' target='_blank'>NYCTaxi(" + resources.text_NYTaxiCarPoint + ")</a>  © 2018 " + resources.title_3baidu + " MapV with <span>© <a href='https://iclient.supermap.io' target='_blank'>SuperMap iClient</a></span>"
        };
        var layer = new ol.layer.Image({
            source: new ol.source.Mapv(options)
        });
        initDatGUI(layer, mapvOptions);
        map.addLayer(layer);
    });

    //设置菜单
    function initDatGUI(layer, options) {
        var gui = new dat.GUI();
        var popup = document.getElementById('popup');
        popup.appendChild(gui.domElement);
        gui.add(options, 'size', 0.1, 10).onFinishChange(finished);
        gui.addColor(options, 'fillStyle').onChange(finished);

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

        var control = new ol.control.Control({element: popup});
        control.setMap(map);
        map.addControl(control);
    }
</script>
</body>
</html>