From a73b11805d3928342e4c1e33c94dc25055834016 Mon Sep 17 00:00:00 2001
From: IGUCHI Kanahiro <mediterranean1769@gmail.com>
Date: Wed, 27 Mar 2024 08:12:17 +0900
Subject: [PATCH] localIdeographFontFamily: false to load CJK fonts (#893)

close #892

this changes works well for CJK fonts.

<img width="736" alt="Screenshot 2024-03-25 at 22 04 36"
src="https://github.com/maplibre/maputnik/assets/20744195/adb0295e-5428-4773-b216-8f380e2dcb05">
---
 package-lock.json                | 8 ++++----
 package.json                     | 2 +-
 src/components/MapMaplibreGl.tsx | 7 +++++--
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e57ef1d1..2d39d7ff 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -36,7 +36,7 @@
         "lodash.get": "^4.4.2",
         "lodash.isequal": "^4.5.0",
         "lodash.throttle": "^4.1.1",
-        "maplibre-gl": "^4.1.1",
+        "maplibre-gl": "^4.1.2",
         "maputnik-design": "github:maputnik/design#172b06c",
         "ol": "^6.14.1",
         "ol-mapbox-style": "^7.1.1",
@@ -7109,9 +7109,9 @@
       "integrity": "sha512-X1dtuTuH2D1MRMuductMZCLV/fy9EoIgqW/lmu8vQSAhEatx/tdFebkYT3TVhdTwqFDHbLEgQBD3IKA4KI7aoQ=="
     },
     "node_modules/maplibre-gl": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-4.1.1.tgz",
-      "integrity": "sha512-DmHru9FTHCOngNHzIx9W2+MlUziYPfPxd2qjyeWwczBYNx2SDpmH394MkuCvSgnfUm5Zvs4NaYCqMu44jUga1Q==",
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-4.1.2.tgz",
+      "integrity": "sha512-98T+3BesL4w/N39q/rgs9q6HzHLG6pgbS9UaTqg6fMISfzy2WGKokjK205ENFDDmEljj54/LTfdXgqg2XfYU4A==",
       "dependencies": {
         "@mapbox/geojson-rewind": "^0.5.2",
         "@mapbox/jsonlint-lines-primitives": "^2.0.2",
diff --git a/package.json b/package.json
index 977fc877..f31af95d 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,7 @@
     "lodash.get": "^4.4.2",
     "lodash.isequal": "^4.5.0",
     "lodash.throttle": "^4.1.1",
-    "maplibre-gl": "^4.1.1",
+    "maplibre-gl": "^4.1.2",
     "maputnik-design": "github:maputnik/design#172b06c",
     "ol": "^6.14.1",
     "ol-mapbox-style": "^7.1.1",
diff --git a/src/components/MapMaplibreGl.tsx b/src/components/MapMaplibreGl.tsx
index 86084800..16135cb1 100644
--- a/src/components/MapMaplibreGl.tsx
+++ b/src/components/MapMaplibreGl.tsx
@@ -133,8 +133,11 @@ export default class MapMaplibreGl extends React.Component<MapMaplibreGlProps, M
       container: this.container!,
       style: this.props.mapStyle,
       hash: true,
-      maxZoom: 24
-    }
+      maxZoom: 24,
+      // setting to always load glyphs of CJK fonts from server
+      // https://maplibre.org/maplibre-gl-js/docs/examples/local-ideographs/
+      localIdeographFontFamily: false
+    } satisfies MapOptions;
 
     const map = new MapLibreGl.Map(mapOpts);