在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的歐洲城市地圖，地圖放大后