D3js SVG открытые строки отображают артефакт заполнения, как это исправить?
Я только что добавил французские rivers_lines в SVG, сгенерированный D3js. Теперь он отображает результат как:
Мне нужно держать речные линии без артефактов.
Данные: топойсон из дуг.
Код CSS:
.rivers {
fill: none;
fill-opacity: .1;
stroke-width:1px;
stroke: #C6ECFF;
}
тот же результат с некоторыми цветами и непрозрачностью около нуля:
fill: #FF0000;
fill-opacity: .1;
Код D3:
rivers = topojson.feature(fra, fra.objects.rivers),
//Append rivers
svg.append("path")
.datum(rivers)
.attr("d", path)
svg.selectAll(".rivers")
.data(topojson.feature(fra, fra.objects.rivers).features)
.enter().append("path")
.attr("class", function(d) { return "rivers"; })
.attr("data-name-en", function(d) { return d.properties.name; })
.attr("d", path);
мойполная скрипка временно здесь.
Как это исправить?