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":"","sec": "No","$area": 1,"$color":"#1E3242"},
"id": "United Co Rus-spon Gdr Reg S *",
"name": "United Co Rus-spon Gdr Reg S *"
},
{
"data":{"cap":"$4,010,192,000","sec": "No","$area": 3168359168,"$color":"#1E2E3E"},
"id": "Eramet",
"name": "Eramet"
},
{
"data":{"cap":"$99,263,691,000","sec": "Yes","$area": 78425923584,"$color":"#009900"},
"id": "Schlumberger Ltd *",
"name": "Schlumberger Ltd *"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#1E2A42"},
"id": "United Co Rus-spon Gdr 144a *",
"name": "United Co Rus-spon Gdr 144a *"
},
{
"data":{"cap":"$9,974,501,000","sec": "No","$area": 7880620544,"$color":"#1C2952"},
"id": "Technip Sa",
"name": "Technip Sa"
},
{
"data":{"cap":"$10,537,918,000","sec": "Yes","$area": 8325763072,"$color":"#009900"},
"id": "Cliffs Natural Resources Inc *",
"name": "Cliffs Natural Resources Inc *"
},
{
"data":{"cap":"$3,924,782,000","sec": "No","$area": 3100878848,"$color":"#142B41"},
"id": "Imerys Sa",
"name": "Imerys Sa"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#1C2E47"},
"id": "Drdgold Ltd - Call Auction *",
"name": "Drdgold Ltd - Call Auction *"
},
{
"data":{"cap":"$1,107,502,000","sec": "No","$area": 875011136,"$color":"#1B313D"},
"id": "Esso Ste Anonyme Francaise",
"name": "Esso Ste Anonyme Francaise"
},
{
"data":{"cap":"$1,194,341,000","sec": "No","$area": 943621248,"$color":"#1B3040"},
"id": "Aperam *",
"name": "Aperam *"
},
{
"data":{"cap":"$113,491,000","sec": "No","$area": 89666432,"$color":"#14305F"},
"id": "Recylex Sa",
"name": "Recylex Sa"
},
{
"data":{"cap":"$31,017,700,000","sec": "Yes","$area": 24506359808,"$color":"#009900"},
"id": "Arcelormittal *",
"name": "Arcelormittal *"
},
{
"data":{"cap":"$120,420,030,000","sec": "Yes","$area": 95141052416,"$color":"#009900"},
"id": "Total Sa",
"name": "Total Sa"
},
{
"data":{"cap":"$109,594,927,000","sec": "Yes","$area": 86588391424,"$color":"#009900"},
"id": "Rio Tinto Plc *",
"name": "Rio Tinto Plc *"
},
{
"data":{"cap":"$3,871,143,000","sec": "Yes","$area": 3058499328,"$color":"#009900"},
"id": "Cie Generale De Geophysique",
"name": "Cie Generale De Geophysique"
},
{
"data":{"cap":"$1,876,717,000","sec": "No","$area": 1482749952,"$color":"#172F40"},
"id": "Total Gabon",
"name": "Total Gabon"
},
{
"data":{"cap":"$13,800,000","sec": "No","$area": 10902857,"$color":"#15324E"},
"id": "Rocamat",
"name": "Rocamat"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#17285C"},
"id": "Total Sa-rts *",
"name": "Total Sa-rts *"
},
{
"data":{"cap":"$3,131,000","sec": "No","$area": 2473911,"$color":"#1E2D3C"},
"id": "Georex Sa",
"name": "Georex Sa"
},
{
"data":{"cap":"$254,008,000","sec": "No","$area": 200685584,"$color":"#1D2844"},
"id": "Maurel & Prom Nigeria",
"name": "Maurel & Prom Nigeria"
},
{
"data":{"cap":"$254,708,000","sec": "No","$area": 201238608,"$color":"#1A3248"},
"id": "Euro Ressources Sa",
"name": "Euro Ressources Sa"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#1E3033"},
"id": "Zccm Investment Holdings-b *",
"name": "Zccm Investment Holdings-b *"
},
{
"data":{"cap":"$16,184,000","sec": "No","$area": 12786501,"$color":"#1C2B45"},
"id": "Batla Minerals Sa",
"name": "Batla Minerals Sa"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#162B57"},
"id": "Dynafond Sa *",
"name": "Dynafond Sa *"
},
{
"data":{"cap":"","sec": "No","$area": 1,"$color":"#15325C"},
"id": "Stilfontein Gold Mining Co *",
"name": "Stilfontein Gold Mining Co *"
},
{
"data":{"cap":"$39,316,000","sec": "No","$area": 31062978,"$color":"#19283C"},
"id": "Auplata",
"name": "Auplata"
},
{
"data":{"cap":"$1,940,632,000","sec": "No","$area": 1533248384,"$color":"#1B285F"},
"id": "Maurel Et Prom",
"name": "Maurel Et Prom"
},
{
"data":{"cap":"$244,863,000","sec": "No","$area": 193460320,"$color":"#1D3260"},
"id": "Drdgold Ltd *",
"name": "Drdgold Ltd *"
},
{
"data":{"cap":"$8,257,000","sec": "No","$area": 6523274,"$color":"#193038"},
"id": "Dietswell",
"name": "Dietswell"
},
{
"data":{"cap":"$266,416,000","sec": "No","$area": 210489120,"$color":"#1D2E4F"},
"id": "Jacquet Metal Service",
"name": "Jacquet Metal Service"
},
{
"data":{"cap":"$6,045,000","sec": "No","$area": 4775890,"$color":"#173151"},
"id": "Ati Petroleum Ltd",
"name": "Ati Petroleum Ltd"
},
{
"data":{"cap":"$115,743,000","sec": "No","$area": 91445704,"$color":"#1C3057"},
"id": "Heurtey Petrochem",
"name": "Heurtey Petrochem"
},
{
"data":{"cap":"$11,597,102,000","sec": "Yes","$area": 9162599424,"$color":"#009900"},
"id": "Weatherford Intl Ltd *",
"name": "Weatherford Intl Ltd *"
},
{
"data":{"cap":"$128,930,910,000","sec": "Yes","$area": 101865299968,"$color":"#009900"},
"id": "Vale Sa-sp Pref Adr *",
"name": "Vale Sa-sp Pref Adr *"
},
{
"data":{"cap":"$468,764,000","sec": "No","$area": 370359744,"$color":"#172C54"},
"id": "Entrepose Contracting",
"name": "Entrepose Contracting"
},
{
"data":{"cap":"$48,246,000","sec": "No","$area": 38118364,"$color":"#142E63"},
"id": "Zci Ltd *",
"name": "Zci Ltd *"
},
{
"data":{"cap":"","sec": "Yes","$area": 1,"$color":"#009900"},
"id": "Vale Sa-Sp Adr *",
"name": "Vale Sa-Sp Adr *"
},
{
"data":{"cap":"$2,162,067,000","sec": "No","$area": 1708198784,"$color":"#162B34"},
"id": "Bourbon Sa",
"name": "Bourbon Sa"
},
{
"data":{"cap":"$9,637,000","sec": "No","$area": 7613923,"$color":"#162C53"},
"id": "United Anodisers",
"name": "United Anodisers"
}
]
};
//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();
});
}