Add a link to countries? #65

Closed
zer05 opened this Issue Jan 25, 2013 · 6 comments

Comments

Projects
None yet
4 participants
@zer05

zer05 commented Jan 25, 2013

Hi there,

I want to add a url link to the countries when there clicked on.

I'm not comfortable with JavaScript, but it would be nice if someone could help me out!

Cheers,
José Miranda

@kitten

This comment has been minimized.

Show comment
Hide comment
@kitten

kitten Jan 26, 2013

As you can see in one of the examples there is an option defining an event which gets called when someone clicks a region:

jQuery('#vmap').vectorMap({
            map: 'germany_en',
            onRegionClick: function(element, code, region)
            {
                var message = 'You clicked "'
                    + region 
                    + '" which has the code: '
                    + code.toUpperCase();

                alert(message);
            }
        });

so i guess you would have to add this option with a function to the world.html example:

    jQuery(document).ready(function() {
        jQuery('#vmap').vectorMap({
            map: 'world_en',
            backgroundColor: '#333333',
            color: '#ffffff',
            hoverOpacity: 0.7,
            selectedColor: '#666666',
            enableZoom: true,
            showTooltip: true,
            values: sample_data,
            scaleColors: ['#C8EEFF', '#006491'],
            normalizeFunction: 'polynomial'
            onRegionClick: function(element, code, region)
            {
                var message = 'You clicked "'
                    + region 
                    + '" which has the code: '
                    + code.toUpperCase();

                alert(message);
            }
        });
    });

kitten commented Jan 26, 2013

As you can see in one of the examples there is an option defining an event which gets called when someone clicks a region:

jQuery('#vmap').vectorMap({
            map: 'germany_en',
            onRegionClick: function(element, code, region)
            {
                var message = 'You clicked "'
                    + region 
                    + '" which has the code: '
                    + code.toUpperCase();

                alert(message);
            }
        });

so i guess you would have to add this option with a function to the world.html example:

    jQuery(document).ready(function() {
        jQuery('#vmap').vectorMap({
            map: 'world_en',
            backgroundColor: '#333333',
            color: '#ffffff',
            hoverOpacity: 0.7,
            selectedColor: '#666666',
            enableZoom: true,
            showTooltip: true,
            values: sample_data,
            scaleColors: ['#C8EEFF', '#006491'],
            normalizeFunction: 'polynomial'
            onRegionClick: function(element, code, region)
            {
                var message = 'You clicked "'
                    + region 
                    + '" which has the code: '
                    + code.toUpperCase();

                alert(message);
            }
        });
    });
@zer05

This comment has been minimized.

Show comment
Hide comment
@zer05

zer05 Jan 28, 2013

Thanks Limit8,

But what I really need is the possibility of adding a external url to an individual country.

Cheers.

zer05 commented Jan 28, 2013

Thanks Limit8,

But what I really need is the possibility of adding a external url to an individual country.

Cheers.

@kitten

This comment has been minimized.

Show comment
Hide comment
@kitten

kitten Jan 29, 2013

So why don't you check the "region" variable in the onRegionClick Event?

kitten commented Jan 29, 2013

So why don't you check the "region" variable in the onRegionClick Event?

@kitten

This comment has been minimized.

Show comment
Hide comment
@kitten

kitten Jan 29, 2013

f.e.:

            onRegionClick: function(element, code, region)
            {
                if (region == "YOUR REGION CODE") {
                           window.location = "YOUR LINK";
                        }
            }

kitten commented Jan 29, 2013

f.e.:

            onRegionClick: function(element, code, region)
            {
                if (region == "YOUR REGION CODE") {
                           window.location = "YOUR LINK";
                        }
            }
@KaylanBrunet

This comment has been minimized.

Show comment
Hide comment
@KaylanBrunet

KaylanBrunet Jan 30, 2013

http://stackoverflow.com/questions/12415274/jqvmap-click-function check this page, it will explain perfectly how to do it

http://stackoverflow.com/questions/12415274/jqvmap-click-function check this page, it will explain perfectly how to do it

@zer05

This comment has been minimized.

Show comment
Hide comment
@zer05

zer05 Jan 30, 2013

Thks you both. Very helpfull!

zer05 commented Jan 30, 2013

Thks you both. Very helpfull!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment