Label Vector Fonts don't' have the right rendering [BUG]

[silassantos21]

Label text founded in style-func has weird break fonts When i try to load my map with dynamic text in each vector, the font texts are appearing like a weird writing. In each loading, the weird font appears in randomly vectors

Can i fix this using the style-func or would be other way?

Expected behavior The dynamic vectors text comes with the normal config style and font

[ghettovoice]

Hello @silassantos21 , interesting picture, I'm not sure what can be a reason . Can you provide a code sample how do you define style for this vector layer? I'll try to reproduce/debug

[silassantos21]

I can't reply in a codesanbox, but i can show the code snippet configuration:

I configure the vector style and coordenates using vl-style-func:

<vl-layer-vector id="draw-pane">
    <vl-source-vector ident="draw-target" ref="source" :features="drawnFeaturesFilter"></vl-source-vector>
    <vl-style-func :factory="styleFuncFactory" />
  </vl-layer-vector>

Inside the styleFuncFactory, i have this configuration

  styleFuncFactory () {
      // eslint-disable-next-line no-unused-vars
      return (feature, resolution) => {
        let textDesk = feature.values_.deskName
        var deskMarker = new Style({
          image: new Icon({
            src: require('../assets/svg/location_on-24px.svg'),
            imgSize: [ 30, 30 ]
          }),
        })
          deskMarker['text_'] = new Text({
            text: textDesk,
            offsetY: 20,
            offsetx: -15,
            padding: [3, 3, 3, 3],
            backgroundFill: new Fill({color: 'white'}),
            backgroundStroke: new Stroke({ color: '#e1e1e1'}),
          })
        let styles = [ deskMarker ]
        return styles
      }
    },

OBS¹: When i set a static text, the vector text renders feels normal

OBS²: Style, Icon, Text, Fill and Stroke are imported by ol

import Icon from 'ol/style/icon'
import Style from 'ol/style/style'
import Fill from 'ol/style/fill';
import Stroke from 'ol/style/stroke';
import Text from 'ol/style/text';

Remembering that the vector text should be dynamic

[ghettovoice]

Hello @silassantos21 , frankly speaking I'm not sure what's going on. Maybe it is something with text or font... However default font is 10px sans-serif, most common value. Here https://codesandbox.io/s/vuelayers-v0-12-dynamic-labels-0u8344 I have made a simple demo with dynamic text labels. Do you see any rendering issues?

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.