fuyuhang
/
Project_yhfu
огледало от http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title data-i18n="resources.title_dynamicSegmentation"></title>
    <style type="text/css">
        body {
            margin: 0;
            overflow: hidden;
            background: #fff;
            width: 100%;
            height: 100%
        }

        #map {
            position: absolute;
            width: 100%;
            height: 100%;
        }

        #toolbar {
            position: absolute;
            top: 50px;
            right: 10px;
            text-align: center;
            z-index: 100;
            border-radius: 4px;
        }
    </style>
</head>
<body>
<div id="toolbar" class="panel panel-primary">
    <div class='panel-heading'>
        <h5 class='panel-title text-center' data-i18n="resources.text_dynamicSegmentation"></h5></div>
    <div class='panel-body content'>
        <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_dynamicSegmentation" onclick="GenerateSpatialData()"/>&nbsp;
        <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_clear" onclick="clearThemeLayer()"/>
    </div>
</div>
<div id="map"></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>
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var map, layer, themeLayer,
        url = host + "/iserver/services/map-changchun/rest/maps/长春市区图",
        url2 = host + "/iserver/services/spatialanalyst-changchun/restjsr/spatialanalyst";

    init();

    function init() {
        layer = new SuperMap.Layer.TiledDynamicRESTLayer("changchun", url, {
            transparent: true,
            cacheEnabled: true
        }, {maxResolution: "auto"});
        layer.events.on({"layerInitialized": addLayer});
        map = new SuperMap.Map("map", {
            allOverlays: true, controls: [
                new SuperMap.Control.ScaleLine(),
                new SuperMap.Control.Zoom(),
                new SuperMap.Control.Navigation({
                    dragPanOptions: {
                        enableKinetic: true
                    }
                })]
        });
        map.addControl(new SuperMap.Control.LayerSwitcher(), new SuperMap.Pixel(42, 80));
    }

    function addLayer() {
        map.addLayers([layer]);
        map.setCenter(new SuperMap.LonLat(4503.6240321526, -3861.911472192499), 1);
    }

    //生成动态分段
    function GenerateSpatialData() {
        widgets.alert.clearAlert();
        clearThemeLayer();

        //配置数据返回Option
        var option = new SuperMap.REST.DataReturnOption({
                expectCount: 1000,
                dataset: "generateSpatialData@Changchun",
                deleteExistResultDataset: true,
                dataReturnMode: SuperMap.REST.DataReturnMode.DATASET_ONLY
            }),
            //配置动态分段Parameters
            parameters = new SuperMap.REST.GenerateSpatialDataParameters({
                routeTable: "RouteDT_road@Changchun",
                routeIDField: "RouteID",
                eventTable: "LinearEventTabDT@Changchun",
                eventRouteIDField: "RouteID",
                measureField: "",
                measureStartField: "LineMeasureFrom",
                measureEndField: "LineMeasureTo",
                measureOffsetField: "",
                errorInfoField: "",
                dataReturnOption: option
            }),
            //配置动态分段iService
            iService = new SuperMap.REST.GenerateSpatialDataService(url2, {
                eventListeners: {
                    processCompleted: generateCompleted,
                    processFailed: generateFailded
                }
            });

        //execute
        iService.processAsync(parameters);

        //completed
        function generateCompleted(generateSpatialDataEventArgs) {
            //配置专题样式
            var style1, style2, style3;
            style1 = new SuperMap.REST.ServerStyle({
                fillForeColor: new SuperMap.REST.ServerColor(242, 48, 48),
                lineColor: new SuperMap.REST.ServerColor(242, 48, 48),
                lineWidth: 1
            });
            style2 = new SuperMap.REST.ServerStyle({
                fillForeColor: new SuperMap.REST.ServerColor(255, 159, 25),
                lineColor: new SuperMap.REST.ServerColor(255, 159, 25),
                lineWidth: 1
            });
            style3 = new SuperMap.REST.ServerStyle({
                fillForeColor: new SuperMap.REST.ServerColor(91, 195, 69),
                lineColor: new SuperMap.REST.ServerColor(91, 195, 69),
                lineWidth: 1
            });

            //配置专题项
            var themeUniqueIteme1, themeUniqueIteme2, themeUniqueIteme3;
            themeUniqueIteme1 = new SuperMap.REST.ThemeUniqueItem({
                unique: "拥挤",
                style: style1
            });
            themeUniqueIteme2 = new SuperMap.REST.ThemeUniqueItem({
                unique: "缓行",
                style: style2
            });
            themeUniqueIteme3 = new SuperMap.REST.ThemeUniqueItem({
                unique: "畅通",
                style: style3
            });
            var themeUniqueItemes = [themeUniqueIteme1, themeUniqueIteme2, themeUniqueIteme3];

            var themeUnique = new SuperMap.REST.ThemeUnique({
                uniqueExpression: "TrafficStatus",
                items: themeUniqueItemes,
                defaultStyle: new SuperMap.REST.ServerStyle({
                    fillForeColor: new SuperMap.REST.ServerColor(48, 89, 14),
                    lineColor: new SuperMap.REST.ServerColor(48, 89, 14)
                })
            });

            var themeParameters = new SuperMap.REST.ThemeParameters({
                themes: [themeUnique],
                datasetNames: ["generateSpatialData"],
                dataSourceNames: ["Changchun"],
                types: ['REGION']
            });

            var themeService = new SuperMap.REST.ThemeService(url, {
                eventListeners: {
                    processCompleted: themeCompleted,
                    processFailed: themeFailed
                }
            });

            themeService.processAsync(themeParameters);

            function themeCompleted(themeEventArgs) {
                if (themeEventArgs.result.resourceInfo.id) {
                    themeLayer = new SuperMap.Layer.TiledDynamicRESTLayer("道路交通状况_专题图", url, {
                        cacheEnabled: false,
                        transparent: true,
                        layersID: themeEventArgs.result.resourceInfo.id
                    }, {"maxResolution": "auto"});
                    themeLayer.events.on({"layerInitialized": addThemeLayer});
                }
            }

            function addThemeLayer() {
                map.addLayer(themeLayer);
            }

            function themeFailed(e) {
                widgets.alert.showAlert(e.error.errorMsg,false);
            }
        }

        //failed
        function generateFailded(e) {
            widgets.alert.showAlert(e.error.errorMsg,false);
        }
    }

    //移除专题图层
    function clearThemeLayer() {
        widgets.alert.clearAlert();
        if (themeLayer) {
            map.removeLayer(themeLayer, true);
            themeLayer = null;
        }
    }

</script>

</body>
</html>