Mapbox GL JS v1.1.0〜v1.2.0の新機能

Mapbox GL JSの1.1.0〜1.2.0での新機能の紹介です。
7月中になんと1.1.0〜1.2.0まで公開されました！
更新スピードが早いのは嬉しいことです:+1:

[前記事：v0.54.0〜v1.0.0の新機能](https://qiita.com/anagura0000/items/92be59d541ca37af36a1)

# Mapbox GL JS v1.2.0からの新機能
Mapbox GL JS v1.2.0は2019/07/30にリリースされました。
このバージョンでは`map`で複数の`accessToken`を使えるようになったり、`NavigationControl`のコンパスが強化されました。

## ✨変更点
### [Mapbox Style](https://docs.mapbox.com/mapbox-gl-js/style-spec/)に`circle-sort-key`, `line-sort-key`, `fill-sort-key`を追加 ([#8467](https://github.com/mapbox/mapbox-gl-js/pull/8467))
- これらの値に基づいてソートされるようになります

### `map`に`accessToken`パラメータを追加 ([#8364](https://github.com/mapbox/mapbox-gl-js/pull/8364))
今までは、accessTokenは `mapboxgl.accessToken = '<access token>'`と`mapboxgl`に紐づいていたため、異なるaccessTokenが必要なMapを表示することができませんでした。
今回の更新で、`map`で複数のaccessTokenを使うことができるようになります。

### ブラウザでの[`prefers-reduced-motion`](https://developer.mozilla.org/ja/docs/Web/CSS/@media/prefers-reduced-motion)を調整 ([#8494](https://github.com/mapbox/mapbox-gl-js/pull/8494))


### `NavigationControl`に`visualizePitch`オプションを追加 ([#8208](https://github.com/mapbox/mapbox-gl-js/pull/8208), [#8296](https://github.com/mapbox/mapbox-gl-js/pull/8296))
`visualizePitch`を有効化するとコンパスがpitchに合わせて傾斜するようになります。デフォルトはoffです。


![visualizePitch.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270436/4d6a394e-a8d0-a514-69e3-f64145829cc8.gif)


v1.2.0では`visualizePitch`がoffの場合(デフォルト)、コンパスがうまく回転しないエラーがあります。
<font color="red">[追記]v1.2.1で修正されました。</font>

### sourceをTileJSONよりも優先させるように ([#8232](https://github.com/mapbox/mapbox-gl-js/pull/8232))


### テキストオフセットのプロパティの要件をより正確に ([#8418](https://github.com/mapbox/mapbox-gl-js/pull/8418))

### style-specでconvertFilter APIを公開 ([#8493](https://github.com/mapbox/mapbox-gl-js/pull/8493))
styleのfilterに従来のフィルタ構文と新しいフィルタ構文を混在させた場合、クラッシュするエラーがあるが、convertFilter APIによってクラッシュしなくなるとのこと

### 🐞バグ修正
- `text-variable-anchor`が`setStlye`や`setlayoutProperty`によって変更された場合に反映されないバグを修正 ([#8473](https://github.com/mapbox/mapbox-gl-js/pull/8473))
- ヒートマップ + `fill-extrusion`レイヤー上での不透明パスレイヤーでのレンダリングを修正 ([#8440](https://github.com/mapbox/mapbox-gl-js/pull/8440))
- ベクトルタイル内の余分な垂直線のレンダリングを修正 ([#8477](https://github.com/mapbox/mapbox-gl-js/pull/8477), [#8479](https://github.com/mapbox/mapbox-gl-js/pull/8479))
- マーカーを削除するときに`move`イベントリスナーをオフにする ([#8465](https://github.com/mapbox/mapbox-gl-js/pull/8465))
- IEのナビゲーションコントロールのクラス切り替えを修正 ([#8495](https://github.com/mapbox/mapbox-gl-js/pull/8495))
- GeolocateControlでhoverしている背景の回転を修正 ([#8367](https://github.com/mapbox/mapbox-gl-js/pull/8367))
- `startPos`が定義されていないマーカーのクリックイベントのエラーを修正 ([#8462](https://github.com/mapbox/mapbox-gl-js/pull/8462))
- 特定の形式の`baseAPIURL`を使用しているときに不正なURLが生成されるバグを修正 ([#8466](https://github.com/mapbox/mapbox-gl-js/pull/8466))

## Mapbox GL JS v1.1.1からの新機能
Mapbox GL JS v1.1.1は2019/07/17にリリースされました。
v1.1.0でのバグ修正を行ったバージョンとなります。

### 🐞バグ修正
- キャッシュをチェックしている間にリクエストが中断された場合に無限にメモリ使用量が増加する問題を修正 ([#8472](https://github.com/mapbox/mapbox-gl-js/pull/8472))
- IEでリクエストのキャンセルに失敗した場合に無限にメモリ使用量が増加する問題を修正 ([#8481](https://github.com/mapbox/mapbox-gl-js/pull/8481))
- キャッシュからタイルを取得するパフォーマンスを修正 ([#8489](https://github.com/mapbox/mapbox-gl-js/pull/8489))


## Mapbox GL JS v1.1.0からの新機能
Mapbox GL JS v1.1.1は2019/07/02にリリースされました。
v1.1.0は大きな変更はないですが、ズーム速度のカスタマイズが可能になった他、パフォーマンスの改善がされました。

### ✨小変更
- 線レンダリングのパフォーマンスが向上 ([#8306](https://github.com/mapbox/mapbox-gl-js/pull/8306))
 - ラインの頂点を12個から8個に変更したとのこと
- データ駆動型シンボルレイヤのレンダリングパフォーマンスを改善 ([#8295](https://github.com/mapbox/mapbox-gl-js/pull/8295))
- `queryRenderedFeatures`と`querySourceFeatures`の呼び出し中に検証を無効にする機能を追加 ([#8211](https://github.com/mapbox/mapbox-gl-js/pull/8211))
- groupByLayoutでキーをキャッシュすることで、`setFilter`のパフォーマンスを改善 ([#8122](https://github.com/mapbox/mapbox-gl-js/pull/8122))
- アイコンを重ねることはできるが、テキストを重ねることができないシンボルレイヤのレンダリングが改善 ([#8180](https://github.com/mapbox/mapbox-gl-js/pull/8180))
- 日本語ラベルの区切りを改善するために幅0のスペースを使用 ([#8255](https://github.com/mapbox/mapbox-gl-js/pull/8255))
- CustomLayerInterfaceのonRemove関数にWebGLRenderingContext引数を追加 ([#8156](https://github.com/mapbox/mapbox-gl-js/pull/8156))
- `setZoomRate`、`setWheelZoomRate`メソッドをScrollZoomHandlerに追加 ([#7863](https://github.com/mapbox/mapbox-gl-js/pull/7863))
 - ズーム速度のカスタマイズが可能になりました
 - `setZoomRate`はトラックパッドでのズーム速度、`setWheelZoomRate`はマウスホイールでのズーム速度を変更できます
- trackPointerメソッドをPopupに追加 ([#7786](https://github.com/mapbox/mapbox-gl-js/pull/7786))
 - Popupがマウスカーソルに追従するようになりました
![trackPointer.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270436/51084a81-ab24-915a-1007-8b1dc5bdb42f.gif)
- PopupにgetElementメソッドを追加 ([#8123](https://github.com/mapbox/mapbox-gl-js/pull/8123))
- ドキュメントに塗りつぶしパターンの例を追加 ([#8022](https://github.com/mapbox/mapbox-gl-js/pull/8022))
 - [`fill-pattern`のデモが追加されました](https://docs.mapbox.com/mapbox-gl-js/example/fill-pattern/)
- Unicode 12.1用にスクリプト検出ファイルを更新 ([#8158](https://github.com/mapbox/mapbox-gl-js/pull/8158))
- Mapboxのロゴと"Improve this map"にnofollowを追加 ([#8106](https://github.com/mapbox/mapbox-gl-js/pull/8106))
- 無効なGeoJSONエラーのエラー文にsourceを含めるように ([#8113](https://github.com/mapbox/mapbox-gl-js/pull/8113))

### 🐞バグ修正
- ChromeでupdateImageが正常に機能しない問題を修正 ([#8199](https://github.com/mapbox/mapbox-gl-js/pull/8199))
- タッチデバイスでのダブルタップズームに関する問題を修正 ([#8086](https://github.com/mapbox/mapbox-gl-js/pull/8086))
- ズーム時の`movestart`イベントの重複を修正 ([#8259](https://github.com/mapbox/mapbox-gl-js/pull/8259))
- オプションが提供されている場合に`"format"`の検証が失敗する問題を修正 ([#8339](https://github.com/mapbox/mapbox-gl-js/pull/8339))
- `setPaintProperty`が`line-pattern`で機能しない問題を修正 ([#8289](https://github.com/mapbox/mapbox-gl-js/pull/8289))
- カスタムレイヤを使用しているときにGL contextが予測不可能な状態になってしまう問題を修正 ([#8132](https://github.com/mapbox/mapbox-gl-js/pull/8132))
- attributionの文字列の不要な更新を修正 ([#8082](https://github.com/mapbox/mapbox-gl-js/pull/8082))
- `findStopLessThanOrEqualTo`のバグを修正 ([#8134](https://github.com/mapbox/mapbox-gl-js/pull/8134))
- `text-align: center`でマップが正しく表示されない問題を修正 ([#8227](https://github.com/mapbox/mapbox-gl-js/pull/8227))
- `Popup#maxWidth`がピクセル値だけではなくCSSの`max-width`で指定できる値であれば全て取ることができることをドキュメントに記述 ([#8312](https://github.com/mapbox/mapbox-gl-js/pull/8312))
- Location dotの影が表示されない問題を修正 ([#8119](https://github.com/mapbox/mapbox-gl-js/pull/8119))
- docs devの依存関係を修正 ([#8121](https://github.com/mapbox/mapbox-gl-js/pull/8121))
- 様々なtypoを修正([#8230](https://github.com/mapbox/mapbox-gl-js/pull/8230), [#8236](https://github.com/mapbox/mapbox-gl-js/pull/8236))
- geolocate buttonのCSSを修正 ([#8367](https://github.com/mapbox/mapbox-gl-js/pull/8367))
- Mapboxタイルのキャッシュを修正 ([#8389](https://github.com/mapbox/mapbox-gl-js/pull/8389))