首页 / 浏览问题 / WebGIS / 问题详情
iCilent for leaflet调用iserver矢量瓦片服务点的样式丢失
30EXP 2023年04月06日

使用产品:iserver 11i、iCilent 11i for leaflet

问题详细描述:iCilent for leaflet调用iserver矢量瓦片服务点的样式丢失

利用iserver发布矢量服务预览图是这样的:

加载到地图上却变成了这样,样式丢失了

以下是代码: 

//加载矢量图层
      var vectorUrl = "http://localhost:8090/iserver/services/map-KJDB/rest/maps/%E4%B8%9C%E5%8C%97%E8%99%8E%E8%B1%B9%E5%9B%BD%E5%AE%B6%E5%85%AC%E5%9B%AD%E8%BE%B9%E7%95%8C%E7%82%B9_1%40%E5%8B%98%E7%95%8C%E5%AE%9A%E6%A0%87%E6%88%90%E6%9E%9C";
      //创建一个矢量瓦片图层
      var vectorLayer = new L.supermap.TiledVectorLayer(vectorUrl, {
        cacheEnabled: true,
        returnAttributes: true,
        attribution: "Tile Data©SuperMap iServer with©SuperMap iClient"
      }).addTo(this.map);
      //矢量瓦片图层添加点击事件,设置默认风格
      vectorLayer.on('click', function (evt) {
        var id = evt.layer.properties.id;
        var layerName = evt.layer.layerName;
        // 设置矢量瓦片图层样式
        // var selectStyle = {
        //   fillColor: '#800026',
        //   fillOpacity: 0.5,
        //   stroke: true,
        //   fill: true,
        //   color: 'red',
        //   opacity: 1,
        //   weight: 2
        // };
        vectorLayer.setFeatureStyle(id, layerName);
      });

还有,如果我需要实现点击图上矢量弹出对应属性,应该调用什么接口,有实现的样例么?

1个回答

您好,您的第一个问题,您在数据在iDesktop端是什么样子的呢,点符号具体是什么点符号,svg、栅格还是矢量,

您截图的isever数据样子是isever预览中(with Vector Tile) 矢量预览中的样子吗,如果不是的话其它预览对应的leaflet是TiledMapLayer接口,而不是TiledVectorLayer

您的第二个问题,leaflet目前没有这个业务需求直接的demo,

建议在点击事件中,获取点击对象的id和图层名称的,在地图服务中进行数据查询得到您需要的属性。

希望可以帮助到您。
10,513EXP 2023年04月06日
您好,感谢您的回答。

点符号目前采用的是iDesktop中提供的矢量符号,在iDesktop中就是是iserver预览中的样子,即和图上一致。

我试了一下换成TiledMapLayer接口,可以正常显示了,但无法对其进行选择了
您这份数据使用isever的 (with Vector Tile) 预览正常吗,如果正常的话,您可以把您的工作空间和数据源打包发我这边帮您测试一下看看是什么问题。
...