Vector Maps

Vector maps are created using jQuery Mapael. it is a jQuery plugin based on raphael.js that allows you to display dynamic vector maps.
Step 1
Add JavaScript library to your body tag on page
1
<script src="assets/vendor/raphael/raphael.2.2.7.min.js"></script>
2
<script src="assets/vendor/mapael/jquery.mapael.min.js"></script>
Copied!
you can additional maps like one in demo by including it in js. 
Step 2
Add Markup
1
 <div class="map-container">
2
        <div class="map">Alternative content</div>
3
    </div>
Copied!
Remember to add child to the selector with class name .map
Step 3
Initialize the map with data
1
 $(".map-container").mapael({
2
        map : {
3
            name : "world_countries"
4
        }
5
    });
Copied!
GitHub - neveldo/jQuery-Mapael: jQuery plugin based on raphael.js that allows you to display dynamic vector maps
GitHub

Maps - Previous

Google Maps

Next - Starter Template

blank template Markup

Last modified 3yr ago

Copy link

Contents