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

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

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

I.常規(guī)設(shè)置

我們從一個空的網(wǎng)頁開始，在其中添加對映射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>

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

<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映射庫創(chuàng)建的每個地圖均由MapView和MapLayer表示。該MapView類類需要一個HTML元素的引用，我們使用DIV，這是我們在網(wǎng)頁中作為參數(shù)初始化。創(chuàng)建視圖后，我們可以通過為其分配給定主題來自定義其外觀。每個主題的名稱與存儲其設(shè)置的CSS文件的名稱相對應(yīng)。我們在地圖中使用標(biāo)準(zhǔn)主題：

// 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是可容納多邊形或圓形附圖層。兩種類型的工程圖都支持填充和描邊，這是使多邊形變?yōu)榘胪该鞯姆绞健Ｔ诒＠臉?gòu)造要求與建設(shè)圖中的點列表。該圖可以閉合且光滑。在我們的情況下，我們需要一個封閉的圖形，但要關(guān)閉“平滑”選項。我們還可以選擇指定strokeThickness。請注意，厚度是以米為單位提供的，例如，它將隨著地圖的縮放比例而變化。這是帶有區(qū)域區(qū)域之一的點的示例列表：

//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);

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

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