ThinkGeo Cloud
ThinkGeo UI Controls
ThinkGeo Open Source
Help and Support
External Resources
Sidebar
map_suite_web_for_webapi_all_samples
Table of Contents
WebAPI Samples
Quickstart Sample for WebApi
The Map Suite WebAPI illustrated QuickStart Guide will guide you through the process of creating a sample application and will help you become familiar with Map Suite. This edition of the QuickStart Guide supports Map Suite WebAPI 10.0.0.0 and higher and will show you how to create a ASP.NET WebAPI application using this product.
Please refer to Wiki for the details.
Quickstart Sample for WebApi .NetCore
Description
The guide will show you through the process of creating a sample of WebAPI application for rendering a shapefile with ThinkGeo.UI.WebApi and will help you become familiar with ThinkGeo Products. The Quickstart Guide supports ThinkGeo UI for WebApi 12.0 and higher.
Please refer to Wiki for the details.
About the Code
API
First, we need to create an API for reponding the getting tile requests. The code snippet shows like below:
[ApiController]
[Route("")]
public class DefaultController : ControllerBase
{
[Route("tile/{z}/{x}/{y}")]
public IActionResult GetMapTile(int z, long x, long y)
{
// Create the LayerOverlay for displaying the map.
var countriesLayer = new ShapeFileFeatureLayer(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "AppData", "Countries.shp"));
// Set the style for ZoomLevels.
countriesLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = new AreaStyle
{
FillBrush = new GeoSolidBrush(GeoColor.FromArgb(255, 233, 232, 214)),
OutlinePen = new GeoPen(GeoColors.Gray, 1)
};
countriesLayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = new TextStyle("CNTRY_NAME", new GeoFont("Arial", 10), GeoBrushes.Black);
// Apply the zoom level's style to zoom level 20.
countriesLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;
// Apply ProjectionConverter. The source is in DecimalDegree and needs to be convert to Mercator Projection.
countriesLayer.FeatureSource.ProjectionConverter = new ProjectionConverter(4326, 3857);
// Initialize a LayerOverlay.
var layerOverlay = new LayerOverlay();
layerOverlay.Layers.Add(countriesLayer);
return DrawTileImage(layerOverlay, z, x, y);
}
private IActionResult DrawTileImage(LayerOverlay layerOverlay, int z, long x, long y)
{
// Create a new GeoImage
using (GeoImage image = new GeoImage(256, 256))
{
var geoCanvas = GeoCanvas.CreateDefaultGeoCanvas();
// Get the BoundingBox for the specified x, y, z.
RectangleShape boundingBox = WebApiExtentHelper.GetBoundingBoxForXyz(x, y, z, GeographyUnit.Meter);
geoCanvas.BeginDrawing(image, boundingBox, GeographyUnit.Meter);
if (layerOverlay != null)
{
layerOverlay.Draw(geoCanvas);
}
geoCanvas.EndDrawing();
return File(image.GetImageBytes(), "image/png");
}
}
}
Client Side
Now we need to create a client side to consume the API, in this sample, we use OpenLayers v6.0.1.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>QuickStart</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="ThinkGeo" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.0.1/css/ol.css" type="text/css">
<style>
#map {
height: 600px;
width: 800px;
}
</style>
</head>
<body>
<div id="map">
</div>
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.0.1/build/ol.js"></script>
<script>
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.XYZ({
url: '/tile/{z}/{x}/{y}'
})
})
],
view: new ol.View({
center: [-472202, 5009377.08569731],
zoom: 1
})
});
</script>
</body>
</html>
Getting Help
About ThinkGeo
ThinkGeo is a GIS (Geographic Information Systems) company founded in 2004 and located in Frisco, TX. Our clients are in more than 40 industries including agriculture, energy, transportation, government, engineering, software development, and defense.
Display Cad File Sample for WinForms
This sample demonstrates how you can read data from an CAD file(*.dwg, *.dxf) in your Map Suite GIS applications, and how to render it with CAD embedded style as well as a customized style. This Cad File support would work in all of the Map Suite controls such as Wpf, Web, MVC and WebApi.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_winforms) for the details.
Layers Sample for WebApi
This sample shows the different types of layers and data formats you can use to build up your map.
Display Nautical Charts Sample for WebApi
This sample shows how you can use Map Suite WebAPI Edition to display nautical charts in your web application.
Please refer to Wiki for the details.
ThinkGeo Cloud Vector Maps Sample for WebApi
This sample demonstrates how you can draw the map with Vector Tiles requested from ThinkGeo Cloud Services in your Map Suite GIS applications, with any style you want from StyleJSON (Mapping Definition Grammar). It will show you how to use the XyzFileBitmapTileCache and XyzFileVectorTileCache to improve the performance of map rendering. It supports 3 built-in default map styles and more awasome styles from StyleJSON file you passed in, by 'Custom': - Light - Dark - TransparentBackground - Custom
ThinkGeo Cloud Vector Maps support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to Wiki for the details.
Getting Started Sample for WebApi
This sample shows you how to get started building your first application with the Map Suite WebAPI Edition.
Please refer to Wiki for the details.
Site Selection Sample for WebApi
This sample template allows you to view, understand, interpret, and visualize spatial data in many ways that reveal relationships, patterns, and trends. In this example, the user can apply the features of GIS to analyze spatial data to efficiently choose a suitable site for a new retail outlet.
Please refer to Wiki for the details.
Routing Data Explorer Sample for Wpf
This is a simple routing data viewer sample viewer which demonstrates how to use the RoutingEngine to get the shortest or fastest route in your Map Suite GIS applications.
How to use this tool:
1. Load rtg data: Click menu “File→Load” browse to a rtg file. You also require a shapefile for the routing source file in the same folder, otherwise it display message “Could not find shp file in the same folder where you seleted”. 2. Start routing:
Use left click for a start point and right click for an end point. If there is no route within **200** meters(you can modify this in source code), the explorer displays a message "There’s no road within 200 meters to where you clicked on".
This RoutingEngine supports routing in all of the Map Suite controls such as WinForms, Web, MVC and WebApi.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_wpf) for the details.
Display Wms Raster Layer Sample for WinForms
This sample demonstrates how you use WmsRasterLayer to render wms server in your Map Suite GIS applications. This WmsRasterLayer support would work in all of the Map Suite controls such as Wpf, Web, MVC and WebApi.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_winforms) for the details.
Hello World Sample for WebApi
This sample shows you how to get started building your first application with the Map Suite Web for WebApi 10.0.0.
Please refer to Wiki for the details.
Select Feature By Click Sample for WebApi
The purpose of this project is to show the technique for finding the feature the user clicked on. To give the user the expected behavior, a buffer in screen coordinates needs to be set so that the feature gets selected within a constant distance in screen coordinates to where the user clicked, regardless of the zoom level.
Please refer to Wiki for the details.
Building 3D JS Sample for WebApi
This project shows to create a simulated 3D buildings and use world map kit server as background map.
Please refer to Wiki for the details.
Query Tools Sample for WebApi
Display ThinkGeo Cloud Maps Sample for JavaScript
This sample demonstrates how you can display ThinkGeo Cloud Maps in a web page using javascript. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps works in all of the Map Suite controls such as Wpf, WinForms, Web, Android and iOS.
View this sample on Github # HowDoISample-ForWebAPI
### Description
The “How Do I?” samples collection is a comprehensive set containing dozens of interactive samples. Available in C# (WebAPI), these samples are designed to hit all the highlights of ThinkGeo WebAPI UIs, from simply adding a layer to a map to performing vehicle tracking and applying a thematic style. Consider this collection your “encyclopedia” of all the ThinkGeo basics and a great starting place for new users.
Please refer to [ThinkGeo Web UI for WebAPI](https://thinkgeo.com/gis-ui-web) for the details.
### About the Code Backgrounds for this sample are powered by ThinkGeo WebAPI Maps samples, please refer to [Online Sample](https://samples.thinkgeo.com/webapi/) for more details, in each sample, you can click the “View Source” button in the upper-right corner to get the sample code, Also here is [an entrance](https://gitlab.com/thinkgeo/public/thinkgeo-web-maps/-/tree/master/samples/web-api) for source code list.
### FAQ - Q: How do I make background map work? A: Backgrounds for this sample are powered by ThinkGeo Cloud Maps and require a Client ID and Secret. These were sent to you via email when you signed up with ThinkGeo, or you can register now at https://cloud.thinkgeo.com. Once you get them, please update the code in property ApiKey=“” in RazorControl partial classes.
### Getting Help
[ThinkGeo Community Site](https://community.thinkgeo.com)
[ThinkGeo Web Site](https://www.thinkgeo.com)
### About ThinkGeo ThinkGeo is a GIS (Geographic Information Systems) company founded in 2004 and located in Frisco, TX. Our clients are in more than 40 industries including agriculture, energy, transportation, government, engineering, software development, and defense.
Adornments Sample for WebApi
Learn how to add legends, scale bars, directional arrows, and many more adornments to your map.
Please refer to Wiki for the details.
Projection Sample for WebApi
Basic Styling Sample for WebApi
This sample shows you how to apply basic styles to render your vector data layers.
Please refer to Wiki for the details.
Labeling Sample for WebApi
This sample shows you how to examine different labeling techniques to make your maps informative.
Please refer to Wiki for the details.
Drawing And Editing Sample for WebApi
This sample demonstrates how to implement drawing and editing shapes into your web application.
Please refer to Wiki for the details.
Visualization Sample for WebApi
This sample shows you how to explore the different styles available to help you analyze and visualize your data.
Please refer to Wiki for the details.
Marker And Popup Sample for WebApi
This sample shows you how to make your maps more interactive by using Markers and Popups.
Please refer to Wiki for the details.
Topology Validation Sample for WebApi
Overlays Sample for WebApi
Discover how to use Overlays to build up your map, or to add existing basemaps to your application.
Please refer to Wiki for the details.
Printing Sample for WebApi
A demonstration of how to use printing with map suite that can be added to your projects.
Please refer to Wiki for the details.
ThinkGeo Cloud Maps Sample for Wpf
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_wpf) for the details.
Geometric Functions Sample for WebApi
This sample shows how to explore all the different APIs for Geometric Functions.
Please refer to Wiki for the details.
Cad Viewer Sample for Wpf
Description
This sample demonstrates how you can read data from an CAD file(*.dwg, *.dxf) in your Map Suite GIS applications, and how to render it with CAD embedded style as well as a customized style. This Cad File support would work in all of the Map Suite controls such as Wpf, Web, MVC and WebApi.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/thinkgeo_desktop_for_wpf) for the details.
### About the Code ```csharp CadFeatureLayer layer = new CadFeatureLayer(@“AppData\” + sampleFileListBox.SelectedItem.ToString()); layer.StylingType = CadStylingType.StandardStyling; layer.ZoomLevelSet.ZoomLevel01.DefaultLineStyle = LineStyles.CreateSimpleLineStyle(GeoColor.SimpleColors.Black, 2, true); layer.ZoomLevelSet.ZoomLevel01.DefaultPointStyle = PointStyles.CreateSimplePointStyle(PointSymbolType.Circle, GeoColor.SimpleColors.Blue, 8); layer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.SimpleColors.Yellow); layer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20; ```
### Getting Help
[ThinkGeo Desktop for Wpf Wiki Resources](http://wiki.thinkgeo.com/wiki/thinkgeo_desktop_for_wpf)
[ThinkGeo Desktop for Wpf Product Description](https://thinkgeo.com/ui-controls#desktop-platforms)
[ThinkGeo Community Site](http://community.thinkgeo.com/)
[ThinkGeo Web Site](http://www.thinkgeo.com)
### About ThinkGeo
ThinkGeo is a GIS (Geographic Information Systems) company founded in 2004 and located in Frisco, TX. Our clients are in more than 40 industries including agriculture, energy, transportation, government, engineering, software development, and defense.
ThinkGeo Cloud Maps Sample for Android
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, WinForms, Web, MVC, WebApi and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_mobile_for_android) for the details.
ThinkGeo Cloud Maps Sample for WebForms
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_web_for_webforms) for the details.
ThinkGeo Cloud Reverse Geocoding Sample for Wpf
This Sample demonstrates how you can use ThinkGeo Cloud Client to get meaningful addresses from ThinkGeo GIS Server by a geographic location. It ships with an optimized set of worldwide coverage of cities and towns, but any customized data can be supported as well.
ThinkGeo Cloud Client support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_wpf) for the details.
ThinkGeo Cloud Maps Sample for iOS
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, WinForms, Web, MVC, WebApi and Android.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_mobile_for_ios) for the details.
ThinkGeo Cloud Maps Sample for Mvc
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, WinForms, Web, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_web_for_mvc) for the details.
ThinkGeo Cloud Maps Sample for WinForms
This sample demonstrates how you can display ThinkGeo Cloud Maps in your Map Suite GIS applications. It will show you how to use the XYZFileBitmapTileCache to improve the performance of map rendering. ThinkGeoCloudMapsOverlay uses the ThinkGeo Cloud XYZ Tile Server as raster map tile server. It supports 5 different map styles: - Light - Dark - Aerial - Hybrid - TransparentBackground
ThinkGeo Cloud Maps support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_winforms) for the details.
ThinkGeo Cloud Geocoding Sample for Wpf
This Sample demonstrates how you can use ThinkGeo Cloud Client to get a geographic location from ThinkGeo GIS Server by a street address.
ThinkGeo Cloud Client support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_wpf) for the details.
ThinkGeo Cloud Elevation Sample for Wpf
This Sample demonstrates how you can use ThinkGeo Cloud Client to get elevation data from ThinkGeo GIS Server, and shows the elevation data of a road in the form of a line chart.
There are two ways to get the elevation data of the line. First, get the points on the line by setting the interval distance. The other, is to take the points by setting the number of points to be fetched. Then query the elevation data of the point.
ThinkGeo Cloud Client support would work in all of the Map Suite controls such as Wpf, Web, MVC, WebApi, Android and iOS.
Please refer to [Wiki](http://wiki.thinkgeo.com/wiki/map_suite_desktop_for_wpf) for the details.
map_suite_web_for_webapi_all_samples.txt · Last modified: 2023/08/29 12:27 by ruili