Оси не отображаются на диаграмме D3

Question

Я пытаюсь создать тепловую карту. Код находится на Codepen: https://codepen.io/imestin/pen/qBOpodX?editors=1010

Моя проблема в том, что оси не отображаются на холсте SVG. Осматривая его с помощью инструментов веб-разработчика, я вижу элементы.

Это линии, которые, на мой взгляд, важны при рисовании осей (для оси x): элементы рисуются правильно, базовый c Рисунок SVG работает.

Answer 1

Для домена и диапазона xScale требуется массив значений, например:

xScale = d3.scaleLinear()
.domain([minYear,maxYear])
.range([0,canvasX]);

Во-вторых, ось расположена за пределами холста, поэтому ее необходимо отрегулировать, например:

Canvas.append("g")
.attr("id","x-axis")
.attr("class","tick")
.attr("transform", "translate(" + (edge) + ", " + (canvasY - 20) + ")")
.call(xAxis)