MindFusion.Diagramming for WinForms是一個能幫助你創建工作流和進程圖表的.NET控件；數據庫實體關系圖表；組織圖表；對象層次和關系圖表；圖表和樹。它是基于對象－圖表框，表格和箭頭類型，將其歸類分派給其他并結合成復雜的結構。該控件提供超過預先定義的50多種圖表框，如自定義設計樣式和對圖表框著色等。MindFusion.Diagramming for WinForms現已加入在線訂購，Standard Single Developer版本原價2848現在搶購立享優惠只需2345，立即查看詳情>>

點擊下載MindFusion.Diagramming for WinForms最新試用版

在此博客文章中，我們將使用JavaScript地圖庫的CanvasLayer來構建一個網頁，該網頁呈現由各公司快遞公司覆蓋的具有覆蓋區域的多邊形的城市地圖。每個區域都是不同顏色的單獨區域。這是最終結果：

I.常規設置

我們從一個空的網頁開始，在其中添加對映射JavaScript文件和包含映射庫使用的Utility類的其他文件的引用：

<script src="Scripts/MindFusion.Common.js"
type="text/javascript"></script> <script
src="Scripts/jscommon.js" type="text/javascript"></script>
<script src="Scripts/jscollections.js"
type="text/javascript"></script> <script
src="Scripts/MindFusion.Mapping.js"
type="text/javascript"></script>

然后，我們需要創建一個具有ID的DIV。DIV元素是將在其中渲染地圖的位置，因此我們必須為其賦予我們希望地圖具有的位置和大小。如果網頁：

<div style="top: 70px; bottom: 24px;">
<div style="position: absolute; width: 100%; height:
100%;"> <div id="mapView" style="height: 100%; width: 100%;">
</div>
</div>
</div>

MindFusion映射庫創建的每個地圖均由MapView和MapLayer表示。該MapView類類需要一個HTML元素的引用，我們使用DIV，這是我們在網頁中作為參數初始化。創建視圖后，我們可以通過為其分配給定主題來自定義其外觀。每個主題的名稱與存儲其設置的CSS文件的名稱相對應。我們在地圖中使用標準主題：

// create a new instance of the mapView
var view = new m.MapView(document.getElementById("mapView"));
view.theme = "standard";

var l = new m.MapLayer("Map");

l.urlTemplate = "http://d.tile.stamen.com/terrain/{z}/{x}/{y}.png";
l.attribution = 'Map tiles by Stamen
Design, under CC BY 3.0. Data
by OpenStreetMap, under ODbL.';
view.layers.add(l);

CanvasLayer是可容納多邊形或圓形附圖層。兩種類型的工程圖都支持填充和描邊，這是使多邊形變為半透明的方式。在保利的構造要求與建設圖中的點列表。該圖可以閉合且光滑。在我們的情況下，我們需要一個封閉的圖形，但要關閉“平滑”選項。我們還可以選擇指定strokeThickness。請注意，厚度是以米為單位提供的，例如，它將隨著地圖的縮放比例而變化。這是帶有區域區域之一的點的示例列表：

//John Wilson
var points = [
    new m.LatLong(42.70475564699256, 23.31153304748534),
    new m.LatLong(42.70557559570199, 23.3120480316162),
    new m.LatLong(42.70488179365276, 23.32380683593749),
    new m.LatLong(42.69773045026787, 23.32174689941405),    
    new m.LatLong(42.699835727309186, 23.310202671813954)];

var drawings = new m.CanvasLayer("John Wilson");
view.layers.add(drawings);

// create a smooth polyline connecting the points
var poly = new m.Poly(points);
poly.stroke = "#4164BE";
poly.fill = "rgba(65, 100, 190, 0.4)";
// stroke thickness in meters
poly.strokeThickness = 2;
poly.strokeDashStyle = d.DashStyle.Solid;
poly.smooth = false;
poly.closed = true;
drawings.decorations.add(poly);

// set the topmost map layer
view.activeLayer = view.mapLayers.items()[0];

// load all layers
view.load(new m.LatLong(42.69743870212541, 23.3230343597412), 15);

關于JavaScript的MindFusion映射：映射庫是用純JavaScript編寫的，并支持豐富的API，用于創建和自定義任何類型的地圖。該組件需要圖塊地圖服務（TMS）作為地圖的提供程序。如果需要的話，有一個特殊的屬性可以記入TMS提供程序。

JavaScript映射支持無限數量的地圖層。這些圖層可以容納圖釘，標簽，標記，圖像圖標，注釋或多邊形。它們可以打開或關閉。地圖UI的外觀是通過主題指定的。每個地圖都支持縮放和平移。在//mindfusion.eu/javascript-map.html上找到有關JavaScript映射的更多信息。