It's often the case that data or interaction/functionaliy is only available for some countries, in which case one would want to specify which ones (i.e. a whitelist) and disable all others, so that they are still displayed but rendered some other way/colour/style.

This doesn't appear to be possible at present, please consider adding support for this?

Currently I do not see a way to redraw a map. For instance, if I load a map to a hidden element, when I show the element the map is not visible, the width and height are set to zero. If i manually set the width and height, the scale of the map is extremely small.

A function call to redraw the map when the element is show would be extremely useful, or am I overlooking something.

Possible solutions:
1.) add options for width and height inside the params
2.) My solution (requires you to add data attributes to the container of width and height):
=== the js -- starts at line 421 of lastest jquery.vmap.js ===

    if(params.container.width() == 0){
        this.width = params.container.attr('data-width');
    }else{
        this.width = params.container.width();
    }   
    
    if(params.container.height() == 0){
        this.height = params.container.attr('data-height');
    }else{
        this.height = params.container.height();
    }

== the html --missing "< >" due to editor -- ==

div id="vmap" data-width="960" data-height="525"> /div>"

Great plugin. Hope this helps someone

Need a method to dynamically select a region by name. E.g.:

$element.vectorMap("set", "selectedRegion", "NY")

onRegionClick fires and a region is selected when dragging, but when you try to drag the map it isn't really a 'click' on a region.

I'm noticing once I get the maps actually showing in IE8 with jboelen's hack that none of the Tooltips are showing.

IE8 also throws an error onRegionClick at line 532. Stating Object doesn't support this property or method. The following doesn't seem to play nice with IE8?

map.countries[key].currentFillColor = map.countries[key].getOriginalFill();
    map.countries[key].setFill(map.countries[key].getOriginalFill());

Just to mention that there's a small error towards the end of jquery.vmap.europe.js: Suriname is mentioned with SR iso code, while it should be Serbia with RS.

Current release does not render correctly in ie8

anyway to integrate with open street map ?

The idea would be to pull the data they have as needed in a azy loading design pattern.

What would it take to support this?

Hi all,

I would like to know if there is a way to retrieve calculated colors and the range applied for each of them.
This is to generate a legend next to the map with the range associated to each color.

Thank you
Thierry

I'm trying to show how many people are on a site, through representation of dots on a country. Any way to dynamically add dots to the map?

is it possible to do "hoverColors" as in "Colors"

i tried something like this : " hoverColors: {us: '#0000ff', fr: 'yellow'}," but does not work.

Any ideas ?

maybe in onRegionOver ?

Hi Guys,

Is there any reason why Luxembourg is missing in the world-map? (it's in the European one).

Thank you very much,

I'm using the map world_en, and evrything works perfectly in every browser except IE8. The problem in IE8 is that when i try to see the map, the map load perfectly with the specific countries that I specify to be a certain color and the rest not, but when this is finishing loading into the page, there is a second map that load over it, all white and hide the one that i need. I checked the code and it seems that IE8 load to times the rvml code. can someone help me?

Example:

This map has an explicit borderWidth of 1 as well as a borderOpacity of 1. As you can see, the interior borders look to be ~3px in width, while the outer ones are 1px as intended.

These work:

$('#map').vectorMap('set', 'colors', { us: '#8EE5EE' });
$('#map').vectorMap('set', 'colors', { 'us': '#8EE5EE' });

But, this doesnt:

country_name = 'us';
$('#map').vectorMap('set', 'colors', { country_name: '#8EE5EE' });

Anyone know why?

How do you load the Values property of the JQVMAP from a database/web service?

The multiSelectRegion param isn't documented anywere (http://jqvmap.com/ or https://github.com/manifestinteractive/jqvmap/), and only shows up in one demo.

There isn't a clean way to access selected regions - just to check the value of the global var "selectedRegions". I think a method should return this (and it should be documented).

Hi there,

Just wondering if there's any simple way to insert into the browsers history when a user clicks on a map region?

I've managed to alter the map so that when a region is clicked, it goes to a new URL, but that doesn't get tracked in the history...

I've been looking at all sorts of jquery history plugins, but can't quite figure out how to combine the two!

Any help would be much appreciated!

The island of Mayotte is missing, it should be next to Comoros.

Any way to add to in the existing world map?

Here's more information: http://en.wikipedia.org/wiki/Mayotte

I setup the onRegionClick option to open another div on click and it worked great in Chrome, FF, IE9. But IE8 gave me this error:

Object doesn't support this property or method jquery.vmap.js, line 523 character 3

In testing I commented out lines 523 & 524 and now IE8 seems to work fine. I'm sure they're in there for a reason so please let me know why I should put them back if I need to. But for now at least IE8 is working.

Lines 523, 524:
map.countries[key].currentFillColor = map.countries[key].getOriginalFill();
map.countries[key].setFill(map.countries[key].getOriginalFill());

Hi..

It would be good if you can build multi-line text label or better still can install complete HTML code in the labeltext.

Greetz
Helge

I have a selected list of top 5 countries. I would like to be able to dynamically change the colour of these countries on the map, after the map is created.

I basically want to be able to do this:
$('#map').vectorMap('set', 'colors', { us: '#8EE5EE' });

However instead of 'us' I'd like to use 'United States'.

Either that or else some way of retrieving the code using the region.

Thanks in advance

I found a rewiew of jqvmap on some site that ended with a brilliant cite stating that:

"Unfortunately the site of plugin developers does not explain how to make your custom maps for other countries."

And actually it describes a huge lack of well documented map creation process. Are you planning to fix this area?

Singapore is missing from the map..

The last weeks i had to decide, whether to use jVectorMap or jqvmap. I had no idea, which of both are "better", so i decided to use the original project.

So... Could you state out, in the README-file, what you made different in this project than the developer of jVectorMap? Perhaps what your project is able to handle and jVectorMap not.

How set border, border-color for IE6?

User story

As a cartogrpher
I would like to color my maps using different statistical methods
so that I can explore and show natural patterns in data

As  visualization developer
I would like to declare breakpoints for choropleth colors
so that I can minimise the amount of procedural code required to color a map

Feature request

It would be helpful to have a choice of Jenks Natural Breaks for the classification algorithm.
http://en.wikipedia.org/wiki/Jenks_natural_breaks_optimization

References

Here is a JS implementation of the algorithm:
https://github.com/vvoovv/djeo-jenks

Here is a PHP implementation of the algorithm:
https://github.com/randomdrake/jenks

Hi,

Was wondering how can I create a map using jqvmap of Chinese provinces?

Thanks!

Need a method to deselect regions. Perhaps selectedRegion could be overloaded? Perhaps it's better to have a discrete method. E.g.:

$element.vectorMap("set", "selectedRegion", null)

It's a fairly common requirement for corporate web sites that there is a map showing global corporate presence, usually first shown by region of the world, then by country within each region.

It would be great if jqvmap offered a way to do this by dynamically welding countries together into regions (by providing a mapping between region names and lists of countries within each region) and then when the region is clicked to smoothly zoom in to fill the render area with the region, and thereby also reveal the individual countries within the region.

Is there a way to set all country colors back to their default color? Or, is there a way to set all countries to a specific color?

I tried setting it with color to no avail.

I've just had a brief look at the source, the path parameters passed when drawing the map, they are lat & lons right?

I'd love to be able to place other elements, based on lat & lon, on top of the map, any plans for this?

How can i schow the name of the citys on the map (without mouseover or click, they should be shown when the map ist opened)

I have been using this plugin with Internet Exploter, whith several problems. I have found in the code the use of indexOf, wich is not supported in this "browser" 6, 7, or 8

http://msdn.microsoft.com/en-us/library/ie/ff679977%28v=vs.94%29.aspx

Is there any solution?

Thank You Daniel.

Sorry, but Latvia doesn't look like that on map.
The shape in the world map is wrong (but seems ok in Europe view).

https://en.wikipedia.org/wiki/Latvia

When setting individual region colors and specifying Indiana (in:) it is seen as Javascript and breaks the map. How can this be fixed?

Its a very easy question and I am not web professional. I need to create an Interactive Map. I am using JQVMap. Now I need to click region and it will callback an URL of the state. I am giving and function that was given as example in the site. But I dont know how to setup the link with State and URLs. Do I need to store the URLs in a JS and call from there? or I can put the URLs directly under region code. Any Sample code will be enough for me. Please let me know. It will be very helpful to me.

Is there any way to draw markers on maps ?

I want to create my own map of France, i picked this one here http://fr.wikipedia.org/wiki/Fichier:D%C3%A9partements%2Br%C3%A9gions%2Bcapitales(France).svg

i removed all the titles, the additional lines, the sea, and the others countries with Illustrator.

I saved the map in SVG. When i open it, i can read "width" and "height" wiches are the dimensions on my artboard. When i put these dimensions in the JS file with all the paths. The map is cropped... i can't see the Corsica..

So my question is, how do you find the real dimensions of the map ?

Many thanks :)

Rig info:

Mac OS X 10.6.8
Python 3.2.2

Have issues creating a map, I have tried a few times in terminal and I keeps spitting back variables it doesn't like or won't run what so ever. The fallowing snippet it the command I run to attempt to create the map.

python
converter.py
mn.shp
mnmap.js
--width 900
--country_name_index 4
--where "ISO = 'USA'"
--codes_file path/to/codes-en.tsv
--insets '[{"codes": ["US-AK"], "width": 200, "left": 10, "top": 370}, {"codes": ["US-HI"], "width": 100, "left": 220, "top": 400}]'
--minimal_area 4000000
--buffer_distance -3000
--simplify_tolerance 1000
--longtitude0 10w
--name us

I apologize in advance if I'm missing something.

Hi!

As usual, there are some troubles under IE8.
The color on the selected and deselected region goes not fine for me...
I got problems also with the stroke class. It doesn't appears.

Any help?

Thanks in advance

Is there a way to destroy a map using and event handler? I'd like to be able to dynamically load a map based on user click.

Would there be a way to add in CSS3 gradients on the countries, instead of setting just a solid color in the initialize script?

I have a searchform created with php. How can i send the names of selected regions to the php form?

Anything below IE9 it doesent render for me. I tried the fix posted, but doesent help. Any ideas what could it be?

I have a xml file containing information (title and Url) about some countries. when i'll click a country, i would like to show the title and the url. How can i do this? how can i link a xml file and info to the map to be able to show in the page the links for the country that is clicked/selected?

Can somebody help me? I'm stuck :/

I want to set regions in the map without data to be disabled from clicking. Is there any way to do that...I have been successful with disabling color change onRegionOver, but the same regions still responds to click (and changes color of region...). I tried calling preventDefault() method from onRegionOver and onRegionClick events...But it did not help... Would appreciate any help.

Please see: http://tinyurl.com/bqx6qjb

There are many situations in which one might want to select/highlight more than one country at a time (especially when first rendering the map) but this isn't possible at present as the selectedRegion property only accepts a single country code. Enhancing the property to permit multiple countries to be preselected would solve this, and I suggest that the opportunity should also be taken to name the field "selectedCountries" rather than "selectedRegions", as regions usually refer to a cluster of countries.

Similarly, one might want to use the map to select multiple countries by mouse/touch and persist the data to form field, so making "selectedCountries" a readable property would solve this, though a setting to control multiple selection mode & appropriate supporting code would also be required.