neale/moth
neale
/
moth
mirror of https://github.com/dirtbags/moth.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #28 from cgtboy1988/master 

Scoreboard Vertical Scaling and Colors Fix
This commit is contained in:
Neale Pickett 2017-12-31 14:42:05 -07:00 committed by GitHub
parent b97a67c599 da130222b3
commit 6bee6c8153
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
www/scoreboard-llnl-timeline.html
View File

@ -63,8 +63,7 @@ window.addEventListener("load", init);
</script> </script>
</head> </head>
<body> <body>
<h1>Scoreboard</h1> <h1 id="title">Scoreboard</h1>
<div id="scoreboard"></div> <div id="scoreboard"></div>
</body> </body>
</html> </html>

24
www/scoreboard-llnl.js
View File

@ -148,12 +148,16 @@ function scoreboard(element, continuous, mode, interval) {
var graph = document.createElement("svg"); var graph = document.createElement("svg");
graph.id = "graph"; graph.id = "graph";
graph.style.width="100%"; graph.style.width="100%";
graph.style.height="40em"; graph.style.height = "100vh";
var titleHeight = document.getElementById("title").clientHeight;
titleHeight += document.getElementById("title").offsetTop * 2;
graph.style.backgroundColor = "white"; graph.style.backgroundColor = "white";
graph.style.display = "table"; graph.style.display = "table";
var holdingDiv = document.createElement("div"); var holdingDiv = document.createElement("div");
holdingDiv.align="center"; holdingDiv.align="center";
holdingDiv.id="holding"; holdingDiv.id="holding";
holdingDiv.style.height = "100%";
element.style.height = "100%";
element.appendChild(holdingDiv); element.appendChild(holdingDiv);
holdingDiv.appendChild(graph); holdingDiv.appendChild(graph);
@ -162,6 +166,7 @@ function scoreboard(element, continuous, mode, interval) {
var width = graph.offsetWidth; var width = graph.offsetWidth;
var height = graph.offsetHeight; var height = graph.offsetHeight;
height = height - titleHeight - margins;
//var xScale = d3.scaleLinear().range([minTime, maxTime]); //var xScale = d3.scaleLinear().range([minTime, maxTime]);
//var yScale = d3.scaleLinear().range([0, topActualScore]); //var yScale = d3.scaleLinear().range([0, topActualScore]);
@ -283,13 +288,13 @@ function scoreboard(element, continuous, mode, interval) {
.text("Time (minutes)"); .text("Time (minutes)");
var legend = graph.append("g"); var legend = graph.append("g");
var legendRowHeight = (height) / 10; var legendRowHeight = (height - margins) / 10;
legend.selectAll("rect") legend.selectAll("rect")
.data(winningTeams) .data(winningTeams)
.enter() .enter()
.append("rect") .append("rect")
.attr("class", function(d){ return "team_" + d; }) .attr("class", function(d){ return "team_" + d; })
.attr("fill", function(d, i){ return colorScale[i * 2 + 1]; }) .attr("fill", function(d, i){ return colorScale[i * 2]; })
.style("z-index", function(d, i){ return i; }) .style("z-index", function(d, i){ return i; })
.attr("x", 0) .attr("x", 0)
.attr("y", function(d, i){ return legendRowHeight * i; }) .attr("y", function(d, i){ return legendRowHeight * i; })
@ -343,8 +348,8 @@ function scoreboard(element, continuous, mode, interval) {
.style("stroke", colorScale[(maxNumEntry - zIndex) * 2]) .style("stroke", colorScale[(maxNumEntry - zIndex) * 2])
.style("fill", colorScale[(maxNumEntry - zIndex) * 2]); .style("fill", colorScale[(maxNumEntry - zIndex) * 2]);
legend.selectAll("." + curClass) legend.selectAll("." + curClass)
.style("stroke", colorScale[(maxNumEntry - zIndex) * 2 + 1]) .style("stroke", colorScale[(maxNumEntry - zIndex) * 2])
.style("fill", colorScale[(maxNumEntry - zIndex) * 2 + 1]); .style("fill", colorScale[(maxNumEntry - zIndex) * 2]);
d3.select("body").selectAll("text") d3.select("body").selectAll("text")
.style("stroke-width", 0); .style("stroke-width", 0);
} }
@ -388,8 +393,8 @@ function scoreboard(element, continuous, mode, interval) {
.style("stroke", colorScale[(maxNumEntry - zIndex) * 2]) .style("stroke", colorScale[(maxNumEntry - zIndex) * 2])
.style("fill", colorScale[(maxNumEntry - zIndex) * 2]); .style("fill", colorScale[(maxNumEntry - zIndex) * 2]);
legend.selectAll("." + curClass) legend.selectAll("." + curClass)
.style("stroke", colorScale[(maxNumEntry - zIndex) * 2 + 1]) .style("stroke", colorScale[(maxNumEntry - zIndex) * 2])
.style("fill", colorScale[(maxNumEntry - zIndex) * 2 + 1]); .style("fill", colorScale[(maxNumEntry - zIndex) * 2]);
d3.select("body").selectAll("text") d3.select("body").selectAll("text")
.style("stroke-width", 0); .style("stroke-width", 0);
} }
@ -412,8 +417,8 @@ function scoreboard(element, continuous, mode, interval) {
.style("stroke", colorScale[zIndex * 2]) .style("stroke", colorScale[zIndex * 2])
.style("fill", colorScale[zIndex * 2]); .style("fill", colorScale[zIndex * 2]);
legend.selectAll("." + curClass) legend.selectAll("." + curClass)
.style("stroke", colorScale[(zIndex) * 2 + 1]) .style("stroke", colorScale[(zIndex) * 2])
.style("fill", colorScale[(zIndex) * 2 + 1]); .style("fill", colorScale[(zIndex) * 2]);
d3.select("body").selectAll("text") d3.select("body").selectAll("text")
.style("stroke-width", 0); .style("stroke-width", 0);
} }
@ -521,4 +526,3 @@ function scoreboard(element, continuous, mode, interval) {
} }
once(); once();
} }