Как сделать пример линии с названием в d3.js?

Question

[zelsky]

Делаю график при помощи d3 js, есть стиль для линии примерно такой:

.lineone path.line {
    fill: none;
    stroke: red;
    stroke-width: 2;
    stroke-dasharray: 10, 5;
}

circle.lineone {
    fill: red;
    stroke: red;

}

И сам код добавления лейбла для линии внизу графика.

svg.append("g")
        .append('text')
        .attr("class", "chart-label-actual")
        .text(' Label for lineone')
        .attr('x', 1)
        .attr('y', height - 50)

Вопрос как нарисовать прямую линию в качестве примера по правую сторону от лейбла ? Прямую линию с стилями для .lineone ?

Answer 1

[zelsky]

svg.append("g")
        .append("line")
        .attr("x1", width - 100)
        .attr("y1", height - 55)
        .attr("x2", width - 30)
        .attr("y2", height - 55)
        .attr("class", "lineone");