1+ <!doctype html>
2+ < html lang ="en ">
3+
4+ < head >
5+ < meta charset ="utf-8 ">
6+ < meta name ="viewport " content ="width=device-width,initial-scale=1 ">
7+ < title > Layer Control Tests</ title >
8+ < script type ="module " src ="mapml.js "> </ script >
9+ < style >
10+ html ,
11+ body {
12+ height : 100% ;
13+ }
14+
15+ * {
16+ margin : 0 ;
17+ padding : 0 ;
18+ }
19+
20+ /* Specifying the `:defined` selector is recommended to style the map
21+ element, such that styles don't apply when fallback content is in use
22+ (e.g. when scripting is disabled or when custom/built-in elements isn't
23+ supported in the browser). */
24+ mapml-viewer : defined {
25+ /* Responsive map. */
26+ max-width : 100% ;
27+
28+ /* Full viewport. */
29+ width : 100% ;
30+ height : 100% ;
31+
32+ /* Remove default (native-like) border. */
33+ /* border: none; */
34+ }
35+
36+ /* Pre-style to avoid FOUC of inline layer- and fallback content. */
37+ mapml-viewer : not (: defined )> * {
38+ display : none;
39+ }
40+
41+ /* Ensure inline layer content is hidden if custom/built-in elements isn't
42+ supported, or if javascript is disabled. This needs to be defined separately
43+ from the above, because the `:not(:defined)` selector invalidates the entire
44+ declaration in browsers that do not support it. */
45+ layer- {
46+ display : none;
47+ }
48+ </ style >
49+ < noscript >
50+ < style >
51+ /* Ensure fallback content (children of the map element) is displayed if
52+ custom/built-in elements is supported but javascript is disabled. */
53+ mapml-viewer : not (: defined )> : not (layer- ) {
54+ display : initial;
55+ }
56+ </ style >
57+ </ noscript >
58+ </ head >
59+
60+ < body >
61+ < mapml-viewer projection ="CBMTILE " zoom ="3 " lat ="37.176710163979834 " lon ="-62.070013924549045 " controls >
62+
63+ <!-- Layer without a label -->
64+ < layer- checked >
65+ < map-meta name ="projection " content ="CBMTILE "> </ map-meta >
66+ < map-feature zoom ="10 ">
67+ < map-properties > Layer with no label</ map-properties >
68+ < map-geometry cs ="gcrs ">
69+ < map-point >
70+ < map-coordinates > -75.866089 45.463020</ map-coordinates >
71+ </ map-point >
72+ </ map-geometry >
73+ </ map-feature >
74+ </ layer- >
75+
76+ </ mapml-viewer >
77+ </ body >
78+
79+ </ html >
0 commit comments