Skip to content

Commit

Permalink
fixed some color bugs in the tooltip for both line and bar charts
Browse files Browse the repository at this point in the history
  • Loading branch information
Hamza Elhamdadi authored and Hamza Elhamdadi committed Jul 24, 2023
1 parent 52362cf commit 96d0118
Show file tree
Hide file tree
Showing 4 changed files with 29 additions and 29 deletions.
18 changes: 9 additions & 9 deletions bar_chart/js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,12 +93,12 @@ function getBarChartData(props) {


// // //
let props = {
complexity: 'complex',
doTour: false,
showSource: true,
changes: true,
showCovidData: false,
allowInteraction: true
}
getBarChartData(props)
// let props = {
// complexity: 'moderate',
// doTour: true,
// showSource: true,
// changes: true,
// showCovidData: true,
// allowInteraction: true
// }
// getBarChartData(props)
2 changes: 1 addition & 1 deletion bar_chart/js/stacked_bar_chart.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@
<span style="font-size:11px;color: ${vis.color('Unvax_80')}"> ${number_format(d.data.Age_adjusted_unvax_IR)}</span>
<br>
<span style="font-size:11px;color: ${vis.color('Vax_80')}"> <b>${vis.rlabels[1]}:</b></span>
<span style="font-size:11px;color: ${vis.color('Unvax_50_79')}"> ${number_format(d.data.Age_adjusted_vax_IR)}</span>
<span style="font-size:11px;color: ${vis.color('Vax_80')}"> ${number_format(d.data.Age_adjusted_vax_IR)}</span>
<br>`
: `<b>Week:</b> ${d.Max_Week_Date2}<br>
<b>Year:</b> ${yearFormat(d.Max_Week_Date)}<br>
Expand Down
20 changes: 10 additions & 10 deletions line_chart/js/complex_line_chart.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,9 +105,9 @@ class LineChart {
d.append('div').attr('class', 'legend-label').text(vis.rlabels[i])
})
} else {
vac.append('div').attr('class', 'legend-value').append('svg').attr('id', "vacced").append('rect').style('fill', "orange")
vac.append('div').attr('class', 'legend-value').append('svg').attr('id', "vacced").append('rect').style('fill', "#ef701b")
vac.append('div').attr('class', 'legend-label').text(vis.rlabels[0]);
unv.append('div').attr('class', 'legend-value').append('svg').attr('id', "vacced").append('rect').style('fill', "blue")
unv.append('div').attr('class', 'legend-value').append('svg').attr('id', "vacced").append('rect').style('fill', "#0984ea")
unv.append('div').attr('class', 'legend-label').text(vis.rlabels[1])
}

Expand Down Expand Up @@ -382,7 +382,7 @@ class LineChart {
vis.svg.append("path")
.datum(vis.data)
.attr("fill", "none")
.attr("stroke", "orange")
.attr("stroke", "#ef701b")
.attr("stroke-width", 3.5)
.attr("d", d3.line()
.x(function (d) {
Expand All @@ -397,7 +397,7 @@ class LineChart {
vis.svg.append("path")
.datum(vis.data)
.attr("fill", "none")
.attr("stroke", "blue")
.attr("stroke", "#0984ea")
.attr("stroke-width", 3.5)
.attr("stroke-dasharray", ("4, 4"))
.attr("d", d3.line()
Expand All @@ -414,7 +414,7 @@ class LineChart {
vis.svg.append("path")
.datum(vis.data)
.attr("fill", "none")
.attr("stroke", "orange")
.attr("stroke", "#ef701b")
.attr("stroke-width", 3.5)
.attr("d", d3.line()
.x(function (d) {
Expand All @@ -429,7 +429,7 @@ class LineChart {
vis.svg.append("path")
.datum(vis.data)
.attr("fill", "none")
.attr("stroke", "blue")
.attr("stroke", "#0984ea")
.attr("stroke-width", 3.5)
.attr("stroke-dasharray", ("4, 4"))
.attr("d", d3.line()
Expand Down Expand Up @@ -726,15 +726,15 @@ class LineChart {
.attr("y", (this.complexity == 'complex' && this.allow_interaction) ? 60 : 30)
.attr("font-family", "Segoe UI")
.attr('font-size', '14px')
.style("fill", "black")
.style("fill", this.complexity == 'complex' ? 'black' : "#ef701b")
.attr('font-weight', 'bold')
.style("font-size", '12px');

vis.text4 = vis.tooltip.append("text")
.attr("class", "tooltip-text")
.attr("x", 10)
.attr("y", (this.complexity == 'complex' && this.allow_interaction) ? 80 : 45)
.style("fill", (this.complexity == 'complex' && this.allow_interaction) ? "#9e3a26" : "orange")
.style("fill", (this.complexity == 'complex' && this.allow_interaction) ? "#9e3a26" : "#ef701b")
.attr("font-family", "Segoe UI")
.style("font-size", '11px');

Expand All @@ -759,7 +759,7 @@ class LineChart {
.attr("class", "tooltip-text")
.attr("x", 10)
.attr("y", (this.complexity == 'complex' && this.allow_interaction) ? 160 : 70)
.style("fill", "black")
.style("fill", this.complexity == 'complex' ? 'black' : "#0984ea")
.attr('font-weight', 'bold')
.attr("font-family", "Segoe UI")
.style("font-size", '11px');
Expand All @@ -768,7 +768,7 @@ class LineChart {
.attr("class", "tooltip-text")
.attr("x", 10)
.attr("y", (this.complexity == 'complex' && this.allow_interaction) ? 180 : 85)
.style("fill", (this.complexity == 'complex' && this.allow_interaction) ? "#04386b" : "blue")
.style("fill", (this.complexity == 'complex' && this.allow_interaction) ? "#04386b" : "#0984ea")
.attr("font-family", "Segoe UI")
.style("font-size", '11px');

Expand Down
18 changes: 9 additions & 9 deletions line_chart/js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,12 +86,12 @@ function getLineChartData(props) {
});
}

let props = {
complexity: 'moderate',
doTour: false,
showSource: true,
changes: true,
showCovidData: false,
allowInteraction: true
};
getLineChartData(props);
// let props = {
// complexity: 'simple',
// doTour: false,
// showSource: true,
// changes: true,
// showCovidData: false,
// allowInteraction: true
// };
// getLineChartData(props);

0 comments on commit 96d0118

Please sign in to comment.