logo标签列表

OpenLayers矢量图层中特征标签的z-order排序

javascriptgisopenlayers
3
编辑: 我已经在GitHub上提交了一个错误报告：https://github.com/openlayers/ol2/issues/1167 我正在使用OpenLayers开展项目，但由于缺乏良好的文档，我的经验非常痛苦。我遵循了这里的示例http://dev.openlayers.org/releases/OpenLayers-2.13.1/examples/ordering.html 来在地图上创建具有z-ordering的图标。然而，我还使用了这里的技术变体http://openlayers.org/dev/examples/vector-features-with-text.html来为向量创建标签。不幸的是，当OpenLayers绘制标签时，它似乎不遵守z-ordering属性。
请注意，绿色图标在灰色图标上方（正确），但绿色标签在灰色标签下方（不正确）。是否有解决此问题的方法？
以下是图层的代码：
    this.vehicleLayer = new OpenLayers.Layer.Vector("vehicles", {
        // The zIndex is taken from the zIndex attribute of the features
        styleMap: new OpenLayers.StyleMap({ 'default': {
            graphicZIndex: "${zIndex}"
        }}),
        // enable the indexer by setting zIndexing to true
        rendererOptions: {zIndexing: true}
    });

这是关于图标的代码:

这是我的图标代码:

    iconPrefix = mapView.iconProvider.prefixMapping(vehicle.get('icon'));
    imgUrl = mapView.iconProvider.getIconURL(iconPrefix, trackingStatus, position.get('track'));

    //Vehicle icon
    this.marker = new OpenLayers.Feature.Vector(point, null, {
        'graphicZIndex': this.zIndexState[trackingStatus],
        'externalGraphic': imgUrl,
        'pointRadius': 8,
        'cursor': 'pointer',
        'clickable': true,
        'title': label_text
    });

    this.marker.attributes = {
        'vehicleMapView': this
    };

    //tail label
    if (App.Settings.get('labels')) {
        this.marker.style = _.extend(this.marker.style, {
            pointerEvents: "visiblePainted",
            label: label_text,
            fontColor: trackingStatus !== 'inactive' ? "#222222" : "white",
            fontSize: "12px",
            fontFamily: "Courier New, monospace",
            fontWeight: "bold",
            labelAlign: "lm",
            labelXOffset:12,
            labelOutlineColor: this.statusToColor[trackingStatus],
            labelOutlineWidth: 2.5
        });
        this.marker.attributes = _.extend(this.marker.attributes, {label: label_text});

    }
    layer.addFeatures([this.marker]);
我在z-ordering标签方面没有遇到任何问题。请提供代码。可能只是你的“技术变化”有些问题。 - capdragon
感谢回复；我已经更新了帖子，附上了我的代码。 - brokethebuildagain
看起来这个问题在2011年也被问过了，但是没有答案。:( http://lists.osgeo.org/pipermail/openlayers-users/2011-March/020097.html - brokethebuildagain
2个回答
0
可能的解决方法是将文本容器更改为图形容器，这样它就会在呈现文本时遵守z-index：
layer.renderer.textRoot = layer.renderer.vectorRoot;
0
如果你还没有尝试过，可以试试以下几件事情：
我注意到你在第一个矢量上启用了rendererOptions，但是在第二个上没有。你可以尝试将其添加到第二个图层中。
另外，尝试从"${zIndex}"中删除引号，只保留${zIndex}，因为它可能需要一个整数。
谢谢，但是所有的代码都在同一层中。此外，我的代码没有使用styleMap graphicZIndex映射器，因为我直接在每个Vector要素中设置了graphicZIndex。我认为这只是OpenLayers中的一个错误，因为他们使用SVG渲染器来绘制标签，而SVG不支持z-indexing。这个错误的票据将其列入“TODO”列表，但该错误已标记为已解决，所以我不知道它是否会得到支持。 - brokethebuildagain
我正在根据鼠标最接近的功能将功能突出显示到顶部。它与styleMap以及一些样式规则一起工作，以突出显示我指定为“已选”的功能，并使用自定义mousemove事件。似乎绕过此问题最简单且最直接的方法是在矢量图层之上使用一个空图层并添加浮动要素。如果您只是想重新排序..您必须按顺序重新创建所有矢量 :| - whardier
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接