首页 / 浏览问题 / 云GIS / 问题详情
点击地图中的标记出现弹框中关于标记的信息数据从哪里获取
2EXP 2018年06月21日
使用产品:iClient 9D for JavaScript    操作系统:win10  ×64

数据类型:(不知道怎么给地图添加数据)

问题详细描述:1,、地图中的一些数据怎么添加?比如地图中有一个大厦的标记,点击标记获取大厦的详细信息(建造日期,楼层数等等),这些是怎么添加到地图的,使用javascript怎么获取?

2、怎么添加标记,点击并出现弹框

1个回答

您好,1.大厦的详细信息(建造日期,楼层数等等)是你的底图数据(后台数据),详细信息需要通过查询功能得到,标记是前端添加的,点击标记获取信息其实是获取的查询结果;

2.这个官网上有范例,http://iclient.supermap.io/examples/classic/editor.html#overlay_vectorDataEvent

说的这个功能我这刚好有个demo,用的是范例数据world,你可以参考下,代码如下:

    <script type="text/javascript">
        var map, layer, vectorLayer, infowin = null;
        style = {
            fillColor: "red",
            strokeColor: "yellow",
            pointRadius: 7
        },
            host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host,
            url1 = host + "/iserver/services/map-world/rest/maps/World";
        url2 = host + "/iserver/services/data-world/rest/data";
        function init() {
            map = new SuperMap.Map("map", {
                controls: [
                    new SuperMap.Control.LayerSwitcher(),
                    new SuperMap.Control.ScaleLine(),
                    new SuperMap.Control.Zoom(),
                    new SuperMap.Control.Navigation({
                        dragPanOptions: {
                            enableKinetic: true
                        }
                    })]
            });
            layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url1, { transparent: true, cacheEnabled: true }, { maxResolution: "auto" });
            layer.events.on({ "layerInitialized": addLayer });
            vectorLayer = new SuperMap.Layer.Vector("Vector Layer");
            var callbacks = {
                click: function (currentFeature) {
                    closeInfoWin();
                    var newHtml = currentFeature.data.CAPITAL;
                    var popup = new SuperMap.Popup.FramedCloud("popwin",
                        new SuperMap.LonLat(currentFeature.geometry.x, currentFeature.geometry.y),
                        null,
                        newHtml,
                        null,
                        true);
                    infowin = popup;
                    map.addPopup(popup);
                }
            };
            var selectFeature = new SuperMap.Control.SelectFeature(vectorLayer,
                {
                    callbacks: callbacks
                });
            map.addControl(selectFeature);
            selectFeature.activate();

        }

        function addLayer() {
            map.addLayers([layer, vectorLayer]);
            map.setCenter(new SuperMap.LonLat(0, 0), 0);
        }

        function clearFeatures() {
            vectorLayer.removeAllFeatures();
            vectorLayer.refresh();
            closeInfoWin();
        }

        function closeInfoWin() {
            if (infowin) {
                try {
                    infowin.hide();
                    infowin.destroy();
                }
                catch (e) { }
            }
        }

        function getFeaturesByBounds() {
            var bounds = map.getExtent();
            vectorLayer.removeAllFeatures();
            var GetFeaturesByBoundsParameters, getFeaturesByGeometryService;
            GetFeaturesByBoundsParameters = new SuperMap.REST.GetFeaturesByBoundsParameters({
                datasetNames: ["World:Capitals"],
                spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT,
                bounds: bounds,
                toIndex: -1
            });
            getFeaturesByGeometryService = new SuperMap.REST.GetFeaturesByBoundsService(url2, {
                eventListeners: {
                    "processCompleted": processCompleted,
                    "processFailed": processFailed
                }
            });
            getFeaturesByGeometryService.processAsync(GetFeaturesByBoundsParameters);
        }
        function processCompleted(getFeaturesEventArgs) {
            var i, len, features, result = getFeaturesEventArgs.result;
            if (result && result.features) {
                features = result.features;
                for (i = 0, len = features.length; i < len; i++) {
                    feature = features[i];
                    feature.style = style;
                    vectorLayer.addFeatures(feature);
                }
            }

        }
        function processFailed(e) {
            alert(e.error.errorMsg);
        }
    </script>

4,524EXP 2018年06月21日

您好,非常感谢你的指导,但我还是有两个疑问,

1,您说大厦的详细信息(建造日期,楼层数等等)是你的底图数据(后台数据),请问这个底图数据是怎么使用呢?类似于调用像host+/iserver/services/data-world/rest/data这样的接口吗?还有后台数据是怎么制作呢,是不是用客户端idesktop连接数据源?

2,您上面的demo我复制用了一下,一直报错,这是什么原因呢?(如下图)

非常感谢您的回答

1.底图数据是你在idesktop中制作并保存工作空间的数据,用iserver发布工作空间,你的iclient客户端才能调用地图服务、数据服务(url)等从而进行地图显示、数据增删查改等功能实现;

2.supermap库没引用到。
非常感谢您!
...