如何在 OpenLayers 中向 LineString 添加文本？

Question

我們使用 OpenLayers 4.6.5。

代碼如下所示：

const line = new Feature({
  geometry: new LineString(points)
})
line.setStyle(
  new Style({
    fill: new Fill({ color: 'black' }),
    stroke: new Stroke({ color: 'black', width: 2 }),
    text: new Text({
      text: '1',
      font: '18px "Roboto", Helvetica Neue, Helvetica, Arial, sans-serif',
      fill: new Fill({ color: 'black' }),
      stroke: new Stroke({ color: 'black', width: 2 })
    })
  })
)

this.vectorLayer.getSource().addFeature(line)

但是，我收到錯誤：

Uncaught TypeError: textStyle.getFill is not a function
at _ol_render_canvas_TextReplay_.setTextStyle (textreplay.js?3128:470)
at _ol_renderer_vector_.renderLineStringGeometry_ (vector.js?98c2:183)
at Object._ol_renderer_vector_.renderFeature_ (vector.js?98c2:121)
at Object._ol_renderer_vector_.renderFeature (vector.js?98c2:94)
at _ol_renderer_canvas_VectorLayer_.renderFeature (vectorlayer.js?c03d:429)
at _ol_renderer_canvas_VectorLayer_.eval (vectorlayer.js?c03d:378)
at _ol_renderer_canvas_VectorLayer_.prepareFrame (vectorlayer.js?c03d:395)
at _ol_renderer_canvas_Map_.renderFrame (map.js?1103:183)
at _ol_Map_._ol_PluggableMap_.renderFrame_ (pluggablemap.js?0fa0:1180)
at _ol_Map_.eval (pluggablemap.js?0fa0:87)      

沒有文字設置，沒有錯誤，只有一行。

Answer 1

要正常工作Text需要已正確導入，例如

import {Text} from 'ol/style';

或者

import Text from 'ol/style/Text';