javascript – Openlayers 3:为功能添加文本标签

我现在设置了这个: fully functional fiddle example,虽然我已经设法缩放到每个多边形特征,但我还想在每个…上显示中文标签…在get_fields方法中找到的field_title变量.我不知道如何做到这一点,所有我的谷歌搜索都提出了这篇文章http://openlayers.org/en/v3.3.0/examples/vector-labels.html我发现完全混乱,因为我对OL有点新!

解决方法

要向ol.Feature添加文本,您将在功能中存储描述,并将 set a style存储为 style function(将从功能获取描述并显示):
field_polygon.set('description',field_title);
field_polygon.setStyle(styleFunction);

function styleFunction() {
  return [
    new ol.style.Style({
        fill: new ol.style.Fill({
        color: 'rgba(255,255,0.4)'
      }),stroke: new ol.style.stroke({
        color: '#3399CC',width: 1.25
      }),text: new ol.style.Text({
        font: '12px Calibri,sans-serif',fill: new ol.style.Fill({ color: '#000' }),stroke: new ol.style.stroke({
          color: '#fff',width: 2
        }),// get the text from the feature - `this` is ol.Feature
        // and show only under certain resolution
        text: map.getView().getZoom() > 12 ? this.get('description') : ''
      })
    })
  ];
}

Your fiddle.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...