原創|使用教程|編輯:郝浩|2013-04-28 15:39:55.000|閱讀 405 次
概述:在Map Suite MVC Edition中TextStyle主要用來在地圖中標記項目。由于每個Shapefile都有一個相關的.dbf文件,它包含了每條記錄的描述,使用TextStyle最常見的方式就是標記功能。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
在Map Suite MVC Edition中TextStyle主要用來在地圖中標記項目。由于每個Shapefile都有一個相關的.dbf文件,它包含了每條記錄的描述,使用TextStyle最常見的方式就是標記功能。例如,Shapefile包含了擁有世界上所有首都的相應.dbf文件,這個文件又包含了一個叫"CITY_NAME"的字段(如圖一)。我們可以利用這個區域來標注地圖上的城市。
	
圖一
Map Suite MVC Edition有很多內置的TextStyles,它們將幫助我們快速設計地圖中的城市標簽。我們可以根據自己的喜好隨便挑選TEXTSTYLE。
    @{Html.ThinkGeo().Map("Map1", 600, 500)
        .MapBackground(new BackgroundLayer(new GeoSolidBrush(GeoColor.GeographicColors.ShallowOcean)))
        .CurrentExtent(-131.22, 55.05, -54.03, 16.91)
        .MapUnit(GeographyUnit.DecimalDegree)
        .StaticOverlay(overlay =>
        {
            // All of this code can alternatively be placed in the controller.
            // Please reference the sample applications that came with your copy of Map Suite MVC Edition for detail.
 
            // World layer
            ShapeFileFeatureLayer worldLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite MVC Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\cntry02.shp");
            worldLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.Country1;
            worldLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
            overlay.Layer(worldLayer);
 
            // Capital cities layer
            ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite MVC Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\capital.shp");
            capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.Capital3;
            capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
            overlay.Layer(capitalLayer);
 
            // Label layer
            ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite MVC Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\capital.shp");
            // We'll use a preset TextStyle. Here we pass in the "CITY_NAME", which is the name of the field we want to label on the map.
            capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.Capital3("CITY_NAME");
            capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
            // Since the map is drawn with tiles, the label needs to draw on the margin to make sure the text is complete after joining the tiles together.
            // Change the number below (to 0, for example) and you will be able to see what we mean.
            capitalLabelLayer.DrawingMarginPercentage = 50;
            overlay.Layer(capitalLabelLayer);
 
        })
        .Render();
    }
效果圖如下:
	
圖二、使用TextStyle的歐洲地圖
現在我們知道如何使渲染文字和符號,接下來我們在一個單層中定義兩種不同ZoomLevels,并創建自己的自定義樣式和TextStyle。
    @{Html.ThinkGeo().Map("Map1", 600, 500)
        .MapBackground(new BackgroundLayer(new GeoSolidBrush(GeoColor.GeographicColors.ShallowOcean)))
        .CurrentExtent(5, 78, 30, 26)
        .MapUnit(GeographyUnit.DecimalDegree)
        .StaticOverlay(overlay =>
        {
            // All of this code can alternatively be placed in the controller.
            // Please reference the sample applications that came with your copy of Map Suite MVC Edition for detail.
 
            // World layer
            ShapeFileFeatureLayer worldLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite Mvc Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\cntry02.shp");
            worldLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.Country1;
            worldLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
            overlay.Layer(worldLayer);
 
            // Capital layer
            ShapeFileFeatureLayer capitalLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite Mvc Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\capital.shp");
            // We can customize our own Style. Here we pass in a color and a size.
            capitalLayer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimpleCircleStyle(GeoColor.StandardColors.White, 7, GeoColor.StandardColors.Brown);
            // The Style we set here is applied from ZoomLevel01 to ZoomLevel05. That means if we zoom in a bit more, this particular style will not be visible anymore.
            capitalLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;
 
            capitalLayer.ZoomLevelSet.ZoomLevel06.DefaultPointStyle = PointStyles.Capital3;
            // The Style we set here is applied from ZoomLevel06 to ZoomLevel20. That means if we zoom out a bit more, this particular style will not be visible anymore.
            capitalLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
 
            overlay.Layer(capitalLayer);
 
            // Label layer
            ShapeFileFeatureLayer capitalLabelLayer = new ShapeFileFeatureLayer(@"C:\Program Files (x86)\ThinkGeo\Map Suite Mvc Evaluation Edition 6.0\Samples\CSharp HowDoISamples Razor\App_Data\capital.shp");
            // We can customize our own TextStyle. Here we pass in the font, the size, the style and the color.
            capitalLabelLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.CreateSimpleTextStyle("CITY_NAME", "Arial", 8, DrawingFontStyles.Italic, GeoColor.StandardColors.Black, 3, 3);
            // The TextStyle we set here is applied from ZoomLevel01 to ZoomLevel05. 
            capitalLabelLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level05;
 
            capitalLabelLayer.ZoomLevelSet.ZoomLevel06.DefaultTextStyle = TextStyles.Capital3("CITY_NAME");
            // The TextStyle we set here is applied from ZoomLevel06 to ZoomLevel20. 
            capitalLabelLayer.ZoomLevelSet.ZoomLevel06.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
 
            capitalLabelLayer.DrawingMarginPercentage = 50;
            overlay.Layer(capitalLabelLayer);
 
        })
        .Render();
    }
通過上面的操作后,你還能想象地圖的樣子嗎?請看下面的圖片(圖三)。起初它看起來和上面的圖二是一樣的,但是放大后,你可以看到地圖的變化了(見圖四)。
	
圖三、擁有兩種ZoomLevels的歐洲城市地圖,地圖放大前
	
圖四、擁有兩種ZoomLevels的歐洲城市地圖,地圖放大后
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@ke049m.cn
文章轉載自:慧都控件網