Symbol Layer用於顯示地圖上的圖標和文字標籤，常用於地點標記、地理位置標誌等。它允許你將圖示（如標誌、餐廳標記等）與文本（如地名、數據標籤）結合呈現，提供直觀的地圖互動。

Symbol Layer屬性

圖標相關屬性：

icon-image：設置圖標的圖片。
icon-size：調整圖標的大小。
icon-color：設置圖標的顏色。
icon-opacity：控制圖標的不透明度。
icon-anchor：設置圖標相對於其位置的對齊方式。
icon-rotate：旋轉圖標。

文字相關屬性：

text-field：設定文字標籤的內容。
text-font：設置文字的字體。
text-size：調整文字的大小。
text-color：設定文字的顏色。
text-halo-color：設置文字的光暈顏色。
text-opacity：控制文字的不透明度。

map.addLayer({
  'id': 'poi-symbols',
  'type': 'symbol',
  'source': 'my-source',
  'layout': {
    'icon-image': 'restaurant-15',  // 設置圖標
    'icon-size': 1.5,               // 放大圖標
    'icon-allow-overlap': true,      // 允許圖標重疊
    'text-field': '{name}',          // 文字標籤，顯示地點名稱
    'text-font': ['Open Sans Regular'], // 設置字體
    'text-size': 12                  // 設置文字大小
  },
  'paint': {
    'icon-color': '#FF6347',         // 設置圖標顏色
    'text-color': '#000000',         // 設置文字顏色
    'text-halo-color': '#ffffff',    // 設置文字光暈顏色
    'text-halo-width': 2             // 光暈寬度
  }
});

Circle Layer用於顯示點數據，特別適合用於表示如地震事件、氣象站或人口分佈等地理點的數據可視化。你可以調整圓的顏色、半徑和不透明度來視覺化不同數據。

Circle Layer屬性

circle-color：設置圓形的顏色。
circle-radius：控制圓形的半徑。
circle-opacity：調整圓形的不透明度。
circle-stroke-color：設置圓形邊框顏色。
circle-stroke-width：調整圓形邊框的寬度。
circle-blur：為圓形邊緣添加模糊效果。
circle-translate 和 circle-translate-anchor：控制圓形的位置偏移。

map.addLayer({
  'id': 'earthquake-points',
  'type': 'circle',
  'source': 'my-source',
  'paint': {
    'circle-radius': 8,
    'circle-color': '#ff0000',
    'circle-opacity': 0.8,
    'circle-stroke-width': 2,
    'circle-stroke-color': '#000000'
  }
});