Next
Update
Prev
Using setData
Using Data URL

The Chart representation can be modified dynamically by calling a JavaScript function. This sample map chart demonstrates dynamic data change. Click the buttons below the sample Chart.

function changeData() {
  document.getElementById("map1").setData(mapData2);  
}

function changeData2() {
  document.getElementById("map1").setDataURLEx(mapDataURL);  
}

var mapDataURL ="./Data/data2.txt";

var mapData2 = [
  { "code": 1000, "sales":6, "profit":2 },
  { "code": 2000, "sales":19.5, "profit":1.7 },
  { "code": 3000, "sales":36.7, "profit":6 },
  { "code": 5000, "sales":21.1, "profit":15.9 },
  { "code": 6000, "sales":15.5, "profit":2.5 },
  { "code": 9000, "sales":5.8, "profit":1 },
  { "code": 10000, "sales":9.3, "profit":1.7 },
  { "code": 11000, "sales":19.5, "profit":4.7 },
  { "code": 12000, "sales":21.3, "profit":5.5 },
  { "code": 13000, "sales":30.5, "profit":5.2 },
  { "code": 14000, "sales":15.7, "profit":3.2 },
  { "code": 15000, "sales":10.9, "profit":1.7 },
  { "code": 16000, "sales":5.4, "profit":0.6 },
  { "code": 17000, "sales":7.2, "profit":2.6 },
  { "code": 18000, "sales":10.2, "profit":3.6 },
  { "code": 19000, "sales":27.2, "profit":8.6 },
  { "code": 22000, "sales":84.3, "profit":15.5 },
  { "code": 23000, "sales":45.5, "profit":13.2 },
  { "code": 24000, "sales":16.7, "profit":3.2 },
  { "code": 25000, "sales":23.9, "profit":1.7 },
  { "code": 26000, "sales":15.4, "profit":2.6 },
  { "code": 27000, "sales":16.2, "profit":3.6 },
  { "code": 30000, "sales":45.2, "profit":15.6 },
  { "code": 31000, "sales":48.5, "profit":24.7 },
  { "code": 32000, "sales":31.3, "profit":14.5 },
  { "code": 33000, "sales":43.5, "profit":13.2 },
  { "code": 34000, "sales":31.7, "profit":13.2 },
  { "code": 35000, "sales":21.9, "profit":1.7 },
  { "code": 36000, "sales":45.4, "profit":2.6 },
  { "code": 37000, "sales":10.2, "profit":2.6 },
  { "code": 38000, "sales":6.2, "profit":1.6 },
  { "code": 40000, "sales":20.2, "profit":2.6 },
  { "code": 41000, "sales":59.5, "profit":4.7 },
  { "code": 42000, "sales":21.3, "profit":5.5 },
  { "code": 43000, "sales":91.5, "profit":23.2 },
  { "code": 44000, "sales":21.7, "profit":3.2 },
  { "code": 45000, "sales":10.9, "profit":1.7 },
  { "code": 46000, "sales":35.4, "profit":2.6 },
  { "code": 47000, "sales":65.2, "profit":8.6 },
  { "code": 49000, "sales":46.2, "profit":8.6 },
  { "code": 50000, "sales":20.2, "profit":1.6 }
];

© 2017 KoolChart. All rights reserved.