Question

使用产品:iClient 9D for JavaScript    操作系统：win10  ×64

数据类型：（不知道怎么给地图添加数据）

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

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

Answer 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>

Comments

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

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

2，您上面的demo我复制用了一下，一直报错，这是什么原因呢？（如下图）

非常感谢您的回答

---

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

2.supermap库没引用到。

---

非常感谢您！