source: josm/trunk/data_nodist/mapcss/basic.mapcss @ 6037

Last change on this file since 6037 was 3972, checked in by bastiK, 9 years ago

MapCSS: add basic test files for reference

File size: 5.1 KB
Line 
1meta {
2    title: "Basic MapCSS tests";
3}
4
5/**
6 * test different symbols
7 */
8node[ test:fill ]
9{
10    symbol-size: 50;
11    symbol-fill-color: purple;
12}
13node[ test:fill = circle ] { symbol-shape : circle ; } /* whitespace at all possible places */
14node[test:fill=square]{symbol-shape:square;} /* no whitespace at all */
15node[ test:fill = triangle ] { symbol-shape: triangle; }
16node[ test:fill = pentagon ] { symbol-shape: pentagon }
17node[ test:fill = hexagon ] { symbol-shape: hexagon; }
18node[ test:fill = heptagon ] { symbol-shape: heptagon; }
19node[ test:fill = octagon ] { symbol-shape: octagon; }
20node[ test:fill = nonagon ] {symbol-shape: nonagon; }
21node[ test:fill = decagon ] {  symbol-shape: decagon; }
22
23node[ test:stroke ]
24{
25    symbol-size: 50;
26    symbol-stroke-color: purple;
27}
28node[ test:stroke = circle ] { symbol-shape: circle; }
29node[ test:stroke = square ] { symbol-shape: square; }
30node[ test:stroke = triangle ] { symbol-shape: triangle; }
31node[ test:stroke = triangle ] { symbol-shape: triangle; }
32node[ test:stroke = pentagon ] { symbol-shape: pentagon; }
33node[ test:stroke = hexagon ] { symbol-shape: hexagon; }
34node[ test:stroke = heptagon ] { symbol-shape: heptagon; }
35node[ test:stroke = octagon ] { symbol-shape: octagon; }
36node[ test:stroke = nonagon ] { symbol-shape: nonagon; }
37node[ test:stroke = decagon ] { symbol-shape: decagon; }
38
39/**
40 * Test default values.
41 * This should display a circle although neither size nor color are specified
42 */
43node[test=circle]
44{
45    symbol-shape: circle;
46}
47
48/**
49 * 3 Tests: relative symbol-stroke-width, alignment and stacking of stroke & fill for shapes
50 */
51node[test=pentagon1]
52{
53    symbol-shape: pentagon;
54    symbol-size: 50;
55    symbol-stroke-color: gold;
56    symbol-stroke-opacity: 0.9;
57    symbol-stroke-width: 10;
58}
59node[test=pentagon1]::stroke-casing
60{
61    symbol-shape: pentagon;
62    symbol-size: 50;
63    symbol-stroke-color: #ddd;
64    symbol-stroke-opacity: 0.6;
65    symbol-stroke-width: +8;
66    z-index: -10;
67}
68node[test=pentagon1]::fill
69{
70    symbol-shape: pentagon;
71    symbol-size: 50;
72    symbol-fill-color: darkblue;
73    symbol-fill-opacity: 1.0;
74    z-index: -15;
75}
76node[test=pentagon2]
77{
78    symbol-shape: pentagon;
79    symbol-size: 50;
80    symbol-stroke-color: blue;
81    symbol-stroke-opacity: 0.9;
82    symbol-stroke-width: 10;
83}
84node[test=pentagon2]::fill-above
85{
86    symbol-shape: pentagon;
87    symbol-size: 50;
88    symbol-fill-color: white;
89    symbol-fill-opacity: 0.3;
90    z-index: 2;
91}
92node[test=pentagon3]
93{
94    symbol-shape: pentagon;
95    symbol-size: 50;
96    symbol-fill-color: darkgreen;
97}
98node[test=pentagon3]::stroke-above
99{
100    symbol-shape: pentagon;
101    symbol-size: 50;
102    symbol-stroke-color: yellow;
103    symbol-stroke-width: 1.0;
104    z-index: 1;
105}
106
107/**
108 * Dashes Test
109 * 1. Basic test - pattern should not be broken at way nodes
110 * 2. Transparent and with background color. The foreground and background dashes must not overlap.
111 * 3. Dashes offset - cuts off the first dash segment
112 */
113way[test=dash1] {
114    width: 10;
115    color: blue;
116    dashes: 30,4,17,14;
117}
118way[test=dash2] {
119    width: 10;
120    color: blue;
121    opacity: 0.3;
122    dashes: 30,4,17,14;
123    dashes-background-color: gold;
124    dashes-background-opacity: 0.3;
125}
126way[test=dash3] {
127    width: 10;
128    color: blue;
129    dashes: 30,4,17,14;
130    dashes-background-color: gold;
131    dashes-offset:30;
132}
133
134/**
135 * Casing test
136 * Absolute and relative casing. Both should look the same.
137 */
138way[test="casing1"] {
139    width: 8;
140    color: #0a0;
141    casing-color: #bbb;
142    casing-width: 12;
143}
144way[test="casing2"] {
145    width: 8;
146    color: #0a0;
147    casing-color: #bbb;
148    casing-width: +4;
149}
150
151/**
152 * Text placement test
153 */
154node[test=text-placement]::* {
155    font-size: 10;
156    text: auto;
157    symbol-shape: square;
158    symbol-size: 50;
159    symbol-fill-opacity: 0.0;
160}
161node[test=text-placement]::above_center {
162    text-anchor-vertical: above;
163    text-anchor-horizontal: center;
164    text-color: gold;
165}
166node[test=text-placement]::top_left {
167    text-anchor-vertical: top;
168    text-anchor-horizontal: left;
169    text-color: yellow;
170}
171node[test=text-placement]::top_right {
172    text-anchor-vertical: top;
173    text-anchor-horizontal: right;
174    text-color: green;
175}
176node[test=text-placement]::center_center {
177    text-anchor-vertical: center;
178    text-anchor-horizontal: center;
179    text-color: white;
180}
181node[test=text-placement]::center_right {
182    text-anchor-vertical: center;
183    text-anchor-horizontal: right;
184    text-color: magenta;
185}
186node[test=text-placement]::bottom_left {
187    text-anchor-vertical: bottom;
188    text-anchor-horizontal: left;
189    text-color: blue;
190}
191node[test=text-placement]::bottom_right {
192    text-anchor-vertical: bottom;
193    text-anchor-horizontal: right;
194    text-color: lime;
195}
196node[test=text-placement]::below_center {
197    text-anchor-vertical: below;
198    text-anchor-horizontal: center;
199    text-color: red;
200}
201node[test=text-placement] {
202    symbol-fill-color: blue;
203    symbol-fill-opacity: 0.4;
204}
205way[test=text-along-path] {
206    text: auto;
207    text-position: line;
208    width: 6;
209    color: #00f;
210}
211way[test=text-along-path2] {
212    text: auto;
213    text-position: line;
214    text-offset: 8;
215    font-size: 12;
216    width: 1;
217    color: #f0f;
218    dashes: 10;
219}
220
Note: See TracBrowser for help on using the repository browser.