永利最大(官方)网站

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