npm

jsvectormap

1.7.0themustafaomar/jsvectormap ↗

A lightweight Javascript library for creating interactive maps

Last release 1 years ago
30 May 2025
Release timing varies
gaps range from 3 weeks to 1.2 years
Some releases are documented
notes for 12 of 28 stable releases
Nothing withdrawn
no release was ever pulled
7 years old
28 releases · first in 2020

Release timeline

28 releases since 2020

2020202120222023202420252026

20202026

One column per quarter.

Releases

1.7.030 May 2025
Release notes2 sources agree
v1.7.0
- feat(maps): add Brazil map (#160) (f13156c)
- feat: add setSelectedMarkers and fix element events (#162 (fa3208b))
- refactor: rename jsvectormap.js to jsvectormap.esm.js (afce9da)
- refactor: drop class definition comment from classes (#164 (a87a1bb))
- feat(lines): add curved lines with curvature option (#165) (79ba655)
- fix(lines): programmatic creation of lines fails (#168) (b74d42f)
- refactor: enhance marker and line components (#169) (74d2912)
- refactor: replace deprecated pageY/XOffset with scrollY/X (#170) (1362f18)
- chore: replace class with id (c172982)
- fix: hide tooltip via prevent default (#180) (38dc963)
- feat: support ability to customize zoom buttons (#182) (c13b5d4)
- fix: panning to scroll on mobile devices #171 (#183) (3083525)
- refactor: missing using zoomInOption variable at #182 (c2ef7e7)
- fix: tooltip might be undefined see #126 #179 (#186) (c2cfb10)
- refactor: use css variables to override style #191 (bb1581e)
- fix(tooltip): internal text overrides text from listeners #192 (82dbea0)
- revert: revert old lineStyle config to maintain compatibility #194 (7f331be)
- fix(lines): curves distorted when it's zero value #195 (70ad831)
- refactor: enhance style and drop unwanted props #197 (df12f2f)
Open source →
1.6.012 Jun 2024
Release notes2 sources agree
v1.6.0
- feat(maps): create the build maps script (99894b8)
- feat(regions): set/clear selected regions programmatically (e6fab94) (#137)
- fix(markers): add markers method (a59cc39)
- chore: drop internet explorer entirly (964dcdd)
- fix(visualization): NAN value is encountered when min and max are the same (b3b8030) (#147)
- feat: allow all styles in add markers (bb8366e) (#140)
- feat: refactor: support umd, es and cjs formats (b338ef9) (#153)
BREAKING CHANGES

Removed js and css from dist folder, so if you're importing jsvectormap from dist/js/jsvectormap.js it becomes dist/jsvectormap.js and css as well.
```

```
Another thing is, when you add a particular style per marker please specify the case you want to apply the style for eg initial, hover, selected and selectedHover.
```
const map = new jsVectorMap({
  markers: [
    {
      name: 'Palestine',
      coords: [31.9522, 35.2332],
      // ❌ This isn't gonna work anymore
      style: { fill: 'red' },
      // ✅ Instead, style the marker based on its case.
      style: {
        initial: {
          fill: 'red'
        },
        // etc...
        hover: {}
      }
    }
  ]
})
```
Open source →
1.5.39 Apr 2023
Release notes
- fix: dragging doesn't work on mobile devices (#126)
Open source →
1.5.27 Apr 2023
Release notes2 sources agree
v1.5.2
- fix(markers): get/clear selected markers
- fix: series doesn't receive markers nor regions
- fix(events): tooltip fails when it's disabled (#117)
- perf: massively improves performance when not using labels (#115)
- style: replace let with const for the sake of consistency
- refactor: abstract the zoom handlers
- style: replace let with const
- style: imporve variable declaration
- fix: zoom on mobile (#104)
- refactor: replace jsvectormap.js with index.js
Open source →
1.5.115 Aug 2022
Release notes
v1.5.1
- region label fails (#92)
- fix: add ability to customize circled markers (#97)
- refactor: improve consistency & readability (5cf594d62d3ea1175d7a56e994a90740246fd778)
Open source →
Additional notes
- fix: region label fails (#92)
- fix: add ability to customize circled markers (#97)
- refactor: improve consistency & readability (5cf594d)
Open source →
1.5.09 Jul 2022
Release notes
v1.5.0
- feat(events): onRegion/MarkerClick support (#29)
- fix: shaky click selects a region (#47)
- fix: lines reposition fails
- refactor: improve the destroy method
- refactor: build an abstract class for components
- refactor: improve consistency & remove addMarker entirely
- feat: ability to remove a line or multiple lines
- refactor: better name conventions (#86)
- refactor: move elements to components (#81)
- refactor: get selector from merged options directly
- fix: too much recursion error (#75) (#76)
- feat(lines): ability to remove lines (#72)
- fix(typo): 'tranparent' typo in default options (#71)
Release Notes

Starting from v1.5.0 the addLine and removeLine are deprecated and will be removed soon, as an alternative please use addLines and removeLines.

Adding lines
```
const map = new jsVectorMap({})

// ❌ Avoid this in the future versions.
map.addLine()

// ✅ Use `addLines` method to add a line or multiple lines.
map.addLines({ from: 'Palestine', to: 'Ukraine' })

map.addLines([
  { from: 'United States', to: 'Egypt' },
  { from: 'Palestine', to: 'Ukraine' },
])
```
Removing lines
```
// ❌ Avoid this in the future versions.
map.removeLine('United States', 'Egypt')

// ✅ Use `removeLines` method to remove multiple lines or all lines.
map.removeLines()

map.removeLines([{ from: 'United States', to: 'Egypt' }])
```
Open source →
Additional notes
- feat(events): onRegion/MarkerClick support (#29)
- fix: shaky click selects a region (#47)
- fix: lines reposition fails
- refactor: improve the destroy method
- refactor: build an abstract class for components
- refactor: improve consistency & remove addMarker entirely
- feat: ability to remove a line or multiple lines
- refactor: better name conventions (#86)
- refactor: move elements to components (#81)
- refactor: get selector from merged options directly
- fix: too much recursion error (#75) (#76)
- feat(lines): ability to remove lines (#72)
- fix(typo): 'tranparent' typo in default options (#71)
Release Notes

Starting from v1.5.0 the addLine and removeLine are deprecated and will be removed soon, as an alternative please use addLines see docs and removeLines see docs.

Events onRegionTooltipShow and onMarkerTooltipShow will receive the native event as the first argument.
```
const map = new jsVectorMap({})

// ❌ Avoid this in the future versions.
map.addLine()

// ✅ Use `addLines` method to add a line or multiple lines.
map.addLines({ from: 'Palestine', to: 'Ukraine' })

map.addLines([
  { from: 'United States', to: 'Egypt' },
  { from: 'Palestine', to: 'Ukraine' },
])

// ❌ Avoid this in the future versions.
map.removeLine('United States', 'Egypt')

// ✅ Use `removeLines` method to remove multiple lines or all lines.
map.removeLines()

map.removeLines([{ from: 'United States', to: 'Egypt' }])

// Events

const map = new jsVectorMap({
  ...
  onRegionTooltipShow(event, tooltip, index) {
    // ..
  }
  onMarkerTooltipShow(event, tooltip, index) {
    // ..
  }
  ...
})
```
Open source →
1.4.521 Feb 2022
Release notes2 sources agree
v1.4.5
- fix: jsvectormap constructor is not accessible (#69)
- refactor: drop webpack development server
- docs: import typo
- fix: touch events
Open source →
1.4.42 Feb 2022
Release notes2 sources agree
v1.4.4
- fix: lines position fail when zooming in/out (#63)
Open source →
1.4.31 Feb 2022
Release notes
v1.4.3
- refactor: switch addMap, maps, defaults to static (3b3b13d)
- revert: revert tooltip's css method (83b7822)
- fix: touch handlers (fc4dbe4)
- chore: cleaning up (a8be4ef)
- fix: marker's render function (5136fae)
Open source →
Additional notes
- refactor: switch addMap, maps, defaults to static (3b3b13d)
- revert: revert tooltip's css method (83b7822)
- fix: touch handlers (fc4dbe4)
- chore: cleaning up (a8be4ef)
- fix: marker's render function (5136fae)
BREAKING CHANGES

All other maps except world and world_merc are ignored from the npm package, but it's available on Github, you can download these maps from Available maps page.
Open source →
1.4.221 Nov 2021
Release notes
v1.4.2
- fix: tooltip not destroyed
Open source →
Additional notes
- fix: tooltip not destroyed
Open source →
1.4.121 Nov 2021
Nothing published for this version

1.4.020 Nov 2021

Release notes

v1.4.0

refactor: drop dom handler class
refactor: move tooltip functionality to class (#53)
fix: fix mouseup event & fix zoom buttons
refactor: clean up util API
refactor: refactor directory structure
fix: fix 'addMarkers' method doesn't work with arrays
fix(scroll): fix mouse wheel behavior (#52)

BREAKING CHANGES

Map container

The map container was an instance of a custom class in early versions, now it's just a DOM element.

const map = new jsVectorMap({
  onLoaded: (map) => {
    // ❌ Won't work anymore.
    map.container.delegate(".jvm-region", "click", (event) => {
      // ..
    })

    // ✅ You will need to define your own event listener, example
    map.container.addEventListener('click', (event) => {
      if (event.target.matches('.jvm-region')) {
        // Do something
      }
    })
  }
})

Open source →

Additional notes

refactor: drop dom handler class
refactor: move tooltip functionality to class (#53)
fix: fix mouseup event & fix zoom buttons
refactor: clean up util api
refactor: refactor directory structure
fix: fix 'addMarkers' method doesn't work with arrays
fix(scroll): fix mouse wheel behavior (#52)

BREAKING CHANGES

In early versions the map container was an instance of a custom dom handler class that contains a delegate method, now it's just a DOM element, so the delegate method won't be available anymore.

const map = new jsVectorMap({
  // ...
  onLoaded: (map) => {
    // ❌ Won't work anymore.
    map.container.delegate('.jvm-region', 'click', (event) => {
      // ..
    })

    // ✅ You will need to define your own event listener, example
    map.container.addEventListener('click', (event) => {
      if (event.target.matches('.jvm-region')) {
        // Do something
      }
    })
  },
  // ...
})

Tooltip instance

The tooltip also was a DomHandler instance, now it's a Tooltip instance which implements these methods getElement, show, hide, text, css.

const map = new jsVectorMap({
  // ...
  onMarkerTooltipShow(tooltip, index) {
    // ❌ Won't work anymore.
    const element = tooltip.selector

    // Do something with the tooltip DOM element..

    // ✅ If you need the tooltip DOM element, you can access it like so:
    const element = tooltip.getElement()

    // Do something with the tooltip DOM element, or..
    // tooltip.css({ backgroundColor: 'red' })
    // tooltip.text('Hello')
  },
  // ...
})

Open source →

1.3.32 Sept 2021
Release notes
- fix: dragging the map selects the region (#48)
- fix: eventHandler's off method doesn't delete the reference
- style: correct events names for consistency
- feat: introduce a new event 'onDestroyed'
- fix(add-markers): add markers method not working with object
Open source →
1.3.225 Jun 2021
Nothing published for this version
1.3.126 Apr 2021
Nothing published for this version
1.3.017 Jan 2021
Nothing published for this version
1.2.022 Nov 2020
Nothing published for this version
1.1.423 Sept 2020
Nothing published for this version
1.1.214 Sept 2020
Nothing published for this version
1.1.123 Aug 2020
Nothing published for this version
1.1.029 Jul 2020
Nothing published for this version
1.0.711 Jul 2020
Nothing published for this version
1.0.610 Jul 2020
Nothing published for this version
1.0.516 Apr 2020
Nothing published for this version
1.0.413 Apr 2020
Nothing published for this version
1.0.39 Apr 2020
Nothing published for this version
1.0.210 Mar 2020
Nothing published for this version
1.0.127 Feb 2020
Nothing published for this version

jsvectormap

Release timeline

Releases

v1.7.0

v1.6.0

BREAKING CHANGES

v1.5.2

v1.5.1

v1.5.0

Release Notes

Adding lines

Removing lines

Release Notes

v1.4.5

v1.4.4

v1.4.3

BREAKING CHANGES

v1.4.2

v1.4.0

BREAKING CHANGES

Map container

BREAKING CHANGES

Tooltip instance