rlayers/docs/944.bundle.js

React Components for OpenLayers

"use strict";(self.webpackChunkrlayers=self.webpackChunkrlayers||[]).push([[944],{944(n,e,o){o.d(e,{default:()=>r});const r="import React, {JSX} from 'react';\nimport {fromLonLat} from 'ol/proj';\nimport {Coordinate} from 'ol/coordinate';\nimport {Point} from 'ol/geom';\nimport 'ol/ol.css';\n\nimport {RMap, ROSM, RLayerVector, RFeature, ROverlay} from 'rlayers';\nimport pacman from './svg/pacman.svg';\n\nconst coords: Record<string, Coordinate> = {\n    origin: [2.364, 48.82],\n    ArcDeTriomphe: [2.295, 48.8737]\n};\n\nexport default function AnimatedOverlay(): JSX.Element {\n    return (\n        <RMap className='example-map' initial={{center: fromLonLat(coords.origin), zoom: 11}}>\n            <ROSM />\n            <RLayerVector zIndex={10}>\n                <RFeature<Point> geometry={new Point(fromLonLat(coords.ArcDeTriomphe))}>\n                    <ROverlay className='no-interaction'>\n                        <img\n                            src={pacman}\n                            style={{\n                                position: 'relative',\n                                top: -24,\n                                left: -24,\n                                userSelect: 'none',\n                                pointerEvents: 'none'\n                            }}\n                            width={48}\n                            height={48}\n                            alt='animated icon'\n                        />\n                    </ROverlay>\n                </RFeature>\n            </RLayerVector>\n        </RMap>\n    );\n}\n"}}]);