mapbox / mapbox/mapbox-gl-js

Full "complex text" support: indic scripts, ligatures, kerning, etc.

Open
#4,009 22 comments 3 reactions 1 assignee View on GitHub

@ChrisLoer is already working on this.

Since Jan 18, 2017.

feature :green_apple: mapbox.js → GL JS
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

GL JS now supports right-to-left (and bidirectional) text, along with text shaping for languages that use the Arabic script (https://github.com/mapbox/mapbox-gl-js/issues/3708). There are a number of further features that fall under the category of "complex text" that remain to be addressed:

- [ ] Shaping for [Brahmic/Indic scripts](https://en.wikipedia.org/wiki/Brahmic_scripts)
- [ ] Shaping with basic OpenType support for [ligatures](https://en.wikipedia.org/wiki/Typographic_ligature) and [kerning](https://en.wikipedia.org/wiki/Kerning) in Latin fonts
- [ ] Shaping with support for more advanced typographic features (such as [Apple Advanced Typography](https://en.wikipedia.org/wiki/Apple_Advanced_Typography))
- [ ] Language aware line-breaking algorithms. This is an improvement for languages like Chinese or Japanese, where current line breaking is sub-optimal in that it will easily break inside of compound words. Language aware line-breaking is much more important for languages like Thai or Lao where finding acceptable breaking points requires the use of a dictionary.

The first two items can be implemented using [Harfbuzz](https://www.freedesktop.org/wiki/Software/HarfBuzz/). More advanced typography as in item three would probably require passing through to system libraries (such as Apple's Core Text). Line-breaking can be implemented using [ICU](http://site.icu-project.org/), but a standard implementation would require client-side line breaking dictionaries which are likely to be prohibitively large.

Mapbox Classic supports basic shaping using Harfbuzz via [Mapnik](https://github.com/mapnik/mapnik), but I don't believe it has support for language-aware line breaking or advanced typographical features.

Because library support for text shaping and internationalization is much better in the C/C++ world (in most of the JS world, the browser can do it all for you), we'll generally implement this functionality first in gl-native (see https://github.com/mapbox/mapbox-gl-native/issues/7774) and then figure out how to port back to gl-js.

@1ec5 @lucaswoj @pveugen

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.