thinkgeo_stylejson:v2
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
thinkgeo_stylejson:v2 [2020/01/19 08:52] johnnyz [Root Properties] |
thinkgeo_stylejson:v2 [2020/01/19 09:21] (current) johnnyz [ThinkGeo StyleJSON Schema] |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== ThinkGeo StyleJSON Schema ====== | + | ====== ThinkGeo StyleJSON Schema v2.0 ====== |
| Line 148: | Line 148: | ||
| </code> | </code> | ||
| - | * **id** | + | * **id**<div>//Required// `string` |
| - | + | ||
| - | //Required// `string` | + | |
| A map rendered style's unique identifier. | A map rendered style's unique identifier. | ||
| + | </div> | ||
| + | * **filter**<div>//Optional// `string` | ||
| - | * **filter** | + | Select some data which is need to render map.</div> |
| - | + | ||
| - | //Optional// `string` | + | |
| - | + | ||
| - | Select some data which is need to render map. | + | |
| - | + | ||
| - | * **z-index-atrribute-name** | + | |
| - | + | ||
| - | //Optional// `string` | + | |
| - | Map data would be sorted by this column's value. | + | * **z-index-atrribute-name**<div>//Optional// `string` |
| - | * **styles** | + | Map data would be sorted by this column's value.</div> |
| - | //Require// `array` | + | * **styles**<div>//Require// `array` |
| Some specific map rendered styles. | Some specific map rendered styles. | ||
| Line 190: | Line 182: | ||
| ] | ] | ||
| </code> | </code> | ||
| + | </div> | ||
| === Point === | === Point === | ||
| - | * **point-allow-overlapping** `boolean` | + | * **point-allow-overlapping** `boolean`<div> |
| - | Description: //Allows overlap with other text or icons.// | + | //Allows overlap with other text or icons.// |
| Default Value: `flase` | Default Value: `flase` | ||
| Line 201: | Line 193: | ||
| "point-allow-overlapping": false | "point-allow-overlapping": false | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-fill-color** `string`<div> | ||
| - | * **point-fill-color** `string` | + | //A defined fill color of symbol or glyph.// |
| - | + | ||
| - | Description: //A defined fill color of symbol or glyph.// | + | |
| <code json> | <code json> | ||
| "point-fill": "#fff" | "point-fill": "#fff" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-glyph-content** `string`<div> | ||
| - | * **point-glyph-content** `string` | + | //A defined glyph name that renders how a point appears.// |
| - | + | ||
| - | Description: //A defined glyph name that renders how a point appears.// | + | |
| <code json> | <code json> | ||
| Line 218: | Line 210: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-glyph-font-name** `string`<div> | ||
| - | * **point-glyph-font-name** `string` | + | //A defined glyph type that renders how a point appears.// |
| - | + | ||
| - | Description: //A defined glyph type that renders how a point appears.// | + | |
| <code json> | <code json> | ||
| "point-glyph-font-name": "vectormap-icons" | "point-glyph-font-name": "vectormap-icons" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-mask-color** `string`<div> | ||
| - | * **point-mask-color** `string` | + | //Sets the color of mask fill.// |
| - | + | ||
| - | Description: //Sets the color of mask fill.// | + | |
| <code json> | <code json> | ||
| Line 237: | Line 229: | ||
| </code> | </code> | ||
| + | </div> | ||
| - | * **point-mask-margin** `string` | + | * **point-mask-margin** `string`<div> |
| - | Description: //Sets the 4 distances of mask margin, in pixels.// | + | //Sets the 4 distances of mask margin, in pixels.// |
| Default Value: `0,0,0,0` | Default Value: `0,0,0,0` | ||
| Line 246: | Line 239: | ||
| "point-mask-margin": "1,1,1,1" | "point-mask-margin": "1,1,1,1" | ||
| </code> | </code> | ||
| + | </div> | ||
| - | * **point-mask-outline-color** `string` | + | * **point-mask-outline-color** `string`<div> |
| - | Description: //Sets the color of mask outline.// | + | //Sets the color of mask outline.// |
| <code json> | <code json> | ||
| "point-mask-outline-color": "#000" | "point-mask-outline-color": "#000" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-mask-outline-width** `number`<div> | ||
| - | * **point-mask-outline-width** `number` | + | //Sets the width of mask outline, in pixels.// |
| - | + | ||
| - | Description: //Sets the width of mask outline, in pixels.// | + | |
| <code json> | <code json> | ||
| "point-mask-outline-width": 3 | "point-mask-outline-width": 3 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-mask-type** `enum`<div> | ||
| - | * **point-mask-type** `enum` | + | //Sets the type of text mask.// |
| - | + | ||
| - | Description: //Sets the type of text mask.// | + | |
| Available Values: `default` `rectangle` `roundedCorners` `roundedEnds` `circle` | Available Values: `default` `rectangle` `roundedCorners` `roundedEnds` `circle` | ||
| Line 273: | Line 266: | ||
| "point-mask-type": "circle" | "point-mask-type": "circle" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-offset-x** `number`<div> | ||
| - | * **point-offset-x** `number` | + | //The horizontal offset of drawn graphic. // |
| - | + | ||
| - | Description: //The horizontal offset of drawn graphic. // | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 282: | Line 275: | ||
| "point-offset-x": 3 | "point-offset-x": 3 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-offset-y** `number`<div> | ||
| - | * **point-offset-y** `number` | + | //The vertical offset of drawn graphic.// |
| - | + | ||
| - | Description: //The vertical offset of drawn graphic.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 291: | Line 284: | ||
| "point-offset-y": 3 | "point-offset-y": 3 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-opacity** `number`<div> | ||
| - | * **point-opacity** `number` | + | //Sets the overall opacity of the point.// |
| - | + | ||
| - | Description: //Sets the overall opacity of the point.// | + | |
| Default Value:`1`, //the point if fully opaque.// | Default Value:`1`, //the point if fully opaque.// | ||
| Available Values: `0` to `1` | Available Values: `0` to `1` | ||
| Line 302: | Line 295: | ||
| "point-opacity": 1 | "point-opacity": 1 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-outline-color** `string`<div> | ||
| - | * **point-outline-color** `string` | + | //A defined outline color of symbol or glyph.// |
| - | + | ||
| - | Description: //A defined outline color of symbol or glyph.// | + | |
| <code json> | <code json> | ||
| "point-outline-color": "#000" | "point-outline-color": "#000" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-outline-width** `number`<div> | ||
| - | * **point-outline-width** `number` | + | //A defined outline width of symbol or glyph.// |
| - | + | ||
| - | Description: //A defined outline width of symbol or glyph.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 321: | Line 314: | ||
| "point-outline-width": 1 | "point-outline-width": 1 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-rotation-angle** `number`<div> | ||
| - | * **point-rotation-angle** `number` | + | //A defined rotate angle that how a point appears.// |
| - | + | ||
| - | Description: //A defined rotate angle that how a point appears.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 330: | Line 323: | ||
| "point-rotation-angle": 90 | "point-rotation-angle": 90 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-size** `number`<div> | ||
| - | * **point-size** `number` | + | //A defined size of symbol or glyph.// |
| - | + | ||
| - | Description: //A defined size of symbol or glyph.// | + | |
| Default Value: `1` | Default Value: `1` | ||
| Line 339: | Line 332: | ||
| "point-size": 9 | "point-size": 9 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-symbol-type** `enum`<div> | ||
| - | * **point-symbol-type** `enum` | + | //The symbol type is shown at the point position when the **point-type** is symbol. The type include circle, square, triangle, cross and star.// |
| - | + | ||
| - | Description: //The symbol type is shown at the point position when the **point-type** is symbol. The type include circle, square, triangle, cross and star.// | + | |
| Available Values: `circle` `square` `triangle` `cross` `star` | Available Values: `circle` `square` `triangle` `cross` `star` | ||
| Line 350: | Line 343: | ||
| "point-symbol-type": "square" | "point-symbol-type": "square" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **point-type** `enum`<div> | ||
| - | * **point-type** `enum` | + | //The graphic type is shown at the point position. The type include symbol, image and glyph. symbol is a defined graphic; image is a picture and the glyph a user-defined special character set that works with "point-glyph-name"// |
| - | + | ||
| - | Description: //The graphic type is shown at the point position. The type include symbol, image and glyph. symbol is a defined graphic; image is a picture and the glyph a user-defined special character set that works with "point-glyph-name"// | + | |
| Available Values: `symbol` `image` `glyph` | Available Values: `symbol` `image` `glyph` | ||
| Line 361: | Line 354: | ||
| "point-type": "symbol" | "point-type": "symbol" | ||
| </code> | </code> | ||
| + | </div> | ||
| === Line === | === Line === | ||
| - | * **line-cap** `enum` | + | * **line-cap** `enum`<div> |
| - | Description: //The display of line endings.// | + | //The display of line endings.// |
| Default Value: `round` | Default Value: `round` | ||
| Available Values: `round` `butt` `square` | Available Values: `round` `butt` `square` | ||
| Line 375: | Line 368: | ||
| </code> | </code> | ||
| - | * **line-color** `string` | + | </div> |
| + | * **line-color** `string`<div> | ||
| - | Description: //The color of the drawn line.// | + | //The color of the drawn line.// |
| Default Value: `rgba(0,0,0,0)`, //(transparent)// | Default Value: `rgba(0,0,0,0)`, //(transparent)// | ||
| Line 384: | Line 378: | ||
| </code> | </code> | ||
| - | * **line-dasharray** `string` | + | </div> |
| + | * **line-dasharray** `string`<div> | ||
| - | Description: //Use a pair of length values [a,b] to set dash patterns, where (a) is the dash length and (b) is the gap length. You can set more values to achieve more complex patterns.// | + | //Use a pair of length values [a,b] to set dash patterns, where (a) is the dash length and (b) is the gap length. You can set more values to achieve more complex patterns.// |
| <code json> | <code json> | ||
| Line 393: | Line 388: | ||
| - | * **line-direction-image-size** `string` | + | </div> |
| + | * **line-direction-image-size** `string`<div> | ||
| - | Description: //the size of line direction image.// | + | //the size of line direction image.// |
| <code json> | <code json> | ||
| Line 401: | Line 397: | ||
| </code> | </code> | ||
| - | * **line-direction-image-uri** `string` | + | </div> |
| + | * **line-direction-image-uri** `string`<div> | ||
| - | Description: //Which kind of iamge are used to display line direction.// | + | //Which kind of iamge are used to display line direction.// |
| <code json> | <code json> | ||
| Line 409: | Line 406: | ||
| </code> | </code> | ||
| - | * **line-geometry-transform** `string` | + | </div> |
| + | * **line-geometry-transform** `string`<div> | ||
| - | Description: //Applies transformation functions to a geometry// | + | //Applies transformation functions to a geometry// |
| Default Value: `none`, //(geometry is not transformed)// | Default Value: `none`, //(geometry is not transformed)// | ||
| Available Values: `tranlate` `scale` `rotate` `skew` | Available Values: `tranlate` `scale` `rotate` `skew` | ||
| Line 419: | Line 417: | ||
| </code> | </code> | ||
| - | * **line-join** `enum` | + | </div> |
| + | * **line-join** `enum`<div> | ||
| - | Description: //The behavior of lines when joined on a map.// | + | //The behavior of lines when joined on a map.// |
| Default Value: `miter` | Default Value: `miter` | ||
| Available Values: `miter` `round` `bevel` | Available Values: `miter` `round` `bevel` | ||
| Line 429: | Line 428: | ||
| </code> | </code> | ||
| - | * **line-miterlimit** `number` | + | </div> |
| + | * **line-miterlimit** `number`<div> | ||
| - | Description: //The limit on the ratio of the miter length to the stroke-width. This is used to automatically convert miter joins to bevel joins for sharp angles, to avoid the miter extending beyond the thickness of the stroking path. Typically, this property does not need to be set. However, if you have jaggy artifacts during rendering, defining a larger value for this property helps.// | + | //The limit on the ratio of the miter length to the stroke-width. This is used to automatically convert miter joins to bevel joins for sharp angles, to avoid the miter extending beyond the thickness of the stroking path. Typically, this property does not need to be set. However, if you have jaggy artifacts during rendering, defining a larger value for this property helps.// |
| Defult Value: `4`, //(auto-convert miter joins to bevel joins when theta is less than 29 degrees)// | Defult Value: `4`, //(auto-convert miter joins to bevel joins when theta is less than 29 degrees)// | ||
| Line 438: | Line 438: | ||
| </code> | </code> | ||
| + | </div> | ||
| - | * **line-offset-x** `number` | + | * **line-offset-x** `number`<div> |
| - | Description: //The horizontal offset of drawn line. // | + | //The horizontal offset of drawn line. // |
| Default Value: `0` | Default Value: `0` | ||
| Line 448: | Line 449: | ||
| </code> | </code> | ||
| - | * **line-offset-y** `number` | + | </div> |
| + | * **line-offset-y** `number`<div> | ||
| - | Description: //The vertical offset of drawn line.// | + | //The vertical offset of drawn line.// |
| Default Value: `0` | Default Value: `0` | ||
| Line 457: | Line 459: | ||
| </code> | </code> | ||
| + | </div> | ||
| - | * **line-opacity** `number` | + | * **line-opacity** `number`<div> |
| - | Description: //The opacity of a line.// | + | //The opacity of a line.// |
| Default Value: `0`, //(the line is fully transparent)// | Default Value: `0`, //(the line is fully transparent)// | ||
| Available Values: `0` to `1` | Available Values: `0` to `1` | ||
| Line 469: | Line 472: | ||
| - | * **line-width** `number` | + | </div> |
| + | * **line-width** `number`<div> | ||
| - | Description: //The width of a line, in pixels.// | + | //The width of a line, in pixels.// |
| Default Value: `1` | Default Value: `1` | ||
| Line 478: | Line 482: | ||
| </code> | </code> | ||
| + | </div> | ||
| === Polygon === | === Polygon === | ||
| - | * **polygon-fill-color** `string` | + | * **polygon-fill-color** `string`<div> |
| - | Description: //Sets the fill color of the polygon.// | + | //Sets the fill color of the polygon.// |
| Default Value: `rgba(128,128,128,1)` //(completely opaque gray)// | Default Value: `rgba(128,128,128,1)` //(completely opaque gray)// | ||
| Line 489: | Line 494: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **polygon-geometry-transform** `string`<div> | ||
| - | * **polygon-geometry-transform** `string` | + | //Defines the transform function for the geometry element.// |
| - | + | ||
| - | Description: //Defines the transform function for the geometry element.// | + | |
| Available Values: `translate` `scale` `rotate` `skew` | Available Values: `translate` `scale` `rotate` `skew` | ||
| Line 500: | Line 505: | ||
| </code> | </code> | ||
| - | * **polygon-offset-x** `number` | + | </div> |
| + | * **polygon-offset-x** `number`<div> | ||
| - | Description: //The horizontal offset of drawn graphic.// | + | //The horizontal offset of drawn graphic.// |
| Default Value: `0` | Default Value: `0` | ||
| Line 509: | Line 515: | ||
| </code> | </code> | ||
| - | * **polygon-offset-y** `number` | + | </div> |
| + | * **polygon-offset-y** `number`<div> | ||
| - | Description: //The vertical offset of drawn graphic.// | + | //The vertical offset of drawn graphic.// |
| Default Value: `0` | Default Value: `0` | ||
| Line 519: | Line 526: | ||
| - | * **polygon-opacity** `number` | + | </div> |
| + | * **polygon-opacity** `number`<div> | ||
| - | Description: //Control opacity factor of polygon color. (0 as completely transparent, 1 as completely opaque)// | + | //Control opacity factor of polygon color. (0 as completely transparent, 1 as completely opaque)// |
| Defult Value: `1` //(completely opaque)// | Defult Value: `1` //(completely opaque)// | ||
| Available Values: `0` to `1` | Available Values: `0` to `1` | ||
| Line 529: | Line 537: | ||
| </code> | </code> | ||
| - | * **polygon-shadow** `object` | + | </div> |
| + | * **polygon-shadow** `object`<div> | ||
| - | Description: //The style of the drawn polygon's shadow.// | + | //The style of the drawn polygon's shadow.// |
| <code json> | <code json> | ||
| Line 541: | Line 550: | ||
| </code> | </code> | ||
| + | </div> | ||
| === Text === | === Text === | ||
| - | * **text-align** `enum` | + | * **text-align** `enum`<div> |
| - | Description: //Sets the alignment of text.// | + | //Sets the alignment of text.// |
| Default Value: `center` | Default Value: `center` | ||
| Available Values: `left` `right` `center` | Available Values: `left` `right` `center` | ||
| Line 554: | Line 563: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-allow-overlapping** `boolean`<div> | ||
| - | * **text-allow-overlapping** `boolean` | + | //Allows overlap with other text or icons.// |
| - | + | ||
| - | Description: //Allows overlap with other text or icons.// | + | |
| Default Value: `flase` | Default Value: `flase` | ||
| Line 564: | Line 573: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-baseline** `enum`<div> | ||
| - | * **text-baseline** `enum` | + | //Sets the current text baseline when the text is drawn.// |
| - | + | ||
| - | Description: //Sets the current text baseline when the text is drawn.// | + | |
| Default Value: `middle` | Default Value: `middle` | ||
| Available Values: `bottom` `top` `middle` `alphabetic` `hanging` `ideographic` | Available Values: `bottom` `top` `middle` `alphabetic` `hanging` `ideographic` | ||
| Line 575: | Line 584: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-base-point-style** `object`<div> | ||
| - | * **text-base-point-style** `object` | + | //a point style to display the base point.// |
| - | + | ||
| - | Description: //a point style to display the base point.// | + | |
| <code json> | <code json> | ||
| Line 592: | Line 601: | ||
| } | } | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-content** `string`<div> | ||
| - | * **text-content** `string` | + | //Sets the text displayed on the text lable. You can specify the data field you want to use by using the field name enclosed in brackets, for example: {name_en}.// |
| - | + | ||
| - | Description: //Sets the text displayed on the text lable. You can specify the data field you want to use by using the field name enclosed in brackets, for example: {name_en}.// | + | |
| <code json> | <code json> | ||
| Line 601: | Line 610: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-date-format** `string`<div> | ||
| - | * **text-date-format** `string` | + | //Sets a format expression for date value when the type of value is numeric.// |
| - | + | ||
| - | Description: //Sets a format expression for date value when the type of value is numeric.// | + | |
| <code json> | <code json> | ||
| Line 610: | Line 619: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-fill-color** `string`<div> | ||
| - | * **text-fill-color** `string` | + | //Set the color of the text lable.// |
| - | + | ||
| - | Description: //Set the color of the text lable.// | + | |
| Default Value: `#000000` //(black)// | Default Value: `#000000` //(black)// | ||
| Line 620: | Line 629: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-font** `string`<div> | ||
| - | * **text-font** `string` | + | //Sets the current font property of the text content.// |
| - | + | ||
| - | Description: //Sets the current font property of the text content.// | + | |
| <code json> | <code json> | ||
| Line 629: | Line 638: | ||
| </code> | </code> | ||
| - | * **text-force-horizontal-for-line** `boolean` | + | </div> |
| + | * **text-force-horizontal-for-line** `boolean`<div> | ||
| - | Description: //Sets the force horizontal of the text for line.// | + | //Sets the force horizontal of the text for line.// |
| Default Value: `0` | Default Value: `0` | ||
| Available Values: `1` `0` | Available Values: `1` `0` | ||
| Line 639: | Line 649: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-halo-color** `string`<div> | ||
| - | * **text-halo-color** `string` | + | //Sets the halo color on the text edge.// |
| - | + | ||
| - | Description: //Sets the halo color on the text edge.// | + | |
| Default Value: `#FFFFFF`, //(white)// | Default Value: `#FFFFFF`, //(white)// | ||
| Line 649: | Line 659: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-halo-radius** `number`<div> | ||
| - | * **text-halo-radius** `number` | + | //Sets the radius of the halo, in pixels.// |
| - | + | ||
| - | Description: //Sets the radius of the halo, in pixels.// | + | |
| Default Value: `0`, //(no halo is applied)// | Default Value: `0`, //(no halo is applied)// | ||
| Line 659: | Line 669: | ||
| </code> | </code> | ||
| - | * **text-interval-distance** `number` | + | </div> |
| + | * **text-interval-distance** `number`<div> | ||
| - | Description: //Sets the interval distancebetween text lables which along line.// | + | //Sets the interval distancebetween text lables which along line.// |
| <code json> | <code json> | ||
| Line 667: | Line 678: | ||
| </code> | </code> | ||
| - | * **text-letter-case** `enum` | + | </div> |
| + | * **text-letter-case** `enum`<div> | ||
| - | Description: //Sets the type of letter case.// | + | //Sets the type of letter case.// |
| Default Value: `default` | Default Value: `default` | ||
| Availabel Values: `default` `uppercase` `lowercase` | Availabel Values: `default` `uppercase` `lowercase` | ||
| Line 677: | Line 689: | ||
| </code> | </code> | ||
| - | * **text-letter-spacing** `number` | + | </div> |
| + | * **text-letter-spacing** `number`<div> | ||
| - | Description: //Sets the width of letter spacing.// | + | //Sets the width of letter spacing.// |
| <code json> | <code json> | ||
| Line 685: | Line 698: | ||
| </code> | </code> | ||
| - | * **text-line-spacing** `number` | + | </div> |
| + | * **text-line-spacing** `number`<div> | ||
| - | Description: //Sets the width of line spacing.// | + | //Sets the width of line spacing.// |
| <code json> | <code json> | ||
| Line 693: | Line 707: | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-mask-color** `string`<div> | ||
| - | * **text-mask-color** `string` | + | //Sets the color of mask fill.// |
| - | + | ||
| - | Description: //Sets the color of mask fill.// | + | |
| <code json> | <code json> | ||
| Line 702: | Line 716: | ||
| </code> | </code> | ||
| - | * **text-mask-margin** `string` | + | </div> |
| + | * **text-mask-margin** `string`<div> | ||
| - | Description: //Sets the 4 distance of mask margin, in pixels.// | + | //Sets the 4 distance of mask margin, in pixels.// |
| Default Value: `0,0,0,0` | Default Value: `0,0,0,0` | ||
| Line 711: | Line 726: | ||
| </code> | </code> | ||
| - | * **text-mask-outline-color** `string` | + | </div> |
| + | * **text-mask-outline-color** `string`<div> | ||
| - | Description: //Sets the color of mask outline.// | + | //Sets the color of mask outline.// |
| <code json> | <code json> | ||
| Line 719: | Line 735: | ||
| </code> | </code> | ||
| - | * **text-mask-outline-width** `number` | + | </div> |
| + | * **text-mask-outline-width** `number`<div> | ||
| - | Description: //Sets the width of mask outline, in pixels.// | + | //Sets the width of mask outline, in pixels.// |
| Default Value:`0` | Default Value:`0` | ||
| Line 728: | Line 745: | ||
| </code> | </code> | ||
| - | * **text-mask-type** `enum` | + | </div> |
| + | * **text-mask-type** `enum`<div> | ||
| - | Description: //Sets the type of text mask.// | + | //Sets the type of text mask.// |
| Available Values: `default` `rectangle` `roundedCorners` `roundedEnds` `circle` | Available Values: `default` `rectangle` `roundedCorners` `roundedEnds` `circle` | ||
| Line 737: | Line 755: | ||
| </code> | </code> | ||
| - | * **text-max-char-angle-delta** `number` | + | </div> |
| + | * **text-max-char-angle-delta** `number`<div> | ||
| - | Description: //For line feature, allow a maximum angle between adjacent characters, the expected value is in radians.// | + | //For line feature, allow a maximum angle between adjacent characters, the expected value is in radians.// |
| Default Value: `2p` | Default Value: `2p` | ||
| Available Values: `0` to `2p` | Available Values: `0` to `2p` | ||
| Line 747: | Line 766: | ||
| </code> | </code> | ||
| - | * **text-numeric-format** `string` | + | </div> |
| + | * **text-numeric-format** `string`<div> | ||
| - | Description: //Sets a numeric format expression for number value.// | + | //Sets a numeric format expression for number value.// |
| <code json> | <code json> | ||
| "text-numeric-format": "en-US, style: currency, currency: USD" | "text-numeric-format": "en-US, style: currency, currency: USD" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-offset-x** `number`<div> | ||
| - | * **text-offset-x** `number` | + | //Sets the horizontal offset of the text, in pixels. A positive value shifts the text to the right.// |
| - | + | ||
| - | Description: //Sets the horizontal offset of the text, in pixels. A positive value shifts the text to the right.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 763: | Line 783: | ||
| "text-offset-x": 10 | "text-offset-x": 10 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-offset-y** `number`<div> | ||
| - | * **text-offset-y** `number` | + | //Sets the vertical offset of the text, in pixel. A positive value shifts the text down.// |
| - | + | ||
| - | Description: //Sets the vertical offset of the text, in pixel. A positive value shifts the text down.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 772: | Line 792: | ||
| "text-offset-y": 10 | "text-offset-y": 10 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-opacity** `number`<div> | ||
| - | * **text-opacity** `number` | + | //Set the opacity of text lable.// |
| - | + | ||
| - | Description: //Set the opacity of text lable.// | + | |
| Default Value: `1`, //(fully opaque)// | Default Value: `1`, //(fully opaque)// | ||
| Available Values: `0` to `1` | Available Values: `0` to `1` | ||
| Line 782: | Line 802: | ||
| "text-opacity": 1 | "text-opacity": 1 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-placement** `string`<div> | ||
| - | * **text-placement** `string` | + | // you can use this property to set the avoidance algorithm for text lables.// |
| - | + | ||
| - | Description: // you can use this property to set the avoidance algorithm for text lables.// | + | |
| Default Value: `center`, | Default Value: `center`, | ||
| Available Values: `upper` `right` `lower` `left` `center` | Available Values: `upper` `right` `lower` `left` `center` | ||
| Line 792: | Line 812: | ||
| "text-placements": "upper" | "text-placements": "upper" | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-rotate-angle** `number`<div> | ||
| - | * **text-rotate-angle** `number` | + | //Rotation in radians (positive rotation clockwise).// |
| - | + | ||
| - | Description: //Rotation in radians (positive rotation clockwise).// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Available Values: `0` to `2*PI` | Available Values: `0` to `2*PI` | ||
| Line 802: | Line 822: | ||
| "text-rotate-angle": 2 | "text-rotate-angle": 2 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-spacing** `number`<div> | ||
| - | * **text-spacing** `number` | + | //Sets the space between two text lables drawn on a line, in pixels.// |
| - | + | ||
| - | Description: //Sets the space between two text lables drawn on a line, in pixels.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 811: | Line 831: | ||
| "text-spacing": 0 | "text-spacing": 0 | ||
| </code> | </code> | ||
| + | </div> | ||
| + | * **text-wrap-width** `number`<div> | ||
| - | * **text-wrap-width** `number` | + | //The length of characters that appears before the text-name lable wraps.// |
| - | + | ||
| - | Description: //The length of characters that appears before the text-name lable wraps.// | + | |
| Default Value: `0` | Default Value: `0` | ||
| Line 822: | Line 842: | ||
| + | </div> | ||
| ==== Sources ==== | ==== Sources ==== | ||
| Line 834: | Line 855: | ||
| ] | ] | ||
| </code> | </code> | ||
| - | === id === | + | * ** id **<div>//Required// `string` |
| - | + | ||
| - | //Required// `string` | + | |
| A map rendered data source's unique identifier. | A map rendered data source's unique identifier. | ||
| + | </div> | ||
| - | === url === | + | * ** url **<div>//Required// `string` |
| - | + | ||
| - | //Required// `string` | + | |
| The address of the data requested from the server. | The address of the data requested from the server. | ||
| + | </div> | ||
| - | === type === | + | * ** type **<div>//Required// `string` |
| - | + | ||
| - | //Required// `string` | + | |
| The commonly used geospatial file formats of feature source,for example : JSONFeature, MVT, TextFeature and XMLFeature. But it only support "MVT" now. | The commonly used geospatial file formats of feature source,for example : JSONFeature, MVT, TextFeature and XMLFeature. But it only support "MVT" now. | ||
| + | </div> | ||
| ==== map-layers ==== | ==== map-layers ==== | ||
| Line 866: | Line 884: | ||
| </code> | </code> | ||
| - | === map-layer-id=== | + | * **map-layer-id **<div> |
| //Required// `string` | //Required// `string` | ||
| A layer's unique identifier. | A layer's unique identifier. | ||
| + | </div> | ||
| - | === source === | + | * **source **<div> |
| //Optional// `string` | //Optional// `string` | ||
| Line 878: | Line 897: | ||
| A source's unique identifier which has existed of sources. Or it is passed in by JavaScript code with class ol.thinkgeo.VectorTileSource. | A source's unique identifier which has existed of sources. Or it is passed in by JavaScript code with class ol.thinkgeo.VectorTileSource. | ||
| - | === style-drawing-order === | + | </div> |
| + | * **style-drawing-order **<div> | ||
| //Required// `array` | //Required// `array` | ||
| Line 884: | Line 904: | ||
| Some of map rendered styles' unique identifier. Styles will be drawn in the order of array. | Some of map rendered styles' unique identifier. Styles will be drawn in the order of array. | ||
| + | </div> | ||
thinkgeo_stylejson/v2.1579423957.txt.gz · Last modified: 2020/01/19 08:52 by johnnyz