【簡単】react-map-glを日本語表示にする方法

はじめに

react-map-glを導入した際は、英語表記となっています。
これを日本語表示にしてみましたので、まとめてみます。

方法

いろいろ調べると以下の方法で変更できそうでした。
・MapBoxStudioで表示言語を日本語にして、StyleURLを取得する方法

MapBoxStudioで表示言語を日本語にして、StyleURLを取得する方法

MapBoxへログインをして、MapBoxStudioへ入ります。
左側タブの各要素の言語表示をjapaneseへ変更します。
（Natural features,Place labels,Point of interest labels,Road network、transit,
Walking,cycling,etc）

左上からカスタマイズしたstyleのURLを取得します。

MapGLのmapStyleの中に先程取得したURLを入れます。。

map.js

<MapGL
   ref={mapRef}
   {...viewport}
   width= "100%"
   height= "450px"
   mapStyle="さきほど取得したURLをいれる"
   onViewportChange={setViewport}
   mapboxApiAccessToken={TOKEN}
>

日本語で表示することができました。

まとめ

今回はmap-react-glを日本語表示する方法をまとめてみました。
参考になれば幸いです。