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.