fuyuhang
/
Project_yhfu
tükrözi: http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title data-i18n="resources.title_animatorCar"></title>
    <script type="text/javascript" include="jquery" src="../js/include-web.js"></script>
    <script type="text/javascript" include="echarts,ol3-echarts" src="../../dist/ol/include-ol.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">
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var map, echartslayer, url = host + "/iserver/services/map-changchun/rest/maps/长春市区图";

    var extent = [48.4, -7668.25, 8958.85, -55.58];
    var projection = new ol.proj.Projection({
        code:'',
        extent: extent,
        units: 'm'
    });
    new ol.supermap.MapService(url).getMapInfo(function (serviceResult) {
        var mapJSONObj = serviceResult.result;
        map = new ol.Map({
            target: 'map',
            controls: ol.control.defaults({attributionOptions: {collapsed: false}})
                .extend([new ol.supermap.control.Logo()]),
            view: new ol.View({
                center: [4700, -3900],
                zoom: 3,
                projection: projection,
                origin: [48.4, -55.58],
                multiWorld: true
            })
        });
        var layer = new ol.layer.Tile({
            source: new ol.source.TileSuperMapRest(ol.source.TileSuperMapRest.optionsFromMapJSON(url, mapJSONObj))
        });
        map.addLayer(layer);

        echartslayer = new ol3Echarts(null, {
            hideOnMoving: true,
            hideOnZooming: true,
            //平面无投影坐标系不进行转换，绘制是不可转为其他投影坐标故设置此参数
            source: projection,
            destination: projection
        });
        echartslayer.appendTo(map);
        queryData();
    });

    function queryData() {
        var param = new SuperMap.QueryBySQLParameters({
            queryParams: {
                name: "BusLine@Changchun#1",
                attributeFilter: "SmID > 0"
            }
        });
        new ol.supermap.QueryService(url).queryBySQL(param, function (serviceResult) {
            addlayers(processData(serviceResult.result.recordsets[0].features.features));
        });

        function processData(features) {
            var busLines = [].concat.apply([], features.map(function (busLine) {
                var points = busLine.geometry.coordinates;
                return {
                    coords: points,
                    effect: {
                        constantSpeed: 60,
                        show: true,
                        trailLength: 0,
                        symbolSize: 30,
                        symbol: function () {
                            if ((Math.round(Math.random() * 2) % 2)) {
                                return 'image://../classic/images/blueCar.png'
                            } else {
                                return 'image://../classic/images/redCar.png'
                            }
                        }()
                    },
                };
            }));

            return busLines;
        }
    }

    function addlayers(busLines) {
        var option = {
            series: [{
                type: 'lines',
                polyline: true,
                data: busLines,
                silent: true,
                lineStyle: {
                    normal: {
                        opacity: 1,
                        width: 1,
                        color: '#000'
                    }
                },
                progressiveThreshold: 500,
                progressive: 200,
                zlevel: 2
            },
                {
                    type: 'lines',
                    polyline: true,
                    data: busLines,
                    lineStyle: {
                        normal: {
                            width: 0
                        }
                    },
                    effect: {
                        constantSpeed: 60,
                        show: true,
                        trailLength: 0,
                        symbolSize: 30,
                    },
                    zlevel: 1
                }]
        };
        echartslayer.setChartOptions(option);
    }

</script>
</body>
</html>