首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >未显示开层特征标签

未显示开层特征标签
EN

Stack Overflow用户
提问于 2015-07-07 14:33:39
回答 1查看 3K关注 0票数 0

我正在使用一个自定义图标(png)的功能,但我不能得到一个标签显示。如你所见,我把它添加到任何地方,试着让它起作用?有人能发现我哪里出了问题吗?

非常感谢

代码语言:javascript
复制
var iconFeature = new ol.Feature({
    geometry: new ol.geom.Point(ol.proj.transform([0.0488567 - 0.003, -0.02275 + 0.00115 ], 'EPSG:4326', 'EPSG:3857')),
    label:"adsfasdf",
    name: 'Null Island',
    population: 4000,
    rainfall: 500,

});
iconFeature.attributes = {label: "sadfd"}
//new OpenLayers.LonLat(51.5, -0.117)
var iconStyle = new ol.style.Style({
    image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
        anchor: [0.5, 46],
        anchorXUnits: 'fraction',
        anchorYUnits: 'pixels',
        opacity: 0.75,
        src: 'assets/pins/pin-blue.png',
        label: "kasds"
    }))
});
iconFeature.setStyle(iconStyle);

var iconFeature2 = new ol.Feature({
    geometry: new ol.geom.Point([5389, -1282]),
    name: 'Null Island2',
    population: 4000,
    rainfall: 500,
});
var iconStyle2 = new ol.style.Style({
    image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
        anchor: [0.5, 46],
        anchorXUnits: 'fraction',
        anchorYUnits: 'pixels',
        opacity: 0.75,
        src: 'assets/pins/pin-blue.png',
        label: "kasds",
        fontSize: "12px",
        fontFamily: "Courier New, monospace"
    }))
});
iconFeature2.setStyle(iconStyle2);

var vectorSource = new ol.source.Vector({
    features: [iconFeature,iconFeature2]
});

var vectorLayer = new ol.layer.Vector({
    source: vectorSource
});


var imgWidth = 12241;// 32241;
var imgHeight = 5768;//15191;
var url = 'assets/map/';
var crossOrigin = 'anonymous';
var imgCenter = [imgWidth / 2, - imgHeight / 2];
var proj = new ol.proj.Projection({
    code: 'ZOOMIFY',
    units: 'pixels',
    extent: [0, 0, imgWidth, imgHeight]
});

var source = new ol.source.Zoomify({
    url: url,
    size: [imgWidth, imgHeight],
    crossOrigin: crossOrigin
});

var map = new ol.Map({
    layers: [
        new ol.layer.Tile({
            source: source
        }),
        vectorLayer
    ],
    renderer: common.getRendererFromQueryString(),
    target: 'map',
    view: new ol.View({
        projection: proj,
        center: imgCenter,
        zoom: 3,
        minZoom: 3,
        maxZoom: 5,
        extent: [0, -imgHeight, imgWidth, 0]
    })
});
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-08 06:38:57

必须将文本风格作为参数text传递给ol.style.Style

代码语言:javascript
复制
var iconStyle = new ol.style.Style({
  image: new ol.style.Icon({
    ...
  })),
  text: new ol.style.Text({
      text: 'The label',
      fill: new ol.style.Fill({color: 'black'}),
      stroke: new ol.style.Stroke({color: 'yellow', width: 1}),
      offsetX: -20,
      offsetY: 20
  })
});

http://jsfiddle.net/54a8pktt/

还请参阅此示例:http://openlayers.org/en/master/examples/vector-labels.html

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31271601

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档