In 1ec5/maplibre-gl-js#1, I’ve been prototyping an overhaul of text rendering in MapLibre GL JS to support the rest of the Unicode character repertoire including rarer CJKV characters, correctly shape Indic and other complex text, respect variant selectors, place combining diacritics over base characters, improve bidirectional text support, render (silhouettes of) emoji, wrap lines by word in Thai and Khmer, and more.
This branch replaces the MapLibre GL JS dependency with that branch so that interested members of the public can conveniently test-drive the improved text rendering and layout functionality in the context of OSM Americana. There are some caveats to be aware of:
I haven’t optimized performance at all, so there may be a perceptible increase in memory usage or loading time.
I haven’t attempted to match the stylesheet’s fontstack names to locally installed fonts or provide more attractive fonts locally.
I haven’t addressed ligatures beyond Indic text, so various Arabic alphabets besides Arabic probably still have misshapen glyphs.
Please leave any feedback about the improved text processing in 1ec5/maplibre-gl-js#1. Thanks!
This is an improvement over the status quo for Mapnik-based renderers as well. Many computers come with fallback fonts with larger repertoires than what these renderers specify, and browsers use dictionaries to break lines more intelligently in languages that don’t use spaces.
If you see misshapen Burmese text, it may be due to an encoding issue in OSM data rather than a text rendering glitch on the client side. For example, this swimming pool shows up as “ေရပန္းဥယ်ဥ္” because the name in OSM is Zawgyi-encoded. Transforming it to the Unicode equivalent, “ရေပန်းဥယျဉ်”, would cause it to render just fine.
In 1ec5/maplibre-gl-js#1, I’ve been prototyping an overhaul of text rendering in MapLibre GL JS to support the rest of the Unicode character repertoire including rarer CJKV characters, correctly shape Indic and other complex text, respect variant selectors, place combining diacritics over base characters, improve bidirectional text support, render (silhouettes of) emoji, wrap lines by word in Thai and Khmer, and more.
This branch replaces the MapLibre GL JS dependency with that branch so that interested members of the public can conveniently test-drive the improved text rendering and layout functionality in the context of OSM Americana. There are some caveats to be aware of:
Please leave any feedback about the improved text processing in 1ec5/maplibre-gl-js#1. Thanks!
那🌫️市镇
那𧯄市镇
ශ්රී ලංකාව
ශ්රී ලංකාව
มหาสมุทรอ ินเด ีย
มหาสมุทรอินเดีย
ภาคตะนาวศรี
ภาค
ตะนาว
ศรี
sməqʷəʔelə həw’aləm’ew’txʷ
sməqʷəʔelə həw̓aləm̓ew̓txʷ
We 🌫️ Puro
We ❤️ Puro
hotel 79 🌫️
hotel 79 👍🏿
Garten von Czernowitz / Чернівці 🌫️
Garten von Czernowitz / Чернівці 🇺🇦
One Foot Island 🌫️🌫️🌫️
One Foot Island ⭐️⭐️⭐️
This is an improvement over the status quo for Mapnik-based renderers as well. Many computers come with fallback fonts with larger repertoires than what these renderers specify, and browsers use dictionaries to break lines more intelligently in languages that don’t use spaces.
臺北市
立聯合
醫院和
平婦幼
院區婦
幼院址
臺北市立聯
合醫院和平
婦幼院區
婦幼院址
臺北市立
聯合醫院
和平婦幼院
區婦幼院址
�������� ����
🌫️🌫️🌫️🌫️ 🌫️🌫️🌫️🌫️🌫️🌫️🌫️🌫️
𐴀𐴝𐴐𐴞𐴥𐴑𐴧𐴝 𐴉𐴝𐴌𐴝
������������������� �������� «�𝐵�-�𝐸𝑅𝑀»
«-»
𝘋𝘌𝘙𝘔𝘈𝘛𝘖𝘒𝘖𝘚𝘔𝘌𝘛𝘖𝘓𝘖𝘎𝘠𝘈 𝘖𝘙𝘛𝘈𝘓𝘠𝘎𝘠 «𝒪𝐵𝒰-𝒟𝐸𝑅𝑀»
(������������)
( )
(𝘎𝘳𝘶𝘣𝘦𝘯𝘸𝘦𝘪𝘩𝘦𝘳)
If you see misshapen Burmese text, it may be due to an encoding issue in OSM data rather than a text rendering glitch on the client side. For example, this swimming pool shows up as “ေရပန္းဥယ်ဥ္” because the name in OSM is Zawgyi-encoded. Transforming it to the Unicode equivalent, “ရေပန်းဥယျဉ်”, would cause it to render just fine.
ေရပန္းဥယ်ဥ္
ရေပန်းဥယျဉ်
Fixes #827.