mapbox-gl js对“文本偏移量”使用步进坡度

时间:2018-07-16 12:10:46

标签: javascript mapbox mapbox-gl-js mapbox-gl mapbox-marker

我正在layout的mapbox gl层中使用-阻止字段text-offset

layout: { // Working
  'text-field': '{point_count_abbreviated}',
  'text-size': ['step', ['get', 'point_count'], 18, 10, 14, 100, 12],
  'text-offset': [-0.84, 0.23],
}

这按预期工作,但现在我想根据属性更改偏移量。这对于'text-size'来说效果很好,但是对于文本偏移量,我找不到正确的语法。我尝试了以下方法:

layout: { // NOT working
  'text-field': '{point_count_abbreviated}',
  'text-size': ['step', ['get', 'point_count'], 18, 10, 14, 100, 12],
  'text-offset': [
    // [-0.84, 0.23],
    ['step', ['get', 'point_count'], -0.84, 10, -0.94, 100, -0.99],
    ['step', ['get', 'point_count'], 0.23, 10, 0.25, 100, 0.28],
  ],
},

也许mapbox-gl目前不支持在文本偏移量上进行步进?

错误消息:

  

错误:layers.cluster-offline.layout.text-offset [0]:预期数量,找到了数组


layout: { // NOT working
  'text-field': '{point_count_abbreviated}',
  'text-size': ['step', ['get', 'point_count'], 18, 10, 14, 100, 12],
  'text-offset': [
    // [-0.84, 0.23],
    ['literal', 
       ['step', ['get', 'point_count'], -0.84, 10, -0.94, 100, -0.99], 
       ['step', ['get', 'point_count'], 0.23, 10, 0.25, 100, 0.28]
    ],
  ],
},

错误消息:

  

错误:layers.cluster-offline.layout.text-offset:预期数组长度为2,找到长度为1


layout: { // NOT working
  'text-field': '{point_count_abbreviated}',
  'text-size': ['step', ['get', 'point_count'], 18, 10, 14, 100, 12],
  'text-offset': [
    ['literal', ['step', ['get', 'point_count'], -0.84, 10, -0.94, 100, -0.99]], 
    ['literal', ['step', ['get', 'point_count'], 0.23, 10, 0.25, 100, 0.28]],
  ],
},

错误消息:

  

错误:layers.cluster-offline.layout.text-offset [0]:预期数量,找到了数组

2 个答案:

答案 0 :(得分:1)

您需要使用文字类型转换器包装文本偏移值:

'text-offset': [
  'step',                         // Expression type (discrete matching)
  ['get', 'point_count'],         // Variable to compare to
  ['literal', [-0.84, 0.23]],     // Default value (if none of the following match)
  10, ['literal', [-0.94, 0.25]], // if point_count === 10: [-0.94, 0.25]
  100, ['literal', [-0.99, 0.28]] // if point_count === 100: [-0.94, 0.28]
]
  

停止输出值必须是文字值(即不是函数或表达式)

source

在这里,[-0.84, 0.23]子表达式对于Mapbox可能是模棱两可的,因此您需要明确地告诉它们的类型。

答案 1 :(得分:0)

在版本1.6.1中,我尚未测试其他版本。

您只需要在properties中设置一个数组,

例如"offsetdate": [-1,0]

,然后使用"text-offset": ['get', 'offsetdate']获取数据。