矢量瓦片服務
發佈服務
功能說明
通過此功能，可將MapGIS矢量瓦片以及MBTiles發佈為MapGIS標準的矢量瓦片服務。
提示：
發佈服務時，只能選擇註冊的文件夾中對應文件。具體步驟見“文件夾管理”。
操作說明
1. 在服務管理頁面，點擊"服務發佈"-"二維地圖服務"-"矢量瓦片服務"，啟動瓦片服務發佈頁面；
2. 設置基本信息，可設置如下信息：
- 【數據源類型】：可支持矢量瓦片、矢量瓦片文件夾、矢量瓦片MongoDB批量數據、矢量瓦片MongoDB批量數據(Excel)、矢量瓦片PostgresQL批量數據、矢量瓦片PostgresQL批量數據(Excel)、和DataStore MongoDB矢量瓦片七種來源。
- 矢量瓦片：包括MapGIS矢量瓦片（MUVT、VTDF）、MapGIS矢量瓦片（MongoDB）、MapGIS矢量瓦片（目錄格式）、MBTiles四種類型。MapGIS矢量瓦片（MUVT、VTDF）是MapGIS裁剪好的MUVT或VTDF瓦片（格式為*.MUVT/*.VTDF）；MapGIS矢量瓦片（MongoDB）是直接存儲在MongoDB數據庫中的矢量瓦片數據；MapGIS矢量瓦片（目錄格式）是以目錄格式存儲的MapGIS矢量瓦片；MapGIS Tile（MBTILES）是以MBTILES瓦片（格式為*.MBTILES）格式存儲的矢量瓦片。
- 矢量瓦片文件夾：當有多個矢量瓦片文件時，可通過文件夾方式進行批量發佈；
- DataStore MongoDB矢量瓦片：DataStore大數據的MongoDB數據源中存儲的柵格瓦片。
- 【數據路徑】：選擇數據源在服務器中的存儲路徑（MongoDB則需要填寫數據源地址、數據庫名、用戶名和密碼）；
- 【服務名稱】：設置當前服務的名稱；
- 【所屬文件夾】：設置當前服務的所屬文件夾。
- 【開啟瓦片加密】：可為矢量瓦片服務設置加密算法，包括 SM4 和 AES 兩種加密算法。加密後，前端調用該服務時需進行解密。具體信息參考"地圖服務"。
3. 在"安全設置"中可設置服務的訪問權限，具體可參考二維地圖服務的“權限設置”；
4. 點擊"發佈服務"按鈕，發佈當前矢量瓦片服務。
服務詳情
發佈矢量瓦片服務後，可通過服務詳情查看服務信息，並編輯服務參數。
預覽服務
1. 發佈矢量瓦片服務成功後，頁面重新回到服務列表，點擊當前服務右側的"預覽"按鈕，可進入矢量瓦片服務預覽頁面：
2. 顯示預覽頁面之前會彈出調試對話框，用戶可對"調試選項"進行勾選，如下圖所示：
- 【是否顯示瓦片邊界】：勾選即可顯示瓦片的邊界；
- 【是否顯示碰撞框】：勾選即以框的形式顯示要素碰撞區域；
- 【是否顯示過度拉伸檢查】：勾選即可顯示視圖過度拉伸檢查結果；
3. 勾選完調試選項後，預覽頁面如下圖所示：
- 【打開】：用戶可預覽本地地圖（*_style.json）和自定義地圖模板；
- 【保存】：用戶可下載json樣式到本地（*.json和*.html）；
- 【數據源】：顯示當前數據源的詳細信息；
- 【樣式設置】：對地圖的各種樣式信息進行設置；
- 【顯示模式】：提供兩種地圖顯示模式：
- 地圖模式：顯示全部圖層數據；
- 交互模式：可點選"圖層列表"中的圖層進行選擇性顯示；
- 【圖層列表】：在地圖視圖中點選某一處，彈出窗口顯示該點處的所有圖層，單擊窗口中的某一圖層，列表將定位至該圖層處；
- 添加圖層：用戶可在此添加新圖層；
- 顯示/隱藏：默認顯示所有圖層，單擊"隱藏"將所有圖層設為不可見；
- 【圖層信息】：選擇某一圖層後，將彈出該圖層的屬性框；
- 圖層屬性：顯示圖層ID、圖層類型、數據源、數據源圖層、最小級別和最大級別；
- 過濾顯示：用戶可輸入過濾條件選擇性顯示要素；
- 圖層樣式：用戶可對圖層的顏色、邊線顏色、透明度等樣式進行設置；
- 編輯器：在web端顯示矢量瓦片效果時，採用MapboxGL地圖顯示渲染框架，將數據層劃分為background（背景）、circle（點）、line（線）、fill（區）和symbol（標記符號）五種類型，用戶可在"編輯器"中實時修改地圖渲染效果，下面分別舉例介紹五種類型的樣式修改語句：
background（背景）
參數名稱 | 參數含義 | 前提條件 | 單位 | 默認值 | CSS示例 |
|---|---|---|---|---|---|
| 填充色 | 背景填充顏色 | - | - | - | "background-color": "rgba(221, 92, 92, 1)" |
| 背景模式 | 背景填充符號的類型。 | - | - | - | "background--pattern": "respt_首都" |
| 透明度 | 填充符號的透明效果，透明度取值為0 到1之間的任意整數，1表示不透明，0表示完全透明。 | - | - | 1 | "background-opacity": 1 |
circle（點）
參數名稱 | 參數含義 | 前提條件 | 單位 | 默認值 | CSS示例 |
|---|---|---|---|---|---|
| 子圖顏色 | 圓符號RGB顏色值 | - | - | "circle-color": "rgba(245, 8, 46, 0.5)" | |
| 半徑 | 圓符號半徑 | - | 像素 | 5 | "circle-radius": 10 |
| 透明度 | 點符號填充透明度，1為不透明，0為全透明 | - | - | 1 | "circle-opacity": 0.5 |
| 模糊化 | - | - | 0 | "circle-blur": 0 | |
| 筆顏色 | 圓形符號邊界RGB顏色 | - | - | "circle-stroke-color":"rgba(230, 13, 13, 1)" | |
| 筆寬 | 圓形符號邊界寬度 | - | 像素 | 0 | "circle-stroke-width": 4 |
| 筆顏色透明度 | 變寬透明度，1為不透明，0為全透明 | - | - | 1 | "circle-stroke-opacity": 0.7 |
| 節距模式 | - | - | "circle-pitch-scale": "viewport" | ||
| 平移模式 | - | - | "circle-translate-anchor": "map" | ||
| 平移 | X/Y方向平移量 | - | 像素 | 0 | "circle-translate": [ 10, 0 ] |
line（線）
參數名稱 | 參數含義 | 前提條件 | 單位 | 默認值 | CSS示例 |
|---|---|---|---|---|---|
| 線顏色 | 線顏色 | "line-color": "rgba(211, 12, 43, 1)" | |||
| 線寬 | 線寬 | 像素 | 1 | "line-width": 1, | |
| 透明度 | 線的透明度 | 1 | |||
| 模糊化 | 線邊界模糊 | 像素 | 0 | "line-blur": 0 | |
| 線頭 | 線頭類型，可選擇圓頭、平頭和方頭 | Butt | "line-cap": "butt" | ||
| 拐角 | 線的拐角類型，可選Bevel、Round和Miter | Miter | "line-join": "Miter" | ||
| 斜接限制 | 自動將拐角類型由miter改成bevel | 拐角選擇為Miter | 2 | "line-miter-limit": 2 | |
| 圓角限制 | 自動將拐角類型由round改成miter | 拐角選擇為Round | 1.05 | "line-round-limit": 1.05 | |
| 虛線和間隔樣式 | 描述線圖層輪廓的虛線和間隔樣式，是虛線和間隙值的集合（奇數項為虛線長度；偶數項為間隙長度） | 線寬單位 | "line-dasharray": [ 6, 3, 3, 3 ] | ||
| 線偏移 | 相對原始線偏移量，根據設置的正負數向左右偏移 | 像素 | 0 | "line-offset": 0 | |
| 線填充圖案 | 線的填充圖案 | "line-pattern": "othnt_point" | |||
| 平移 | 相對原始線的偏移量 | 像素 | 0,0 | "line-translate": [ 0, 0 ] | |
| 平移模式 | 選擇平移模式為map或viewport | 線設置平移 | Map | "fill-translate-anchor": "map" | |
| 間隔寬度 | 雙線的間隔寬度 | 像素 | 0 | "line-gap-width": 0 |
fill（區）
參數名稱 | 參數含義 | 前提條件 | 單位 | 默認值 | CSS示例 |
|---|---|---|---|---|---|
| 區填充圖案 | 填充符號的類型。 | - | - | "fill-pattern": "respt_首都" | |
| 填充色 | 填充矢量瓦片區圖層的顏色。 | - | RGB | "fill-outline-color": "rgba(221, 92, 92, 1)" | |
| 輪廓顏色 | 填充矢量瓦片區邊界的顏色。 | - | RGB | "fill-color": "rgba(190,220,175,1.0)" | |
| 透明度 | 填充符號的透明效果，透明度取值為0 到1之間的任意整數，1表示不透明，0表示完全透明。 | - | 1 | "fill-opacity": 1 | |
| 抗鋸齒 | 消除區邊緣出現凹凸鋸齒，使之平滑顯示 | - | true | "fill-antialias": true | |
| 平移模式 | 選擇平移模式為map或viewport | - | map | "fill-translate-anchor": "viewport" | |
| 平移 | 基於原始位置上,再按照屏幕座標偏移 | - | 像素 | 0,0 | "fill-translate": [ 0, 0 ] |
symbol（標記）
參數名稱 | 參數含義 | 前提條件 | 單位 | 默認值 | CSS示例 |
|---|---|---|---|---|---|
| 位置 | 註記模式，有點和線兩種 | - | - | point | "symbol-placement": "line" |
| 間距 | 線上重複標記註記的間距？可是為10、0時候不對？ | 線模式下才可用 | 像素 | 250 | "symbol-spacing": 100 |
| 是否描邊 | 瓦片邊緣？？ | - | - | false | "symbol-avoid-edges": true |
| 文本 | 註記所在屬性字段 | - | - | "text-field": "{Name_chn}" | |
| 字體 | 註記的字體 | 已設置註記文本 | - | - | "text-font": [ "微軟雅黑", "微軟雅黑" ] |
| 字號 | 註記大小 | 已設置註記文本 | 像素 | 16 | "text-size": 30 |
| 文本顏色 | 註記顏色 | 已設置註記文本 | - | - | "text-color": "rgba(255, 0, 0, 1)" |
| 文本透明度 | 註記透明度 | 已設置註記文本 | - | 1 | "text-opacity": 1 |
| 最大寬度 | 用於文本換行的最大寬度 | 已設置註記文本 | Ems（瀏覽器字體大小） | 10 | "text-max-width": 3 |
| 文本行高 | 換行時的行上下間距 | 已設置註記文本 | Ems（瀏覽器字體大小） | 1.2 | "text-line-height": 2 |
| 字符間距 | 字符間的行間距 | 已設置註記文本 | Ems（瀏覽器字體大小） | 0 | "text-letter-spacing": 1 |
| 文本間距 | 多個文本間距，若小於此間距，會自動進行避讓不顯示 | 已設置註記文本 | 像素 | 2 | "text-padding": 4 |
| 文本光環顏色 | 字體外輪廓顏色 | 已設置註記文本 | - | - | "text-halo-color": "rgba(0, 0, 0, 1)" |
| 文本光環寬度 | 字體外輪廓寬度 | 已設置註記文本 | 像素 | 0 | "text-halo-width": 2 |
| 文本光環模糊化 | 字體外輪廓模糊化的寬度 | 已設置註記文本 | 像素 | 0 | "text-halo-blur": 0 |
| 文本允許重疊 | 勾選時，即使多個文本間存在衝突，也會全部顯示 | 已設置註記文本 | - | false | "text-allow-overlap": false |
| 忽略位置 | 勾選時，即使子圖符號間存在衝突，也會全部顯示 | 已設置註記文本 | - | false | "text-ignore-placement": false |
| 文本節距排列 | 自動匹配“旋轉對齊”的值 | 已設置註記文本 | - | auto | "text-pitch-alignment": "auto" |
| 旋轉對齊 | ？？？ | 已設置註記文本 | - | auto | "text-rotation-alignment": "auto" |
| 文本對齊 | 換行對齊方式 | 已設置註記文本 | - | center | "text-justify": "left" |
| 文本排列 | 註記圍繞定位點的方位 | 已設置註記文本 | - | center | "text-anchor": "left" |
| 最大角度 | 字符間最大變化角度？ | 採用線模式註記 | 度 | 45 | "text-max-angle": 45 |
| 旋轉角度 | 註記旋轉角度 | 已設置註記文本 | 度 | 0 | "text-rotate": 0 |
| 是否保持垂直 | “位置”為“line” “旋轉對齊”為“map” | - | true | "text-keep-upright": false | |
| 大小寫轉換 | None：不執行； Uppercase：所有字母用大寫； Lowercase：所有字母用小寫； | - | - | none | "text-transform": "none" |
| 文本偏移 | 註記在X/Y方向偏移值 | - | ems | 0,0 | "text-offset": [ 4, 5 ] |
| 文本可選 | 值為true，當註記與其他子圖符號存在衝突時，只顯示子圖符號，不顯示註記文本 | - | - | false | "text-optional": true |
| 文本平移排列 | - | map | "text-translate-anchor": "viewport" | ||
| 文本平移 | - | 像素 | 0,0 | "text-translate": [ 3, 4 ] | |
| 圖符大小 | 註記填充圖案的大小 | 已設置“註記填充圖案” | 圖標大小倍數 | 1 | "icon-size": 3 |
| 圖符顏色 | 註記填充圖案的顏色 | 已設置“註記填充圖案” | - | "icon-color": "rgba(252, 0, 40, 1)" | |
| 圖符透明度 | 註記填充圖案的透明度 | 已設置“註記填充圖案” | - | 1 | "icon-opacity": 0.5 |
| 註記填充圖案 | 註記填充圖案的樣式 | - | - | - | "icon-image": "respt_首都" |
| 圖符文本自適應 | ？？ | - | - | none | "icon-text-fit": "none" |
| 圖符文本自適應間距 | 添加到'圖標文本擬合'尺寸的附加區域的大小，按順時針順序：頂部，右側，底部，左側？？ | - | 像素 | 0,0,0,0 | "icon-text-fit-padding": [ 1, 2, 3, 4 ] |
| 圖符間距 | ？？ | - | 像素 | 2 | "icon-padding": 1 |
| 圖符光環顏色 | 子圖 | - | - | - | "icon-halo-color": "rgba(245, 166, 35, 1)" |
| 圖符光環寬度 | - | 像素 | 0 | "icon-halo-width": 1 | |
| 圖符光環模糊化 | - | 像素 | 0 | "icon-halo-blur": 2 | |
| 是否重疊 | ？？ | - | - | false | "icon-allow-overlap": true |
| 忽略位置 | ？？ | - | - | false | "icon-ignore-placement": true |
| 圖符可選 | ？？ | - | - | false | "icon-optional": false |
| 旋轉排列 | - | - | auto | "icon-rotation-alignment": "map" | |
| 圖符旋轉 | - | 度 | 0 | "icon-rotate": 0 | |
| 是否保持垂直 | - | - | false | "icon-keep-upright": true | |
| 圖符偏移 | - | ？ | 0,0 | "icon-offset": [ 1, 1 ] | |
| 圖符平移 | - | - | 0，0 | "icon-translate": [ 2, 2 ] | |
| 圖符平移排列 | - | - | - | "icon-translate-anchor": "viewport" |