繪圖管理器虛線樣式
API使用範例：繪圖管理器虛線樣式
情境假設：
繪圖管理器中，使用者可以在地圖上繪製幾何圖形與線段，幾何圖形包括圓形、多邊形與矩形，除了線段的粗細與填滿的顏色可自由調整外，外框與線段樣式也可以設定成不同樣式，除了實線外，也可以由虛線或點構成，以下範例將以繪圖管理器繪製圖形，並以虛線外框呈現。
TGOS MAP API建置方式：
1. 初始化地圖：
首先宣告一個TGOnlineMap( )物件，在網頁上建立一個地圖，並選擇座標系統。
var mDiv = document.getElementById("TGMap");
var map = new TGOS.TGOnlineMap(mDiv, TGOS.TGCoordSys.EPSG3826, {
mapTypeControlOptions: {
mapTypeControlStyle: TGOS.TGMapTypeControlStyle.DEFAULT
}
});
2. 建立繪圖管理器
2.1在地圖上建立繪圖管理器
var dm = new TGOS.TGDrawing(); //建立繪圖管理器物件
2.2對繪圖管理器進行更進一步的設定
首先加載繪圖管理器於指定的地圖上，並進行相關細部設定，本範例將繪圖管理器放置於地圖的右下角，並開啟多邊形、矩形、線段與圓形四種繪圖功能。
dm.setMap(map); //設定繪圖管理器顯示的地圖物件
dm.setOptions({ //設定繪圖管理器屬性項目
drawingControl: true, //啟用繪圖管理器功能
drawingControlOptions: { //設定繪圖控制項
position: TGOS.TGControlPosition.BOTTOM_RIGHT, //繪圖管理器選單在畫面上的位置
drawingModes :[TGOS.TGOverlayType.POLYGON,TGOS.TGOverlayType.CIRCLE,TGOS.TGOverlayType.LINESTRING,TGOS.TGOverlayType.ENVELOPE]//指定繪圖控制項可繪製的疊加層種類
},
})
3. 修改各種圖形樣式設定
3.1 繪圖管理器樣式設定
先輸入繪圖管理器設定的指令
dm.setOptions({
}
3.2 線段與各式圖形樣式設定
繪圖管理器中，線段、矩形、圓形與多邊形的樣式設定指令各不相同，需個別設定，而線段與圖形的外框樣式可指定以下種類：
線段(外框)樣式選擇： "", "-", ".", "-.", "-..", ". ", "- ", "--", "- .", "--.", "--.."
3.3線段設定
線段設定參考TGLine()的設定。
polylineOptions: {
strokeWeight: 3, //線段粗細
strokeDasharray: ". ", //線段樣式
strokeColor: '#000000', //設定線段顏色
strokeOpacity: 1 //設定線段透明度
},
3.4多邊形設定
圖形設定方面，包括多邊形、圓形與矩形，則參考TGFill()的設定。
polygonOptions: {
clickable: false,
strokeWeight: 3, //多邊形外框粗細
strokeDasharray: "- ", //多邊形外框線樣式
strokeColor: '#000000', //設定外框顏色
strokeOpacity: 1, //設定外框透明度
fillColor: '#FFFFFF', //設定填色顏色
fillOpacity: 1 //設定填色透明度
},
3.5圓形設定
圖形設定方面，包括多邊形、圓形與矩形，則參考TGFill()的設定。
circleOptions: {
strokeWeight: 3, //圓形外框粗細
strokeDasharray: "--.", //圓形外框線樣式
strokeColor: '#000000', //設定外框顏色
strokeOpacity: 1, //設定外框透明度
fillColor: '#FFFFFF', //設定填色顏色
fillOpacity: 1 //設定填色透明度
},
3.6矩形設定
圖形設定方面，包括多邊形、圓形與矩形，則參考TGFill()的設定。
envelopeOptions: {
strokeWeight: 3, //矩形外框粗細
strokeDasharray: "- .", //矩形外框線樣式
strokeColor: '#000000', //設定外框顏色
strokeOpacity: 1, //設定外框透明度
fillColor: '#FFFFFF', //設定填色顏色
fillOpacity: 1 //設定填色透明度
}
