perf: remove x-axis ticks and replace with a single label
Change-Id: I443cbad5273c7f9febf9be2e4acdb25b1bbb0412
Reviewed-on: https://go-review.googlesource.com/c/build/+/412376
Reviewed-by: Michael Pratt <mpratt@google.com>
diff --git a/third_party/bandchart/bandchart.js b/third_party/bandchart/bandchart.js
index 00f41eb..5c8bcb0 100644
--- a/third_party/bandchart/bandchart.js
+++ b/third_party/bandchart/bandchart.js
@@ -41,7 +41,6 @@
xOrdTicks.push(xRange[1]);
const xScale = d3.scaleOrdinal(X, xOrdTicks);
const yScale = d3.scaleLinear(yDomain, yRange);
- const xAxis = d3.axisBottom(xScale).tickSizeOuter(0).tickValues(d3.map(C, c => c.slice(0, 7)));
const yAxis = d3.axisLeft(yScale).ticks(height / 40, "+%");
const svg = d3.create("svg")
@@ -165,16 +164,14 @@
.attr("opacity", 0.1)
.attr("d", area(I));
- // Add X axis.
- svg.append("g")
- .attr("transform", `translate(0,${height - marginBottom})`)
- .call(xAxis)
- .call(g => g.select(".domain").remove())
- .selectAll("text")
- .attr("y", 6)
- .attr("x", -42)
- .attr("transform", "rotate(315)")
- .style("text-anchor", "start");
+ // Add X axis label.
+ svg.append("text")
+ .attr("x", xRange[0] + (xRange[1]-xRange[0])/2)
+ .attr("y", yRange[0] + (yRange[0]-yRange[1])*0.12)
+ .attr("fill", "currentColor")
+ .attr("text-anchor", "middle")
+ .attr("font-size", "12px")
+ .text("Commits");
// Create center line.