Html Chart

Set the draw property of the jqxChart. Author: http://jqwidgets.com

by jqwidgets

HTML

<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id='chartContainer' style="width:680px; height:400px; position: relative; left: 0px; top: 0px;"></div>

JavaScript

function transformPath(path, wScale, hScale, xOffset, yOffset) {
           var output = '';

           for (var i = 0; i < path.length; i++) {
               if (path[i] == 'C' || path[i] == 'M' || path[i] == 'L') {
                   output += path[i];
                   i++;

                   var j = i;
                   while (j + 1 < path.length && !(path[j + 1] == 'C' || path[j + 1] == 'M' || path[j + 1] == 'L' || path[j + 1] == 'z'))
                   j++;

                   var value = path.substring(i, j);

                   var pointsString = value.split(' ');
                   for (var s = 0; s < pointsString.length; s++) {
                       if (pointsString[s].length == 0) continue;

                       var pointString = pointsString[s].split(',');
                       var point = {
                           x: pointString[0],
                           y: pointString[1]
                       };

                       point.x = point.x * wScale + xOffset;
                       point.y = point.y * hScale + yOffset;

                       output += ' ' + point.x + "," + point.y + ' ';
                   }
                   i = j - 1;
               } else {
                   output += path[i];
               }
           }
           return output;
       }

       var adapterSettings = {
           datatype: "json",
           datafields: [{
               name: 'id'
           }, {
               name: 'path'
           }, {
               name: 'europe'
           }, {
               name: 'eu'
           }],
           /* EU map definitions in JSON derived from  http://commons.wikimedia.org/wiki/File:116_000_map_of_Europe.svg */
           localData: [
    {
        "id": "gl",
        "path": "M 4842.1259,161.70219 C 4849.2918,167.43485 4853.5913,171.73434 4853.5913,171.73434 C 4857.8907,181.76651 4850.7248,191.79868 4850.7248,201.83083 C 4850.7248,206.13033 4857.8907,208.99666 4856.4575,211.86299 C 4856.4575,214.72932...