D3. js: Как я могу назначить один и тот же стиль верхней и правой линиям сетки с тем же стилем, что и линии сетки?

Question

Я новичок ie с d3. js, но я хотел бы удалить или изменить стиль этих линий для того же цвета линий сетки?

Я создал линию сетки с этим кодом:

    setGrid(canvas, scales){
    //Y Axis grid
    canvas.append("g")
    .attr("class", "grid")
    .attr("transform", "translate(" + OFFSET_LEFT + ", 0)")
    .call(d3.axisLeft(scales.yScale).tickSize(-(WIDTH - OFFSET_LEFT - OFFSET_RIGHT)).tickFormat(""));
    //X Axis grid
    canvas.append("g")
    .attr("class", "grid")
    .attr("transform", "translate(0, " + OFFSET_TOP + ")")
    .call(d3.axisBottom(scales.xScale).tickSize((HEIGHT - OFFSET_BOTTOM - OFFSET_TOP)).tickFormat(""));
}

И у меня есть стиль с этим css:

.grid line{
    stroke: blue;
}

Answer 1

Если вы хотите стилизовать свои оси, вы можете добавить этот код к себе:

.call(g => g.select('.domain').remove()) // removes the lines that make a square around the chart
.call(g =>
  g.selectAll('.YAxisLabel .tick:first-of-type line').attr('stroke', '#D4D4D4'), // append a style to line with ticks
);