JSFiddle - React, Tailwind, and code Playground

by Gary Stubbenhagen

HTML

<script src="http://www.vincentbroute.fr/mapael/source/js/raphael/raphael-min.js"></script>
<script src="http://www.vincentbroute.fr/mapael/source/js/jquery.mapael.js?v=201411272303"></script>
<script src="http://www.vincentbroute.fr/mapael/source/js/maps/world_countries.js?v=201411272303"></script>
<script src="http://www.vincentbroute.fr/mapael/usecases/world/jquery.knob.js"></script>
<div class="container">
    <div class="map">Alternative content</div>
</div>

JavaScript

$(".container").mapael({
    map : {
        name : "world_countries"
    },
    legend: {
        area: {
            slices: [{
                sliceValue: 1,
                    attrs : {
                        fill : "#97e766"
                }
            }]
        }
    },
    areas: {
        "US": {value: "1"},
        "GB": {value: "1"},
        "AU": {value: "1"},
        "CN": {value: "1"},
        "JP": {value: "1"},
        "CA": {value: "1"},
        "FR": {value: "1"}
    }
});