var labelType, useGradients, nativeTextSupport, animate; (function() { var ua = navigator.userAgent, iStuff = ua.match(/iPhone/i) || ua.match(/iPad/i), typeOfCanvas = typeof HTMLCanvasElement, nativeCanvasSupport = (typeOfCanvas == 'object' || typeOfCanvas == 'function'), textSupport = nativeCanvasSupport && (typeof document.createElement('canvas').getContext('2d').fillText == 'function'); //I'm setting this based on the fact that ExCanvas provides text support for IE //and that as of today iPhone/iPad current text support is lame labelType = (!nativeCanvasSupport || (textSupport && !iStuff))? 'Native' : 'HTML'; nativeTextSupport = labelType == 'Native'; useGradients = nativeCanvasSupport; animate = !(iStuff || !nativeCanvasSupport); })(); var Log = { elem: false, write: function(text){ if (!this.elem) this.elem = document.getElementById('log'); this.elem.innerHTML = text; this.elem.style.left = (500 - this.elem.offsetWidth / 2) + 'px'; } }; function init(){ //init data var json = { "children": [ { "data":{"cap":"€946,828,000","sec": "Yes","$area": 946828224,"$color":"#009900"}, "id": "Silver Standard Resources ", "name": "Silver Standard Resources " }, { "data":{"cap":"€915,992,000","sec": "No","$area": 915991616,"$color":"#1B2956"}, "id": "Royal Bafokeng Platinum Ltd", "name": "Royal Bafokeng Platinum Ltd" }, { "data":{"cap":"€16,481,331,000","sec": "No","$area": 16481331200,"$color":"#1E3234"}, "id": "Kumba Iron Ore Ltd", "name": "Kumba Iron Ore Ltd" }, { "data":{"cap":"€34,697,000","sec": "No","$area": 34697328,"$color":"#183061"}, "id": "Trans Hex Group Ltd", "name": "Trans Hex Group Ltd" }, { "data":{"cap":"€2,674,668,000","sec": "No","$area": 2674668288,"$color":"#152851"}, "id": "Lonmin Plc *", "name": "Lonmin Plc *" }, { "data":{"cap":"€576,882,000","sec": "No","$area": 576882496,"$color":"#152F36"}, "id": "Gold One International Ltd *", "name": "Gold One International Ltd *" }, { "data":{"cap":"€3,041,199,000","sec": "No","$area": 3041198592,"$color":"#1B2E56"}, "id": "Assore Ltd", "name": "Assore Ltd" }, { "data":{"cap":"€6,375,450,000","sec": "No","$area": 6375450112,"$color":"#172A33"}, "id": "Exxaro Resources Ltd", "name": "Exxaro Resources Ltd" }, { "data":{"cap":"€9,124,175,000","sec": "Yes","$area": 9124174848,"$color":"#009900"}, "id": "Gold Fields Ltd", "name": "Gold Fields Ltd" }, { "data":{"cap":"€289,079,000","sec": "No","$area": 289079424,"$color":"#192857"}, "id": "Pan African Resources Plc *", "name": "Pan African Resources Plc *" }, { "data":{"cap":"€19,295,000","sec": "No","$area": 19295470,"$color":"#1E2D3C"}, "id": "Firestone Energy Ltd *", "name": "Firestone Energy Ltd *" }, { "data":{"cap":"€367,970,000","sec": "No","$area": 367969728,"$color":"#162E45"}, "id": "Evraz Highveld Steel And Van", "name": "Evraz Highveld Steel And Van" }, { "data":{"cap":"€10,846,129,000","sec": "No","$area": 10846129152,"$color":"#1C3050"}, "id": "Impala Platinum Holdings Ltd", "name": "Impala Platinum Holdings Ltd" }, { "data":{"cap":"€4,119,708,000","sec": "Yes","$area": 4119708160,"$color":"#009900"}, "id": "Harmony Gold Mining Co Ltd", "name": "Harmony Gold Mining Co Ltd" }, { "data":{"cap":"€26,267,000","sec": "No","$area": 26267010,"$color":"#172F43"}, "id": "African Eagle Resources Plc *", "name": "African Eagle Resources Plc *" }, { "data":{"cap":"€15,486,000","sec": "No","$area": 15485703,"$color":"#19323D"}, "id": "Ferrum Crescent Ltd *", "name": "Ferrum Crescent Ltd *" }, { "data":{"cap":"€25,885,000","sec": "No","$area": 25884734,"$color":"#142D5A"}, "id": "Bauba Platinum Ltd", "name": "Bauba Platinum Ltd" }, { "data":{"cap":"€144,743,000","sec": "No","$area": 144742896,"$color":"#162E36"}, "id": "Witwatersrand Con Gold Res", "name": "Witwatersrand Con Gold Res" }, { "data":{"cap":"","sec": "No","$area": 1,"$color":"#1D3258"}, "id": "Thabex Ltd *", "name": "Thabex Ltd *" }, { "data":{"cap":"€150,665,953,000","sec": "Yes","$area": 150665953280,"$color":"#009900"}, "id": "Bhp Billiton Plc", "name": "Bhp Billiton Plc" }, { "data":{"cap":"€529,101,000","sec": "No","$area": 529101120,"$color":"#1C2C3B"}, "id": "Coal Of Africa Ltd *", "name": "Coal Of Africa Ltd *" }, { "data":{"cap":"€898,783,000","sec": "No","$area": 898782592,"$color":"#152858"}, "id": "Optimum Coal Holdings", "name": "Optimum Coal Holdings" }, { "data":{"cap":"€49,942,000","sec": "No","$area": 49942448,"$color":"#182C50"}, "id": "Metmar Ltd", "name": "Metmar Ltd" }, { "data":{"cap":"€14,880,855,000","sec": "No","$area": 14880855040,"$color":"#162C5E"}, "id": "Anglo American Platinum Ltd", "name": "Anglo American Platinum Ltd" }, { "data":{"cap":"€1,999,651,000","sec": "No","$area": 1999650560,"$color":"#173236"}, "id": "Uranium One Inc *", "name": "Uranium One Inc *" }, { "data":{"cap":"€50,333,000","sec": "No","$area": 50333408,"$color":"#162A55"}, "id": "Sephaku Holdings Ltd", "name": "Sephaku Holdings Ltd" }, { "data":{"cap":"€160,015,000","sec": "No","$area": 160014880,"$color":"#153152"}, "id": "Petmin Ltd", "name": "Petmin Ltd" }, { "data":{"cap":"€50,464,000","sec": "No","$area": 50463812,"$color":"#192F53"}, "id": "Buildmax Ltd", "name": "Buildmax Ltd" }, { "data":{"cap":"€18,163,000","sec": "No","$area": 18163100,"$color":"#1D2F4F"}, "id": "Rockwell Diamonds Inc *", "name": "Rockwell Diamonds Inc *" }, { "data":{"cap":"€2,994,270,000","sec": "Yes","$area": 2994270208,"$color":"#009900"}, "id": "Arcelormittal South Africa", "name": "Arcelormittal South Africa" }, { "data":{"cap":"€230,522,000","sec": "No","$area": 230521616,"$color":"#1B303E"}, "id": "Wesizwe Platinum Ltd", "name": "Wesizwe Platinum Ltd" }, { "data":{"cap":"€20,312,000","sec": "No","$area": 20312248,"$color":"#172953"}, "id": "Randgold & Exploration Co", "name": "Randgold & Exploration Co" }, { "data":{"cap":"€389,764,000","sec": "Yes","$area": 389764320,"$color":"#009900"}, "id": "Great Basin Gold Ltd *", "name": "Great Basin Gold Ltd *" }, { "data":{"cap":"€39,563,000","sec": "No","$area": 39563164,"$color":"#172D43"}, "id": "Sacoil Holding Ltd", "name": "Sacoil Holding Ltd" }, { "data":{"cap":"€5,279,000","sec": "No","$area": 5279434,"$color":"#1E2E5D"}, "id": "Miranda Mineral Holdings Ltd", "name": "Miranda Mineral Holdings Ltd" }, { "data":{"cap":"€25,225,476,000","sec": "Yes","$area": 25225476096,"$color":"#009900"}, "id": "Sasol Ltd", "name": "Sasol Ltd" }, { "data":{"cap":"€47,444,000","sec": "No","$area": 47444108,"$color":"#142F57"}, "id": "Forbes & Manhattan Coal Corp *", "name": "Forbes & Manhattan Coal Corp *" }, { "data":{"cap":"€46,241,000","sec": "No","$area": 46240828,"$color":"#173243"}, "id": "Bsi Steel Ltd", "name": "Bsi Steel Ltd" }, { "data":{"cap":"€5,779,000","sec": "No","$area": 5779491,"$color":"#1B2B46"}, "id": "Chrometco Ltd", "name": "Chrometco Ltd" }, { "data":{"cap":"€2,463,000","sec": "No","$area": 2462813,"$color":"#1C2943"}, "id": "Simmer & Jack Mines Ltd", "name": "Simmer & Jack Mines Ltd" }, { "data":{"cap":"€46,899,000","sec": "No","$area": 46898668,"$color":"#173140"}, "id": "First Uranium Corp *", "name": "First Uranium Corp *" }, { "data":{"cap":"€49,619,000","sec": "No","$area": 49619140,"$color":"#162A38"}, "id": "Keaton Energy Holdings Ltd", "name": "Keaton Energy Holdings Ltd" }, { "data":{"cap":"€13,195,000","sec": "No","$area": 13195322,"$color":"#15294E"}, "id": "Wescoal Holdings Ltd", "name": "Wescoal Holdings Ltd" }, { "data":{"cap":"€679,471,000","sec": "No","$area": 679470848,"$color":"#14283A"}, "id": "Palabora Mining Co Ltd", "name": "Palabora Mining Co Ltd" }, { "data":{"cap":"€424,843,000","sec": "No","$area": 424843104,"$color":"#15294F"}, "id": "Eastern Platinum Ltd *", "name": "Eastern Platinum Ltd *" }, { "data":{"cap":"€16,251,000","sec": "No","$area": 16251322,"$color":"#192959"}, "id": "Insimbi Refractory And Alloy", "name": "Insimbi Refractory And Alloy" }, { "data":{"cap":"€221,584,000","sec": "No","$area": 221583600,"$color":"#14314F"}, "id": "Merafe Resources Ltd", "name": "Merafe Resources Ltd" }, { "data":{"cap":"€289,492,000","sec": "No","$area": 289491520,"$color":"#1B2D42"}, "id": "Oando Plc", "name": "Oando Plc" }, { "data":{"cap":"€13,835,000","sec": "No","$area": 13834638,"$color":"#19293D"}, "id": "Delrand Resources Ltd *", "name": "Delrand Resources Ltd *" }, { "data":{"cap":"€196,355,000","sec": "No","$area": 196355040,"$color":"#1E2F5A"}, "id": "Village Main Reef Ltd", "name": "Village Main Reef Ltd" }, { "data":{"cap":"€111,135,000","sec": "No","$area": 111134512,"$color":"#153164"}, "id": "Sentula Mining Ltd", "name": "Sentula Mining Ltd" }, { "data":{"cap":"€193,460,000","sec": "No","$area": 193460320,"$color":"#152E3F"}, "id": "Drdgold Ltd", "name": "Drdgold Ltd" }, { "data":{"cap":"€6,766,000","sec": "No","$area": 6765539,"$color":"#1D2C47"}, "id": "Kibo Mining Plc *", "name": "Kibo Mining Plc *" }, { "data":{"cap":"€81,168,000","sec": "Yes","$area": 81168184,"$color":"#009900"}, "id": "Anooraq Resources Corp *", "name": "Anooraq Resources Corp *" }, { "data":{"cap":"€16,588,000","sec": "No","$area": 16588443,"$color":"#172E44"}, "id": "Goliath Gold Mining Ltd", "name": "Goliath Gold Mining Ltd" }, { "data":{"cap":"€13,698,000","sec": "No","$area": 13698458,"$color":"#173036"}, "id": "South African Coal Mining Ho", "name": "South African Coal Mining Ho" }, { "data":{"cap":"€3,736,770,000","sec": "No","$area": 3736769792,"$color":"#15283F"}, "id": "African Rainbow Minerals Ltd", "name": "African Rainbow Minerals Ltd" }, { "data":{"cap":"€28,122,000","sec": "No","$area": 28121718,"$color":"#1C2A63"}, "id": "Central Rand Gold Ltd", "name": "Central Rand Gold Ltd" }, { "data":{"cap":"€38,118,000","sec": "No","$area": 38118364,"$color":"#152D64"}, "id": "Zci Ltd", "name": "Zci Ltd" }, { "data":{"cap":"","sec": "No","$area": 1,"$color":"#173063"}, "id": "Miranda Mineral Holdings-rts *", "name": "Miranda Mineral Holdings-rts *" }, { "data":{"cap":"€12,140,000","sec": "No","$area": 12139575,"$color":"#142F5C"}, "id": "Infrasors Holdings Ltd", "name": "Infrasors Holdings Ltd" }, { "data":{"cap":"€13,508,031,000","sec": "Yes","$area": 13508031488,"$color":"#009900"}, "id": "Anglogold Ashanti Ltd", "name": "Anglogold Ashanti Ltd" }, { "data":{"cap":"€43,234,226,000","sec": "No","$area": 43234226176,"$color":"#1E2C53"}, "id": "Anglo American Plc *", "name": "Anglo American Plc *" }, { "data":{"cap":"€1,072,915,000","sec": "No","$area": 1072914688,"$color":"#1E2F4D"}, "id": "Aquarius Platinum Ltd *", "name": "Aquarius Platinum Ltd *" }, { "data":{"cap":"€5,398,000","sec": "No","$area": 5398074,"$color":"#142E5A"}, "id": "Platfields Ltd", "name": "Platfields Ltd" }, { "data":{"cap":"€281,829,000","sec": "No","$area": 281828608,"$color":"#162942"}, "id": "Hulamin Ltd", "name": "Hulamin Ltd" }, { "data":{"cap":"","sec": "No","$area": 1,"$color":"#1A2B41"}, "id": "Jci Ltd *", "name": "Jci Ltd *" }, { "data":{"cap":"€16,638,000","sec": "No","$area": 16638310,"$color":"#19323B"}, "id": "Diamondcorp Plc *", "name": "Diamondcorp Plc *" }, { "data":{"cap":"€14,665,000","sec": "No","$area": 14664933,"$color":"#1A325B"}, "id": "Tawana Resources Nl *", "name": "Tawana Resources Nl *" }, { "data":{"cap":"","sec": "Yes","$area": 1,"$color":"#009900"}, "id": "Sasol Ltd - Bee *", "name": "Sasol Ltd - Bee *" }, { "data":{"cap":"","sec": "No","$area": 1,"$color":"#192A52"}, "id": "Pamodzi Gold Ltd *", "name": "Pamodzi Gold Ltd *" }, { "data":{"cap":"€1,176,474,000","sec": "No","$area": 1176473728,"$color":"#182B57"}, "id": "Northam Platinum Ltd", "name": "Northam Platinum Ltd" }, { "data":{"cap":"€56,351,000","sec": "No","$area": 56351132,"$color":"#183135"}, "id": "Jubilee Platinum Plc *", "name": "Jubilee Platinum Plc *" }, { "data":{"cap":"€87,869,000","sec": "No","$area": 87868912,"$color":"#17324E"}, "id": "Resource Generation Ltd *", "name": "Resource Generation Ltd *" } ] }; //end //init TreeMap var tm = new $jit.TM.Squarified({ //where to inject the visualization injectInto: 'infovis', //parent box title heights titleHeight: 0, //enable animations animate: false, //box offsets offset: 1, //Attach left and right click events Events: { enable: false }, duration: 1000, //Enable tips Tips: { enable: true, //add positioning offsets offsetX: 20, offsetY: 20, //implement the onShow method to //add content to the tooltip when a node //is hovered onShow: function(tip, node, isLeaf, domElement) { var html = "
" + node.name + "
"; var data = node.data; if(data.cap) { html += "Market Cap: " + data.cap; } if(data.sec) { html += "
SEC Coverage: " + data.sec; } tip.innerHTML = html; } }, //Add the name of the node in the correponding label //This method is called once, on label creation. onCreateLabel: function(domElement, node){ // if (node.data.$width > 10) { domElement.innerHTML = node.name; // } var style = domElement.style; style.display = ''; style.border = '1px solid transparent'; domElement.onmouseover = function() { style.border = '1px solid #9FD4FF'; }; domElement.onmouseout = function() { style.border = '1px solid transparent'; }; } }); tm.loadJSON(json); tm.refresh(); //end //add events to radio buttons var sq = $jit.id('r-sq'), st = $jit.id('r-st'), sd = $jit.id('r-sd'); var util = $jit.util; util.addEvent(sq, 'change', function() { if(!sq.checked) return; util.extend(tm, new $jit.Layouts.TM.Squarified); tm.refresh(); }); util.addEvent(st, 'change', function() { if(!st.checked) return; util.extend(tm, new $jit.Layouts.TM.Strip); tm.layout.orientation = "v"; tm.refresh(); }); util.addEvent(sd, 'change', function() { if(!sd.checked) return; util.extend(tm, new $jit.Layouts.TM.SliceAndDice); tm.layout.orientation = "v"; tm.refresh(); }); //add event to the back button var back = $jit.id('back'); $jit.util.addEvent(back, 'click', function() { tm.out(); }); }