Mapyna: Seamless Integration of Google Maps and Leaflet

Mapyna is a powerful JavaScript library tailored for location-based websites, perfect for platforms like real estate sites that need to display locations as markers on maps. It seamlessly integrates interactive maps into websites, enhancing user experience and providing valuable location-based information.

Demo : https://mapyna.realtyna.info/

Table of contents

• Mapyna: Seamless Integration of Google Maps and Leaflet
  • Table of contents
  • Installation
  • Usage
  • License

Installation

$ npm install mapyna

Usage

// ...

const mapynaConfig:<MapynaGoogleConfig | MapynaLeafletConfig> = {}


// JavaScript (Vanilla JS)

<script
      async
      src="https://maps.googleapis.com/maps/api/js?v=beta&key=<YOUR_API_KEY>&libraries=drawing&loading=async&callback=startMapyna"
></script>
// Google
const instance = Mapyna().googleMap(mapconfig)

<script src="https://unpkg.com/[email protected]/dist/leaflet.js" onload="startMapyna()"></script>
// Leaflet
const instance = Mapyna().leaflet(mapconfig)


// React

import { mapyna } from 'mapyna'

// Leaflet
// install leaflet and then attach it to window object
const instance = mapyna().leaflet(mapynaConfig)


// Google
// use @googlemaps/js-api-loader to load google api
const instance = mapyna().googleMap(mapynaConfig)

License

MIT