Make tooltip readable

This commit is contained in:
Jan Philipp Timme 2017-12-29 23:23:37 +01:00
parent f0a9922127
commit 8d77aea929
1 changed files with 15 additions and 13 deletions

View File

@ -255,14 +255,23 @@ function createLineGraph(containerId, raceData){
textArr = getEndPointTextArray(raceData,d);
}
var tooltipGroup = svg.append("g")
.attr("id", "t" + d.lap + "-" + d.position + "-" + i); // Unique id so it can be removed later
tooltipGroup.append("rect")
.attr("style", "fill:rgb(225,225,225);stroke:black;stroke-width:2;")
.attr("width", "150")
.attr("height", "80")
.attr("x", function() { return x(d.lap) + 10; })
.attr("y", function() { return y(d.position) + 10; });
//Necessary to add Text for each Line
textArr.forEach((text, textIndex) =>{
// Specify where to put label of text
svg.append("text")
.attr("id", "t" + d.lap + "-" + d.position + "-" + i + "-" + textIndex)// Create an id for text so we can select it later for removing on mouseout
.attr("x", function() { return x(d.lap) - 70; })
.attr("y", function() { return y(d.position) - 15; })
.attr("dy", textIndex + "em")
tooltipGroup.append("text")
.attr("dy", (textIndex + 1) + "em")
.attr("x", function() { return x(d.lap) + 15; })
.attr("y", function() { return y(d.position) + 15; })
.text(function() {
return text; // Value of the text
});
@ -297,22 +306,19 @@ function createLineGraph(containerId, raceData){
textArr.forEach((text, textIndex)=> {
// Select text by id and then remove
d3.select("#t" + d.lap + "-" + d.position + "-" + i + "-" + textIndex).remove(); // Remove text location
d3.select("#t" + d.lap + "-" + d.position + "-" + i).remove(); // Remove text location
});
}
function getLapTextArray(raceData, d){
var driverText = getDriverCodeById(raceData,d.driverId);
var lapText = "Lap: " + d.lap;
var posText = "Pos: " + d.position;
var returnArr = [driverText, lapText, posText];
if(d.time){
var timeText = "Time: " + d.time;
returnArr.push(timeText);
}
return returnArr;
}
@ -327,17 +333,13 @@ function createLineGraph(containerId, raceData){
var status = "";
var endTextArr = getLapTextArray(raceData,d);
var allStatus = queries.getStatus();
for(var key in allStatus){
if(key === undefined) continue;
if(allStatus[key].statusId === d.finished.statusId){
status = allStatus[key].status;
}
}
endTextArr.push("Reason: " + status);
return endTextArr;
}