This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
thinkgeo_cloud_maps_vector_tiles [2019/03/11 16:27] brianr [ThinkGeo Cloud Maps Vector Tiles] |
thinkgeo_cloud_maps_vector_tiles [2019/05/07 08:53] (current) tgwikiupdate |
||
|---|---|---|---|
| Line 11: | Line 11: | ||
| //**ThinkGeo Cloud provides a RESTful API to consume the map tiles**:// | //**ThinkGeo Cloud provides a RESTful API to consume the map tiles**:// | ||
| + | |||
| + | ==== Get Maps Vector Tile By XYZ ==== | ||
| + | Get the vector tile at the specified zoom level and X/Y coordinate, using the supplied parameters. | ||
| <code html> | <code html> | ||
| Line 16: | Line 19: | ||
| https://cloud.thinkgeo.com/api/v1/maps/vector/{srid}/{tileZ}/{tileX}/{tileY}.pbf?apikey={key} | https://cloud.thinkgeo.com/api/v1/maps/vector/{srid}/{tileZ}/{tileX}/{tileY}.pbf?apikey={key} | ||
| </code> | </code> | ||
| - | * //**srid**//: The spatial reference system ID for the tile you are requesting. Currently only "3857" (Spherical Mercator) is supported. | + | * <html><span class="api-parameter"><span class="api-parameter-name">srid:</span> The spatial reference system ID for the tile you are requesting. Currently only "3857" (Spherical Mercator) is supported.</span></html> |
| - | * //**tileZ**//: The Z index (zoom level) of the requesting tile, from 0 to 19. Zoom Level 0 is the highest zoom level with the entire world in one single tile. Each zoom level //z// has 4<sup>//z//</sup> tiles for the entire world. The greater the z value, the closer to the Earth's surface the current zoom level is. | + | * <html><span class="api-parameter"><span class="api-parameter-name">tileZ:</span> The Z index (zoom level) of the requesting tile, from 0 to 19. Zoom Level 0 is the highest zoom level with the entire world in one single tile. Each zoom level <em>z</em> has 4<sup><em>z</em></sup> tiles for the entire world. The greater the z value, the closer to the Earth's surface the current zoom level is.</span></html> |
| - | * //**tileX**//: The X index (column index in the tiling matrix) of the requesting tile. Valid range is between 0 and 4<sup>//z//</sup> for each given zoom level //z//. | + | * <html><span class="api-parameter"><span class="api-parameter-name">tileX:</span> The X index (column index in the tiling matrix) of the requesting tile. Valid range is between 0 and 4<sup><em>z</em></sup> for each given zoom level <em>z</em>.</span></html> |
| - | * //**tileY**//: The Y index (row index in the tiling matrix) of the requesting tile. Valid range is between 0 and 4<sup>//z//</sup> for each given zoom level //z//. | + | * <html><span class="api-parameter"><span class="api-parameter-name">tileY:</span> The Y index (row index in the tiling matrix) of the requesting tile. Valid range is between 0 and 4<sup><em>z</em></sup> for each given zoom level <em>z</em>.</span></html> |
| - | * //**apikey**//: The ThinkGeo Cloud API key that authenticates your request. | + | * <html><span class="api-parameter"><span class="api-parameter-name">apikey:</span> The ThinkGeo Cloud API key that authenticates your request.</span></html> |
| Here is an example of a vector tile request URL: [[https://cloud.thinkgeo.com/api/v1/maps/vector/streets/3857/0/0/0.pbf?apiKey=apiKey]] (a valid API key is required). Please check out [[thinkgeo_cloud_client_keys_guideline|Client Keys Guideline]] to find out how to get your own API key. | Here is an example of a vector tile request URL: [[https://cloud.thinkgeo.com/api/v1/maps/vector/streets/3857/0/0/0.pbf?apiKey=apiKey]] (a valid API key is required). Please check out [[thinkgeo_cloud_client_keys_guideline|Client Keys Guideline]] to find out how to get your own API key. | ||
| Line 78: | Line 81: | ||
| <code javascript> | <code javascript> | ||
| - | <link rel="stylesheet" href="https://cdn.thinkgeo.com/vectormap-js/2.0.2/vectormap.css"></link> | + | <link rel="stylesheet" href="https://cdn.thinkgeo.com/vectormap-js/3.0.0/vectormap.css"></link> |
| - | <script src="https://cdn.thinkgeo.com/vectormap-js/2.0.2/vectormap.js"></script> | + | <script src="https://cdn.thinkgeo.com/vectormap-js/3.0.0/vectormap.js"></script> |
| </code> | </code> | ||
| Line 90: | Line 93: | ||
| <code javascript> | <code javascript> | ||
| - | var worldstreetsStyle = "https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/light.json"; | + | var worldstreetsStyle = "https://cdn.thinkgeo.com/worldstreets-styles/3.0.0/light.json"; |
| var worldstreets = new ol.mapsuite.VectorTileLayer(worldstreetsStyle, | var worldstreets = new ol.mapsuite.VectorTileLayer(worldstreetsStyle, | ||
| { | { | ||
| Line 98: | Line 101: | ||
| layers: [worldstreets], | layers: [worldstreets], | ||
| target: 'map', | target: 'map', | ||
| + | renderer: 'webgl', | ||
| view: new ol.View({ | view: new ol.View({ | ||
| center: [-10775718.490585351, 3868389.0226015863], | center: [-10775718.490585351, 3868389.0226015863], | ||
| zoom: 4, | zoom: 4, | ||
| - | maxResolution: 40075016.68557849 / 512, | + | maxResolution: 40075016.68557849 / 512 |
| }), | }), | ||
| }); | }); | ||
| Line 123: | Line 127: | ||
| </code> | </code> | ||
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-WinForms]] for [[map_suite_desktop_for_winforms|Map Suite Desktop For WinForms]] | + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWinforms|ThinkGeoCloudVectorMapsSample-WinForms]] for [[map_suite_desktop_for_winforms|Map Suite Desktop For WinForms]] |
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] | + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWpf|ThinkGeoCloudVectorMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] |
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-WebForms]] for [[map_suite_web_for_webforms|Map Suite Web For WebForms]] | + | * Sample code: [[https://github.com/ThinkGeo/SpatialQueryThinkGeoVectorMapsSample-ForWpf|SpatialQueryThinkGeoVectorMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] |
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-MVC]] for [[map_suite_web_for_mvc|Map Suite Web For MVC]] | + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForWpf|ThinkGeoMBTilesMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] |
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-iOS]] for [[map_suite_mobile_for_ios|Map Suite Mobile For iOS]] | + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForiOS|ThinkGeoCloudVectorMapsSample-iOS]] for [[map_suite_mobile_for_ios|Map Suite Mobile For iOS]] |
| - | * Sample code: [[notexist|ThinkGeoCloudVectorMapsSample-Android]] for [[map_suite_mobile_for_android|Map Suite Mobile for Android]] | + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForiOS|ThinkGeoMBTilesMapsSample-iOS]] for [[map_suite_mobile_for_ios|Map Suite Mobile For iOS]] |
| + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForAndroid|ThinkGeoCloudVectorMapsSample-Android]] for [[map_suite_mobile_for_android|Map Suite Mobile for Android]] | ||
| + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForAndroid|ThinkGeoMBTilesMapsSample-Android]] for [[map_suite_mobile_for_android|Map Suite Mobile for Android]] | ||
| + | * Sample code: [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWebApi|ThinkGeoCloudVectorMapsSample-WebApi]] for [[map_suite_web_for_webapi|Map Suite Desktop For WebApi]] | ||
| ==== From Client Side SDKs ==== | ==== From Client Side SDKs ==== | ||
| - | A .Net SDK //ThinkGeo Cloud Client// is provided to consume the ThinkGeo Cloud Service as well. It's available on [[https://www.nuget.org/packages/ThinkGeo.Cloud.Client|NuGet]], here is the complete [[thinkgeo_cloud_.net_client_apis|API List]]. | + | Our .NET SDK //ThinkGeo Cloud Client// makes it easy to consume all of the ThinkGeo Cloud services in your applications. It's available on [[https://www.nuget.org/packages/ThinkGeo.Cloud.Client|NuGet]]. IntelliSense hints will help you get started, and you can also refer to the [[thinkgeo_cloud_.net_client_apis|ThinkGeo Cloud Client API list]] for details. |
| + | |||
| + | At the NuGet Package Manager terminal, you can install this package by running the command: ''Install-Package ThinkGeo.Cloud.Client -Version VERSION_TO_BE_INSTALLED''. You can also check out ThinkGeo on GitHub for [[https://github.com/ThinkGeo?utf8=%E2%9C%93&q=cloud&type=&language=|samples utilizing the ThinkGeo Cloud Client]]. | ||
| Sample Code: | Sample Code: | ||
| Line 157: | Line 165: | ||
| Coming soon | Coming soon | ||
| - | |||
| </code> | </code> | ||
| - | Web Sample: | + | * [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWinforms|ThinkGeoCloudVectorMapsSample-WinForms]] for [[map_suite_desktop_for_winforms|Map Suite Desktop For WinForms]] |
| + | * [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWpf|ThinkGeoCloudVectorMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] | ||
| + | * [[https://github.com/ThinkGeo/SpatialQueryThinkGeoVectorMapsSample-ForWpf|SpatialQueryThinkGeoVectorMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] | ||
| + | * [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForWpf|ThinkGeoMBTilesMapsSample-WPF]] for [[map_suite_desktop_for_wpf|Map Suite Desktop For WPF]] | ||
| + | |||
| + | Mobile Sample: | ||
| <code csharp> | <code csharp> | ||
| Coming soon | Coming soon | ||
| - | |||
| </code> | </code> | ||
| - | Mobile Sample: | + | * [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForiOS|ThinkGeoCloudVectorMapsSample-iOS]] for [[map_suite_mobile_for_ios|Map Suite Mobile For iOS]] |
| + | * [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForiOS|ThinkGeoMBTilesMapsSample-iOS]] for [[map_suite_mobile_for_ios|Map Suite Mobile For iOS]] | ||
| + | * [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForAndroid|ThinkGeoCloudVectorMapsSample-Android]] for [[map_suite_mobile_for_android|Map Suite Mobile for Android]] | ||
| + | * [[https://github.com/ThinkGeo/ThinkGeoMBTilesMapsSample-ForAndroid|ThinkGeoMBTilesMapsSample-Android]] for [[map_suite_mobile_for_android|Map Suite Mobile for Android]] | ||
| + | |||
| + | Web Sample: | ||
| <code csharp> | <code csharp> | ||
| Coming soon | Coming soon | ||
| - | |||
| </code> | </code> | ||
| + | |||
| + | * [[https://github.com/ThinkGeo/ThinkGeoCloudVectorMapsSample-ForWebApi|ThinkGeoCloudVectorMapsSample-WebApi]] for [[map_suite_web_for_webapi|Map Suite Web for WebApi]] | ||
| + | |||