レイアウトとペイントのプロパティ
レイアウトプロパティとペイントプロパティは、レイヤにある2つのサブプロパティで、Mapbox GLマップでの空間データのレンダリング方法を定義します。レイアウトプロパティとペイントプロパティは、1つのレイヤで一緒に使用されることが多いです。
レイアウトプロパティ
レイアウトプロパティは、Mapbox GLレンダラーがレイヤのデータをどのように描画し、適用するかを定義し、レンダリングプロセスの初期段階で適用されます。レイアウトプロパティの例としては、可視性
(英語)、 ラインキャップ
(英語)、シンボル配置
(英語)などがあります。
レイアウトプロパティは、以下のMapbox GL JSの例のように、レイヤーのレイアウト
オブジェクトに表示されます。
map.addLayer({
id: 'gl-draw-line',
type: 'line',
source: 'draw-line',
layout: {
'line-cap': 'round',
'line-join': 'round',
'line-opacity': 0.75
}
});
ペイントプロパティ
ペイントプロパティは、そのレイヤのデータがどのようにスタイリングされるかを定義します。 Mapbox GLはこれらのプロパティをレンダリングプロセスの後半で適用します。ペイント プロパティの例としては、fill-color
(英語)、background-pattern
(英語)、line-opacity
(英語)などがあります。
ペイントプロパティは、Mapbox GL JSの例にあるように、レイヤのペイント
オブジェクトに表示されます。
map.addLayer({
id: 'trees-point',
type: 'circle',
source: 'trees',
paint: {
'circle-radius': 3,
'circle-color': '#223b53',
'circle-stroke-color': 'white',
'circle-stroke-width': 1,
'circle-opacity': 0.5
}
});
関連ページ(英語)
- Layers documentation in the Mapbox Style Specification
- Example using layout properties: Change the case of labels
- Example using paint properties: Style circles with a data-driven property