rlayers/docs/8358.bundle.js

React Components for OpenLayers

"use strict";(self.webpackChunkrlayers=self.webpackChunkrlayers||[]).push([[8358],{8358:(n,r,t)=>{t.r(r),t.d(r,{default:()=>e});const e="import React, {JSX} from 'react';\nimport {fromLonLat} from 'ol/proj';\nimport {register} from 'ol/proj/proj4';\nimport proj4 from 'proj4';\nimport 'ol/ol.css';\n\nimport {RLayerWMTS, RMap} from 'rlayers';\n\nproj4.defs(\n    'EPSG:2056',\n    '+proj=somerc +lat_0=46.9524055555556 +lon_0=7.43958333333333 +k_0=1 ' +\n        '+x_0=2600000 +y_0=1200000 +ellps=bessel +towgs84=674.374,15.056,405.346,0,0,0,0 +units=m +no_defs +type=crs'\n);\nregister(proj4);\n\nconst Bern = fromLonLat([7.4475, 46.948056], 'EPSG:2056');\nexport default function WMTS(): JSX.Element {\n    const [info, setInfo] = React.useState('...retrieving capabilities..');\n    const [format, setFormat] = React.useState<string | null>(null);\n    return (\n        <>\n            <RMap\n                width={'100%'}\n                height={'60vh'}\n                projection='EPSG:2056'\n                initial={{center: Bern, zoom: 12}}\n            >\n                <RLayerWMTS\n                    zIndex={5}\n                    projection='EPSG:2056'\n                    onCapabilities={function (opt) {\n                        setInfo('Map is ready, format is');\n                        setFormat(opt.format);\n                    }}\n                    url='https://wmts.geo.admin.ch/EPSG/2056/1.0.0/WMTSCapabilities.xml'\n                    layer='ch.swisstopo.pixelkarte-farbe'\n                />\n            </RMap>\n            <div className='border round my-1 p-1'>\n                {info}\n                {format && <em className='ms-1'>{format}</em>}\n            </div>\n        </>\n    );\n}\n"}}]);