我正在使用d3库开发一个HeatMap,我发现了一个可以涵盖我的用法的示例。 现在,我不知道如何编辑从零到OneMaxValue(正向)生成y轴的代码。在所附的img我的情况下,我试图“旋转” y轴(dayLabels),因此还要生成地图 Link
var dayLabels = svg.selectAll(".dayLabel")
.data(days)
.enter().append("text")
.text(function (d) { return d; })
.attr("x", 0)
.attr("y", function (d, i) { return i * gridSize; })
.style("text-anchor", "end")
.attr("transform", "translate(-6," + gridSize / 1.5 + ")")
.attr("class", function (d, i) { return ((i >= 0 && i <= 4) ? "dayLabel mono axis " : "dayLabel mono axis");
});
var heatMap = svg.selectAll(".hour")
.data(accidents)
.enter().append("rect")
.attr("x", function(d) { return (d.hour - 1) * gridSize; })
.attr("y", function(d) { return (d.day - 1) * gridSize; })
.attr("class", "hour bordered")
.attr("width", gridSize)
.attr("height", gridSize)
.style("stroke", "white")
.style("stroke-opacity", 0.3)
.style("fill", function(d) { return colorScale(d.count); });