# maptalks.mapsync

> [maptalks](https://github.com/maptalks/maptalks.js) Map synchronization tool

Latest version **0.7.0** (published 2024-07-29) · ISC license · 0 weekly downloads

## Install

```sh
npm install maptalks.mapsync
pnpm add maptalks.mapsync
yarn add maptalks.mapsync
bun add maptalks.mapsync
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.7.0 |
| Published | 2024-07-29 |
| First published | 2023-02-20 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 31.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 5 |
| Maintainers | hudeyi |

## Links

- npm: https://www.npmjs.com/package/maptalks.mapsync
- Repository: https://github.com/deyihu/mapsync
- Homepage: https://github.com/deyihu/mapsync#readme
- Issues: https://github.com/deyihu/mapsync/issues
- npm.io page: https://npm.io/package/maptalks.mapsync

## Recent versions

- 0.7.0 (latest) — 2024-07-29
- 0.6.0 — 2023-03-06
- 0.5.0 — 2023-02-20
- 0.4.0 — 2023-02-20
- 0.3.0 — 2023-02-20
- 0.2.0 — 2023-02-20
- 0.1.0 — 2023-02-20

## README

# maptalks.mapsync

[maptalks](https://github.com/maptalks/maptalks.js) Map synchronization tool

The map will become the main map when the mouse enters the container of the map

if you want switch main map , you can use `setMainMap` method

## Install

### NPM

```sh
npm i maptalks
npm i maptalks.mapsync
# or
yarn add maptalks
yarn add maptalks.mapsync
```

### CDN

```html
<script src="https://unpkg.com/maptalks/dist/maptalks.js"></script>
<script src="https://unpkg.com/maptalks.mapsync/dist/maptalks.mapsync.js"></script>
```

## API

## MapSync

### constructor(maps)

```js
import {
    MapSync
}
from 'maptalks.mapsync'

const mapSyncControl = new MapSync(maps);

// if you use cdn
// const mapSyncControl = new maptalks.MapSync(maps);
```

### methods

* addMap(map)

```js
const map = new maptalks.Map(id, {
    center: [-0.113049, 51.498568],
    zoom: 14,
    baseLayer: new maptalks.TileLayer('base', {
        urlTemplate: 'https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png',
        subdomains: ["a", "b", "c", "d"],
        attribution: '&copy; <a href="http://osm.org">OpenStreetMap</a> contributors, &copy; <a href="https://carto.com/">CARTO</a>'
    })
});
mapSyncControl.addMap(map);
```

* removeMap(map)

```js
mapSyncControl.removeMap(map);
```

* setMainMap(map) `set main map for Drive other maps`

```js
mapSyncControl.setMainMap(map);
```

* getMainMap()

```js
mapSyncControl.getMainMap();
```

* lock() `lock current map,the main map Will not be changed unless you unlock`

```js
mapSyncControl.lock();
```

* unLock() `unlock`

```js
mapSyncControl.unLock();
```

* isLock() 

```js
const isLock = mapSyncControl.isLock();
```

* dispose()

### events

* switchmainmap

```js
   mapSyncControl.on('switchmainmap', e => {
       console.log(e, e.map === e.target.getMainMap());
   })
```

---
_Source: https://npm.io/package/maptalks.mapsync · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._