{"_id":"@asicupv/markerpp","_rev":"2-5340961eb0951c22a85270a1099035ff","name":"@asicupv/markerpp","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.1":{"name":"@asicupv/markerpp","version":"1.0.1","keywords":["react","leaflet","marker"],"author":{"name":"UPVMaps"},"license":"GPL3","_id":"@asicupv/markerpp@1.0.1","maintainers":[{"name":"miedgo","email":"miedgo@inf.upv.es"},{"name":"miesgre","email":"miesgre@gmail.com"},{"name":"polimediaupv","email":"polim@upvnet.upv.es"}],"dist":{"shasum":"41a5145160f6814f97b89ec16e6859fc08ac6803","tarball":"https://registry.npmjs.org/@asicupv/markerpp/-/markerpp-1.0.1.tgz","fileCount":46,"integrity":"sha512-uH8usEXmoL67saYgAYLnacTWLmqz8ELr7XzOfj1MCh/frQJU3kgOe796oFuh6n3WgjPEoIC8aA4zRR8kGM8kVw==","signatures":[{"sig":"MEUCIFdFGfUELkpKHxkDOPUmbDYPyd09Eoxnp3Q4R/OC0onrAiEAkcVp5n/vqlO4eeNFRCGMRzo2hiMjJPu2VeGaRti5fBk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7278934},"main":"./dist/cjs/index.js","types":"./dist/esm/index.d.ts","module":"./dist/esm/index.js","gitHead":"6be0d054716c3b705e24b6a28e6faf0b3addbc9f","scripts":{"lint":"eslint \"{**/*,*}.{js,ts,jsx,tsx}\"","test":"jest --config jestconfig.json","build":"npm run build:esm && npm run build:cjs","start":"parcel src/components/test.html","prepare":"npm run build","publish":"npm publish","prettier":"prettier --write \"{src,tests,example/src}/**/*.{js,ts,jsx,tsx}\"","build:cjs":"tsc --module commonjs --outDir dist/cjs","build:esm":"tsc","prepublishOnly":"npm run prettier && npm run lint"},"_npmUser":{"name":"miedgo","email":"miedgo@inf.upv.es"},"repository":{"type":"git"},"_npmVersion":"9.5.0","description":"MPP is a supercharged marker for Leaflet (although it may be used with other frameworks).","directories":{},"_nodeVersion":"18.14.2","dependencies":{"parcel":"^2.9.1"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.5.0","react":"^18.2.0","eslint":"^8.37.0","leaflet":"^1.9.3","process":"^0.11.10","ts-jest":"^29.0.5","prettier":"^2.8.7","react-dom":"^18.2.0","typescript":"^5.0.2","@types/jest":"^29.5.0","file-loader":"^6.2.0","@types/react":"^18.0.31","react-leaflet":"^4.2.1","@types/leaflet":"^1.9.3","jest-canvas-mock":"^2.5.0","eslint-plugin-react":"^7.32.2","@testing-library/react":"^14.0.0","eslint-config-prettier":"^8.8.0","eslint-plugin-prettier":"^4.2.1","jest-environment-jsdom":"^29.5.0","@typescript-eslint/parser":"^5.57.0","eslint-plugin-react-hooks":"^4.6.0","@fortawesome/react-fontawesome":"^0.2.0","@typescript-eslint/eslint-plugin":"^5.57.0","@fortawesome/free-solid-svg-icons":"^6.4.0"},"peerDependencies":{"react":">=16"},"_npmOperationalInternal":{"tmp":"tmp/markerpp_1.0.1_1687170629314_0.5860258148878297","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"@asicupv/markerpp","version":"1.0.2","keywords":["react","leaflet","marker"],"author":{"name":"UPVMaps"},"license":"GPL3","_id":"@asicupv/markerpp@1.0.2","maintainers":[{"name":"miedgo","email":"miedgo@inf.upv.es"},{"name":"miesgre","email":"miesgre@gmail.com"},{"name":"polimediaupv","email":"polim@upvnet.upv.es"}],"dist":{"shasum":"45aad7fe4c5da1785d40a8fa18079850baab0da1","tarball":"https://registry.npmjs.org/@asicupv/markerpp/-/markerpp-1.0.2.tgz","fileCount":46,"integrity":"sha512-D5mK2TNddF1DzmYVKGp53iq88q+9xd+CXiwHB8WmdHS7fZZBvy7NHjsKFlbgnca2y3gNxP4KRK0Cwj/GrSipuA==","signatures":[{"sig":"MEUCIQColdLAjh4gEXV7SGJ8j0IaoqiWpIoNhfYb8Mi2aUzSJAIgGVz5KHmC7Fhhwlw7plMhzgrPwNDCVQoTYt0kXn/ulmk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7278934},"main":"./dist/cjs/index.js","types":"./dist/esm/index.d.ts","module":"./dist/esm/index.js","gitHead":"6be0d054716c3b705e24b6a28e6faf0b3addbc9f","scripts":{"lint":"eslint \"{**/*,*}.{js,ts,jsx,tsx}\"","test":"jest --config jestconfig.json","build":"npm run build:esm && npm run build:cjs","start":"parcel src/components/test.html","prepare":"npm run build","publish":"npm publish","prettier":"prettier --write \"{src,tests,example/src}/**/*.{js,ts,jsx,tsx}\"","build:cjs":"tsc --module commonjs --outDir dist/cjs","build:esm":"tsc","prepublishOnly":"npm run prettier && npm run lint"},"_npmUser":{"name":"miedgo","email":"miedgo@inf.upv.es"},"repository":{"type":"git"},"_npmVersion":"9.5.0","description":"MPP is a supercharged marker for Leaflet (although it may be used with other frameworks).","directories":{},"_nodeVersion":"18.14.2","dependencies":{"parcel":"^2.9.1"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.5.0","react":"^18.2.0","eslint":"^8.37.0","leaflet":"^1.9.3","process":"^0.11.10","ts-jest":"^29.0.5","prettier":"^2.8.7","react-dom":"^18.2.0","typescript":"^5.0.2","@types/jest":"^29.5.0","file-loader":"^6.2.0","@types/react":"^18.0.31","react-leaflet":"^4.2.1","@types/leaflet":"^1.9.3","jest-canvas-mock":"^2.5.0","eslint-plugin-react":"^7.32.2","@testing-library/react":"^14.0.0","eslint-config-prettier":"^8.8.0","eslint-plugin-prettier":"^4.2.1","jest-environment-jsdom":"^29.5.0","@typescript-eslint/parser":"^5.57.0","eslint-plugin-react-hooks":"^4.6.0","@fortawesome/react-fontawesome":"^0.2.0","@typescript-eslint/eslint-plugin":"^5.57.0","@fortawesome/free-solid-svg-icons":"^6.4.0"},"peerDependencies":{"react":">=16"},"_npmOperationalInternal":{"tmp":"tmp/markerpp_1.0.2_1687173092665_0.3324309877501497","host":"s3://npm-registry-packages"}}},"time":{"created":"2023-06-19T10:30:29.253Z","modified":"2025-01-15T08:12:28.795Z","1.0.1":"2023-06-19T10:30:29.552Z","1.0.2":"2023-06-19T11:11:32.912Z"},"author":{"name":"UPVMaps"},"license":"GPL3","keywords":["react","leaflet","marker"],"repository":{"type":"git"},"description":"MPP is a supercharged marker for Leaflet (although it may be used with other frameworks).","maintainers":[{"email":"polim@upvnet.upv.es","name":"polimediaupv"},{"email":"miesgre@gmail.com","name":"miesgre"},{"email":"miedgo@inf.upv.es","name":"miedgo"},{"email":"ferserc1@gmail.com","name":"ferserc1"}],"readme":"# Marker Plus Plus\r\n\r\nMPP is a supercharged marker for React Leaflet.\r\n\r\n- `onClick`: function to be executed on click.\r\n- `latlon`: marker position\r\n- `imageData`: dict:\r\n  - `iconSize`: icon size on the map\r\n  - `anchor`: icon anchor relative to iconSize\r\n  - `imageSize`: rendered image size, aka: resolution\r\n  - `shadow`: if shadow must be rendered\r\n  - `images`: list(dict) configuration of each one of the image that compose the icon.\r\n    - `url`: svg url\r\n    - `color`\r\n    - `dx`: X axis position\r\n    - `dy`: Y axis position\r\n    - `dw`: width\r\n    - `dh`: height\r\n- `circles_data`: list(dict) configuration of each one of the circles that compose the icon.\r\n  - `fillColor`\r\n  - `borderColor`\r\n  - `borderWidth`\r\n  - `radius`\r\n\r\n```jsx\r\n<MarkerPP\r\n        onClick={() => console.log('click')}\r\n        latlon={[39.479391, -0.341045]}\r\n        imageData={{\r\n          iconSize: [100, 50],\r\n          anchor: [50, 35],\r\n          imageSize: [200, 100],\r\n          shadow: true,\r\n          images: [\r\n            {\r\n              url: 'https://raw.githubusercontent.com/FortAwesome/Font-Awesome/6.x/svgs/regular/address-card.svg',\r\n              color: '#ff0000',\r\n              dx: 0,\r\n              dy: 0,\r\n              dw: 80,\r\n              dh: 80,\r\n            },\r\n            {\r\n              url: 'https://fonts.gstatic.com/s/i/short-term/release/materialsymbolsoutlined/other_houses/wght100fill1/48px.svg',\r\n              color: '#fff',\r\n              dx: 0,\r\n              dy: -10,\r\n              dw: 40,\r\n              dh: 40,\r\n            },\r\n          ],\r\n        }}\r\n        circlesData={[{ fillColor: '#00ff0055', borderColor: 'green', borderWidth: 1, radius: 100 }]}\r\n      >\r\n        <Popup>Hello world</Popup>\r\n      </MarkerPP>\r\n```\r\n\r\nThanks to [Igor Gaponov](https://medium.com/@igaponov) for this awesome guide: [How to Create and Publish React TypeScript npm Package With Demo and Automated Build](https://betterprogramming.pub/how-to-create-and-publish-react-typescript-npm-package-with-demo-and-automated-build-80c40ec28aca)\r\n","readmeFilename":"README.md"}