OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	12/31/2022 06:53:36 AM	rwxr-xr-x
📄 bar.js	7.96 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 heatmap.js	5.87 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 makeJson.js	1.64 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 radar.js	6.48 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 stock.js	5.6 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 tree.css	1.35 KB	08/14/2022 11:05:12 AM	rw-r--r--
📄 tree.js	4.79 KB	08/14/2022 11:05:12 AM	rw-r--r--

Editing: heatmap.js

function drawHeatChart(data, divId, Title, Width, Height, Ndim, Nmeas, MeasFormats,dispObj,toolTip){
	Height=makeProperHeight(Height, divId);
	Width=makeProperWidth(Width, divId);

if(Ndim<2){
		d3.select("#"+divId).html("<br><br><center><font color=red>Can't plot heat chart.<br>Two dimensions are required to plot heat chart.</font></center>");
		return false;
	}
	var Heading=data.slice(0,1);

dim1=new Array();
	dim2=new Array();
	for(var i=1; i<data.length;i++){
		dim1.push(data[i][0]);	
		dim2.push(data[i][1].replace("&amp;", "&"));	
		data[i][Ndim]=+data[i][Ndim];
	}

if(Heading[0][0] == "Month")
		dim1=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
	else
		dim1=sortNunique(dim1);

if(Heading[0][1] == "Month")
		dim2=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
	else
		dim2=sortNunique(dim2);
	var margin = { top: 20, right: 20, bottom: 50, left: 100 };

margin.left=d3.max(dim1, function (d) { return d.length; })*10;
	if(margin.left>150)
		margin.left=150;

var width=100, height=100, colors="", min=0, max=0, gridHeight="", gridWidth="", buckets="";

width = Width - margin.left - margin.right;
	height = Height - margin.top - margin.bottom;
	
	if(MeasFormats[0].charAt(1) == "t"){
		colors = ["#7fcdbb","#41b6c4","#1d91c0","#225ea8","#253494","#081d58"];
		min=0;
		max=getMaxFtime(data, Ndim);
	}
	else{
		colors = ["#ffffd9","#edf8b1","#c7e9b4","#7fcdbb","#41b6c4","#1d91c0","#225ea8","#253494","#081d58"];
		min=d3.min(data.slice(1), function (d) { return d[Ndim]; });
		max=d3.max(data.slice(1), function (d) { return d[Ndim]; });
		if(min<0){
			min=-4;
			colors=["red","#ffffd9","#edf8b1","#c7e9b4","#7fcdbb","#41b6c4","#1d91c0","#225ea8","#253494","#081d58"];
		}
	}

gridHeight = Math.floor(height / (dim1.length));
	gridWidth = Math.floor(width / (dim2.length));
	buckets = dim2.length;

for(i=1; i<data.length; i++){
		data[i][Ndim+Nmeas]=returnPos(dim1, data[i][0]);
		data[i][Ndim+Nmeas+1]=returnPos(dim2, data[i][1]);
	}		
	var colorScale = d3.scale.quantile()
		.domain([min, max])
		.range(colors);
	d3.select("#"+divId).html("");
	var svg = d3.select("#"+divId).append("svg")
		.attr("width", width + margin.left + margin.right)
		.attr("height", height + margin.top + margin.bottom)
		.append("g")
		.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
	d3.select("#"+divId).append("div").attr("class", "tipsy");

var dayLabels = svg.selectAll(".dayLabel")
		.data(dim1)
		.enter().append("text")
		.text(function (d) { return d; })
		.attr("x", 0)
		.attr("y", function (d, i) { return i * gridHeight; })
		.style("text-anchor", "end")
		.attr("transform", "translate(-6," + gridHeight/1.5+ ")")
		.attr("class", "dayLabel mono axis axis-workweek");

if(width/dim2.length > 30){
		var timeLabels = svg.selectAll(".timeLabel")
			.data(dim2)
			.enter().append("text")
			.text(function(d) { return d; })
			.attr("x", function(d, i) { return i * gridWidth; })
			.attr("y", 0)
			.style("text-anchor", "middle")
			.style("dominant-baseline", "middle")
			.attr("transform", "translate(" + gridWidth / 2 + ", -10)")
			.attr("class", "timeLabel mono axis axis-worktime");
	}
	else{
		svg.append("text")
			.attr("class", "title")
			.text(Heading[0][1].replace("&#37;","%"))
			.attr("x", width/2)
			.attr("y", 0)
			.style("text-anchor", "middle")
			.attr("transform", "translate(" + gridWidth / 2 + ", -6)")
			.attr("class", "timeLabel mono axis axis-worktime");
	}
	var heatMap = svg.selectAll(".hour")
		.data(data.slice(1))
		.enter().append("rect")
		.attr("x", function(d,i) { return d[Ndim+Nmeas+1] * gridWidth; })
		.attr("y", function(d,i) { return d[Ndim+Nmeas] * gridHeight; })
		.attr("rx", 4)
		.attr("ry", 4)
		.attr("class", "hour bordered")
		.attr("width", gridWidth)
		.attr("height", gridHeight)
		.style("fill", colors[0])
		.on("mouseover",function (d,i){toolTipHeat(Heading,Ndim,d,this,MeasFormats[0])})
		.on("mouseout",HideToolTipHeat);

heatMap.transition().duration(1000)
		.style("fill", function(d) { return colorScale(d[Ndim]); });

//heatMap.append("title").text(function(d) { return d[Ndim]; });

var legendElementWidth = Math.floor(width/(colorScale.quantiles().length+1));
	var legend = svg.selectAll(".legend")
		.data([0].concat(colorScale.quantiles()), function(d) { return d; })
		.enter().append("g")
		.attr("class", "legend");

legend.append("rect")
		.attr("x", function(d, i) { return legendElementWidth * i; })
		.attr("y", height)
		.attr("width", legendElementWidth)
		.attr("height", 20)
		.style("fill", function(d, i) { return colors[i]; });

legend.append("text")
		.attr("class", "mono")
		//.text(function(d) { return "≥ " + formatNumber(Math.round(d)); })
		.text(function(d) { 
			if(d<=0 && min<0) 
			return "< 0"; 
			else 
			return "> " + formatSmallScale(Math.round(d), MeasFormats[0]);
		})
		.attr("x", function(d, i) { return legendElementWidth * i; })
		.attr("y", height + 32);
	legend.append("text")
		.attr("class", "title")
		.text(Heading[0][Ndim].replace("&#37;","%"))
		.attr("x", width/2)
		.attr("y", height + 50);

for(i=1; i<data.length; i++){
		data[i].splice(Ndim+Nmeas,2);
	}		
}
function sortNunique(arr) {
	arr = arr.sort();
	var ret = [arr[0]];
	for (var i = 1; i < arr.length; i++) {
		if (arr[i-1] !== arr[i]) {
			ret.push(arr[i]);
		}
	}
	return ret;
}
function returnPos(arr, val){
	for(var i=0; i<arr.length; i++)
		if(arr[i] == val)
			return i;
}
function toolTipHeat(Heading,Ndim, d,ele, measFormat){
	var x=d3.event.pageX;
	var y=d3.event.pageY;
	$(ele).parent().parent().next().fadeIn(1,function() {
			var htmlStr="<div class=tipsy-inner>";
			for(var i=0; i<Ndim; i++){
				htmlStr+=Heading[0][i]+" : "+d[i]+"<br>";
			}
				htmlStr+=Heading[0][i]+" : "+formatData(d[i], measFormat, 0);
			htmlStr+="</div>";
			$(this).html(htmlStr);
			$(this).css({"left": x-100+"px","top": y+"px"});
			});
}
function HideToolTipHeat(){
	$(this).parent().parent().next().fadeOut(10);
}