Replies: 4 comments 22 replies
-
|
What problem does this solve? If the problem is with the current support of text, then it would probably have the same problems. |
Beta Was this translation helpful? Give feedback.
-
|
Sounds like a solution for a specific platform, isn't it? |
Beta Was this translation helpful? Give feedback.
-
|
Canvas is web specific, right. Let me see if mobile operating systems have something similar which lets you turn text to pixels... |
Beta Was this translation helpful? Give feedback.
-
|
Yes, every platform has an analogue. For example, on iOS, a But @HarelM has a good point that this approach fundamentally only works for point features where you can reasonably hard-code the image’s dimensions at design time. Line-placed labels are important in any map that provides more detail than a city locator map. Another downside is the inability to reuse rasterized labels, leading to bloat in the internal spritesheet. And the drawing function doesn’t have enough context to rotate or tilt labels if the label needs to align to the map instead of the viewport.
In my opinion, the lack of built-in complex text support is problematic enough that any solution, however limited, deserves consideration for the benefit of the affected language communities. However, this feels to me like a workaround to be published as a plugin or example rather than a well-integrated solution. |
Beta Was this translation helpful? Give feedback.
-
|
Yes maybe it would be best if I started with a plugin! I have never written one, do you have an example I could follow? |
Beta Was this translation helpful? Give feedback.
-
|
mapbox-gl-language is a good example of a plugin that’s all about runtime styling. |
Beta Was this translation helpful? Give feedback.
-
|
Using a canvas in web browsers would mean that the text does not look identical on all devices. Is this a requirement which we can drop for the sake of being able to render at least something in currently non-supported languages? |
Beta Was this translation helpful? Give feedback.
-
|
Collisions are broken, and long labels look not great, but still, here is an example with street names in Bengali: https://wipfli.github.io/maplibre-canvas-labels/offscreen#map=14.98/23.75498/90.38573
|
Beta Was this translation helpful? Give feedback.
-
This looks quite good. I hope firefox gets the Intl.Segmenter soon. |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
|
We can also segement by word: const segmenter = new Intl.Segmenter(
- 'en', {granularity: 'grapheme'}
+ 'en', {granularity: 'word'}
);Here is a demo: https://wipfli.github.io/index-by-grapheme/by-word/#map=4.81/16.04/82.31&language=te |
Beta Was this translation helpful? Give feedback.
-
|
For Burmese, one might want to use |
Beta Was this translation helpful? Give feedback.
-
|
Word and sentence segmentation is even more dependent on the text’s locale, which this code doesn’t have access to. Anything beyond grapheme cluster would behave similar to not segmenting at all (what you had tried originally): it would look disjointed and bloat the glyph texture.
|
Beta Was this translation helpful? Give feedback.
-
|
New idea: We could let the user decide how to segment text. The user could insert some sort of special character at the locations where text can be segmented. Examples:
|
Beta Was this translation helpful? Give feedback.
-
|
I don't know how to do the segmentation for every language correctly, but I think there must be ways. And if we do the segmentation at tile-generation time, we can use as many libraries and as much compute as we want... |
Beta Was this translation helpful? Give feedback.
-
I wonder if it would make sense to add a style spec expression called
text-to-sdfwhich takes a string, renders it in a canvas and turns the image into an sdf.A use-case would be:
With this, we could do stuff like this:
What do you think?
Beta Was this translation helpful? Give feedback.
All reactions