Next
Update
Prev

KoolGrid uses XML, JSON, CSV, TSV formatted Dataset to represent a Grid, and gets the Dataset information from a variable or an URL of the file. This sample Grid demonstrates how to represent a Grid by calling the setData() method to get the Dataset information (XML) from a string variable.

var jsVars = "KoolOnLoadCallFunction=gridReadyHandler";
jsVars += "&dataType=xml";

function gridReadyHandler(id) {
  document.getElementById(id).setLayout(layoutStr);
  document.getElementById(id).setData(gridData);
  
}

var gridData = '\
<?xml version="1.0" encoding="utf-8"?>\
<RevenuesAnalysis>\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>1/4</Quarter>\
		<Month>1</Month>\
		<Seoul>109520</Seoul>\
		<Tokyo>40454</Tokyo>\
		<Singapore>82477</Singapore>\
		<NewYork>47424</NewYork>\
		<LA>103225</LA>\
		<Washington>61161</Washington>\
		<Revenue>444260</Revenue>\
		<Percent>40</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>1/4</Quarter>\
		<Month>2</Month>\
		<Seoul>15749</Seoul>\
		<Tokyo>29714</Tokyo>\
		<Singapore>31393</Singapore>\
		<NewYork>45006</NewYork>\
		<LA>17945</LA>\
		<Washington>90148</Washington>\
		<Revenue>229956</Revenue>\
		<Percent>20</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>1/4</Quarter>\
		<Month>3</Month>\
		<Seoul>14766</Seoul>\
		<Tokyo>97314</Tokyo>\
		<Singapore>103216</Singapore>\
		<NewYork>86072</NewYork>\
		<LA>52863</LA>\
		<Washington>93789</Washington>\
		<Revenue>448020</Revenue>\
		<Percent>40</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>2/4</Quarter>\
		<Month>4</Month>\
		<Seoul>52352</Seoul>\
		<Tokyo>56859</Tokyo>\
		<Singapore>15688</Singapore>\
		<NewYork>65438</NewYork>\
		<LA>39181</LA>\
		<Washington>109514</Washington>\
		<Revenue>339031</Revenue>\
		<Percent>31</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>2/4</Quarter>\
		<Month>5</Month>\
		<Seoul>100842</Seoul>\
		<Tokyo>30391</Tokyo>\
		<Singapore>23745</Singapore>\
		<NewYork>72742</NewYork>\
		<LA>102195</LA>\
		<Washington>30407</Washington>\
		<Revenue>360322</Revenue>\
		<Percent>33</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>2/4</Quarter>\
		<Month>6</Month>\
		<Seoul>19217</Seoul>\
		<Tokyo>75298</Tokyo>\
		<Singapore>70807</Singapore>\
		<NewYork>36447</NewYork>\
		<LA>100805</LA>\
		<Washington>84934</Washington>\
		<Revenue>387508</Revenue>\
		<Percent>36</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>3/4</Quarter>\
		<Month>7</Month>\
		<Seoul>74324</Seoul>\
		<Tokyo>64947</Tokyo>\
		<Singapore>101350</Singapore>\
		<NewYork>34673</NewYork>\
		<LA>24486</LA>\
		<Washington>57781</Washington>\
		<Revenue>357561</Revenue>\
		<Percent>28</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>3/4</Quarter>\
		<Month>8</Month>\
		<Seoul>85932</Seoul>\
		<Tokyo>95733</Tokyo>\
		<Singapore>40327</Singapore>\
		<NewYork>69255</NewYork>\
		<LA>80024</LA>\
		<Washington>102739</Washington>\
		<Revenue>474011</Revenue>\
		<Percent>37</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>3/4</Quarter>\
		<Month>9</Month>\
		<Seoul>101804</Seoul>\
		<Tokyo>65098</Tokyo>\
		<Singapore>79194</Singapore>\
		<NewYork>101669</NewYork>\
		<LA>30608</LA>\
		<Washington>73020</Washington>\
		<Revenue>451393</Revenue>\
		<Percent>35</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>4/4</Quarter>\
		<Month>10</Month>\
		<Seoul>92130</Seoul>\
		<Tokyo>91881</Tokyo>\
		<Singapore>45166</Singapore>\
		<NewYork>65524</NewYork>\
		<LA>45348</LA>\
		<Washington>72708</Washington>\
		<Revenue>412757</Revenue>\
		<Percent>36</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>4/4</Quarter>\
		<Month>11</Month>\
		<Seoul>80925</Seoul>\
		<Tokyo>70537</Tokyo>\
		<Singapore>25347</Singapore>\
		<NewYork>29360</NewYork>\
		<LA>76296</LA>\
		<Washington>42766</Washington>\
		<Revenue>325230</Revenue>\
		<Percent>29</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2013</Year>\
		<Quarter>4/4</Quarter>\
		<Month>12</Month>\
		<Seoul>99008</Seoul>\
		<Tokyo>30598</Tokyo>\
		<Singapore>99124</Singapore>\
		<NewYork>22776</NewYork>\
		<LA>107805</LA>\
		<Washington>38384</Washington>\
		<Revenue>397696</Revenue>\
		<Percent>35</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>1/4</Quarter>\
		<Month>1</Month>\
		<Seoul>68503</Seoul>\
		<Tokyo>10155</Tokyo>\
		<Singapore>47908</Singapore>\
		<NewYork>60857</NewYork>\
		<LA>104179</LA>\
		<Washington>109097</Washington>\
		<Revenue>400699</Revenue>\
		<Percent>31</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>1/4</Quarter>\
		<Month>2</Month>\
		<Seoul>80573</Seoul>\
		<Tokyo>75743</Tokyo>\
		<Singapore>107750</Singapore>\
		<NewYork>76243</NewYork>\
		<LA>79265</LA>\
		<Washington>85345</Washington>\
		<Revenue>504918</Revenue>\
		<Percent>40</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>1/4</Quarter>\
		<Month>3</Month>\
		<Seoul>23435</Seoul>\
		<Tokyo>30538</Tokyo>\
		<Singapore>86528</Singapore>\
		<NewYork>36735</NewYork>\
		<LA>96031</LA>\
		<Washington>96928</Washington>\
		<Revenue>370196</Revenue>\
		<Percent>29</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>2/4</Quarter>\
		<Month>4</Month>\
		<Seoul>35657</Seoul>\
		<Tokyo>109415</Tokyo>\
		<Singapore>45569</Singapore>\
		<NewYork>87683</NewYork>\
		<LA>92773</LA>\
		<Washington>53422</Washington>\
		<Revenue>424520</Revenue>\
		<Percent>45</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>2/4</Quarter>\
		<Month>5</Month>\
		<Seoul>50140</Seoul>\
		<Tokyo>30142</Tokyo>\
		<Singapore>83992</Singapore>\
		<NewYork>87292</NewYork>\
		<LA>72324</LA>\
		<Washington>32520</Washington>\
		<Revenue>356410</Revenue>\
		<Percent>37</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>2/4</Quarter>\
		<Month>6</Month>\
		<Seoul>39458</Seoul>\
		<Tokyo>10848</Tokyo>\
		<Singapore>10553</Singapore>\
		<NewYork>48474</NewYork>\
		<LA>25642</LA>\
		<Washington>36591</Washington>\
		<Revenue>171565</Revenue>\
		<Percent>18</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>3/4</Quarter>\
		<Month>7</Month>\
		<Seoul>33761</Seoul>\
		<Tokyo>49046</Tokyo>\
		<Singapore>31351</Singapore>\
		<NewYork>46829</NewYork>\
		<LA>97148</LA>\
		<Washington>42630</Washington>\
		<Revenue>300765</Revenue>\
		<Percent>31</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>3/4</Quarter>\
		<Month>8</Month>\
		<Seoul>89645</Seoul>\
		<Tokyo>72565</Tokyo>\
		<Singapore>23678</Singapore>\
		<NewYork>78847</NewYork>\
		<LA>62559</LA>\
		<Washington>87722</Washington>\
		<Revenue>415017</Revenue>\
		<Percent>42</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>3/4</Quarter>\
		<Month>9</Month>\
		<Seoul>14844</Seoul>\
		<Tokyo>30709</Tokyo>\
		<Singapore>83037</Singapore>\
		<NewYork>23130</NewYork>\
		<LA>65006</LA>\
		<Washington>48367</Washington>\
		<Revenue>265093</Revenue>\
		<Percent>27</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>4/4</Quarter>\
		<Month>10</Month>\
		<Seoul>30598</Seoul>\
		<Tokyo>55523</Tokyo>\
		<Singapore>90576</Singapore>\
		<NewYork>79997</NewYork>\
		<LA>71346</LA>\
		<Washington>63569</Washington>\
		<Revenue>391608</Revenue>\
		<Percent>34</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>4/4</Quarter>\
		<Month>11</Month>\
		<Seoul>64461</Seoul>\
		<Tokyo>61341</Tokyo>\
		<Singapore>74479</Singapore>\
		<NewYork>10715</NewYork>\
		<LA>40404</LA>\
		<Washington>93611</Washington>\
		<Revenue>345011</Revenue>\
		<Percent>30</Percent>\
	</RegionalRevenue>\
\
	<RegionalRevenue>\
		<Year>2014</Year>\
		<Quarter>4/4</Quarter>\
		<Month>12</Month>\
		<Seoul>99229</Seoul>\
		<Tokyo>95468</Tokyo>\
		<Singapore>108828</Singapore>\
		<NewYork>27176</NewYork>\
		<LA>28673</LA>\
		<Washington>54816</Washington>\
		<Revenue>414191</Revenue>\
		<Percent>36</Percent>\
	</RegionalRevenue>\
\
</RevenuesAnalysis>\
';

© 2017 KoolChart. All rights reserved.