Custom projection definition can't use a non-tiled layer (I think)

prushforth commented 3 years ago

Here's an example that creates a layer that is non-tiled (should result in a TemplatedImageLayer being constructed), but it fails because it is trying to create a TemplatedTileLayer, I think:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>index-map.html</title>
    <script type="module"  src="dist/mapml-viewer.js"></script>
    <script type="module">
      let template = `
        {
            "projection": "BNG",
            "proj4string" : "+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.999601 +x_0=400000 +y_0=-100000 +ellps=airy +towgs84=446.448,-125.157,542.060,0.1502,0.2470,0.8421,-20.4894 +datum=OSGB36 +units=m +no_defs",
            "code" : "EPSG:27700",
            "origin" : [-238375,1376256],
            "resolutions" : [895.9999998588976,447.9999999294488,223.9999999647244,111.9999999823622,55.9999999911811,27.99999999559055,13.999999997795275,6.999999998897637,3.4999999994488187,1.7499999997244093,0.8749999998622047,0.43749999993110233,0.21874999996555117,0.10937499998277558],
            "bounds" : [[-238375,0.0],[900000,1376256]],
            "tilesize" : 256
        }`;
      let map = document.querySelector("mapml-viewer");
      let cProjection = map.defineCustomProjection(template);    
      map.projection = cProjection;
      </script>
     <style> 
       html, 
       body { 
         height: 100%; 
       } 
       * { 
         margin: 0; 
         padding: 0; 
       } 

       /* Specifying the `:defined` selector is recommended to style the map 
       element, such that styles don't apply when fallback content is in use 
       (e.g. when scripting is disabled or when custom/built-in elements isn't 
       supported in the browser). */ 
       mapml-viewer:defined { 
         /* Responsive map. */ 
          max-width: 100%;  

         /* Full viewport. */ 
          width: 100%;  
          height: 100%;  

         /* Remove default (native-like) border. */ 
         /* border: none; */ 
       } 

       /* Pre-style to avoid FOUC of inline layer- and fallback content. */ 
       mapml-viewer:not(:defined) > * { 
         display: none; 
       } 
       /* Ensure inline layer content is hidden if custom/built-in elements isn't 
       supported, or if javascript is disabled. This needs to be defined separately 
       from the above, because the `:not(:defined)` selector invalidates the entire 
       declaration in browsers that do not support it. */ 
       layer- { 
         display: none; 
       } 
     </style> 
     <noscript> 
       <style> 
         /* Ensure fallback content (children of the map element) is displayed if 
         custom/built-in elements is supported but javascript is disabled. */ 
         mapml-viewer:not(:defined) > :not(layer-) { 
           display: initial; 
         } 
       </style> 
     </noscript> 
  </head>
  <body>
    <mapml-viewer zoom="4" lat="55.6" lon="-4.3" controls>
      <layer- label="BNG WMS" checked>
        <meta name="projection" content="BNG">
        <extent units="BNG">
            <input name="xmin" type="location" rel="map" position="top-left" axis="easting" units="pcrs" min="240755" max="261199" />
            <input name="ymin" type="location" rel="map" position="bottom-left" axis="northing" units="pcrs" min="628735" max="658452" />
            <input name="xmax" type="location" rel="map" position="top-right" axis="easting" units="pcrs"  min="240755" max="261199"  />
            <input name="ymax" type="location" rel="map" position="top-left" axis="northing" units="pcrs"  min="628735" max="658452" />
            <input name="w" type="width" min="1" max="10000" />
            <input name="h" type="height" min="1" max="10000" />
          <link rel="tile" tref="http://ogc.bgs.ac.uk/cgi-bin/BGS_1GE_Geology/wms?version=1.3.0&request=GetMap&layers=GBR_Kilmarnock_BGS_50k_ShrinkSwell&format=image/png&crs=epsg:27700&BBOX={xmin},{ymin},{xmax},{ymax}&WIDTH={w}&HEIGHT={h}">
        </extent>        
      </layer->
    </mapml-viewer>
  </body>
</html>

ahmadayubi commented 3 years ago

I changed the link rel to equal image instead and that seemed to work, I don't think this layer is a tiled layer.

prushforth commented 3 years ago

Dang

ahmadayubi commented 3 years ago

It happens haha, I guess I'll close this issue

Maps4HTML / MapML.js

Custom projection definition can't use a non-tiled layer (I think) #232