thinkgeo_stylejson
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
thinkgeo_stylejson [2020/01/21 03:16] johnnyz [Version 2.0.0] |
thinkgeo_stylejson [2020/01/21 03:41] (current) johnnyz [ThinkGeo StyleJSON Schema] |
||
|---|---|---|---|
| Line 6: | Line 6: | ||
| <markdown> | <markdown> | ||
| - | StyleJSON is a describable [cartographic](https://en.wikipedia.org/wiki/Cartography) styling language in the [JSON](http://www.json.org/) format, which is similar to working with a Cascading Style Sheet for styling webpages. It defines the visual appearance of a map - what data should be drawn, the drawing sequence, and how to style the data when drawing it. Taking advantage of StyleJSON will allow you to add a great-looking map to your project in minutes, a browser, a phone, a tablet, or even a watch. | + | StyleJSON is a describable [cartographic](https://en.wikipedia.org/wiki/Cartography) styling language in the [JSON](http://www.json.org/) format, which is similar to working with a Cascading Style Sheet (CSS) for styling web-pages. It defines the visual appearance of a map - what data should be drawn, he order to draw it in, and how to style the data when drawing it. Taking advantage of StyleJSON will allow you to add a great-looking map to your project in minutes, a browser, a phone, a tablet, or even a watch. |
| </markdown> | </markdown> | ||
| + | The intended audience of this specification includes: | ||
| + | * [[thinkgeo_stylejson#install_world_streets_styles|How to install the ThinkGeo "World Street Styles"]] | ||
| + | * [[thinkgeo_stylejson#stylejson_schema|"StyleJson" schema]] | ||
| ===== Install World Streets Styles ===== | ===== Install World Streets Styles ===== | ||
| Line 19: | Line 23: | ||
| <code JavaScript> | <code JavaScript> | ||
| - | <--Light Style--> | + | <--Light Style--> |
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/light.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/light.json"></script> |
| <--Dark Style--> | <--Dark Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/dark.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/dark.json"></script> |
| <--Transparent Background Style--> | <--Transparent Background Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/transparent-background.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/transparent-background.json"></script> |
| <--Cobalt Style--> | <--Cobalt Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/cobalt.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/cobalt.json"></script> |
| <--Grayscale Style--> | <--Grayscale Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/grayscale.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/grayscale.json"></script> |
| <--Muted Blue Style--> | <--Muted Blue Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/mutedblue.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/mutedblue.json"></script> |
| <--Sepia Style--> | <--Sepia Style--> | ||
| - | <script src="https://cdn.thinkgeo.com/worldstreets-styles/1.0.0/oldancient.json"></script> | + | <script src="https://cdn.thinkgeo.com/worldstreets-styles/4.0.0/oldancient.json"></script> |
| </code> | </code> | ||
| Line 44: | Line 48: | ||
| ==== NPM ==== | ==== NPM ==== | ||
| - | * Install the package: | + | Install the package: |
| <code JavaScript> | <code JavaScript> | ||
| npm i worldstreets-styles | npm i worldstreets-styles | ||
| </code> | </code> | ||
| - | |||
| Line 70: | Line 73: | ||
| The following example map is created with styleJson. | The following example map is created with styleJson. | ||
| - | [[https://maps.thinkgeo.com|{{worldstreets_v2.png|StyleJSON Map}}]] | + | [[https://maps.thinkgeo.com|{{thinkgeo_stylejson:worldstreets_v2.png|StyleJSON Map}}]] |
| * **styleJson object**<div>A styleJson declaration format consists of the following elements: | * **styleJson object**<div>A styleJson declaration format consists of the following elements: | ||
thinkgeo_stylejson.1579576600.txt.gz · Last modified: 2020/01/21 03:16 by johnnyz