Javascript 在chartist.js中将大纲添加到SVG数据点

我正在使用Chartist.js，只是想知道您是否可以帮我将一些样式应用到SVG。以下是我的代码：

jQuery：

new Chartist.Line('.ct-chart', {
  labels: [1, 2, 3, 4, 5, 6, 7, 8],
  series: [
    [5, 9, 7, 8, 5, 3, 5, 4]
  ]
}, {
  low: 0,
  showArea: true
});

HTML:

我只是想模拟他们在这个很棒的设计上所做的，我在运球上发现，每个数据点都有一个较暗的阴影轮廓/与背景相似的阴影。我曾尝试在CSS中使用outline，但它会在数据点周围产生一个黑色的正方形（或我选择的任何颜色），我不知道如何将其四舍五入

---

最后，这里是我在JSFIDLE中已经做过的-

您可以用

元素替换数据点默认

元素。这样可以控制圆笔划颜色、宽度和填充颜色

var chart=new charlist.Line（“.ct chart”{
标签：[1,2,3,4,5,6,7,8,9,10]，
系列：[
[5, 9, 7, 8, 5, 3, 5, 4, 9, 23],
]
}, {
低:0,，
展区：没错，
lineSmooth:ChartList.Interpolation.simple({
除数：2
}),
});
图表上的“绘制”功能（数据）{
如果（data.type==='point'）{
var circle=new charlist.Svg（'circle'{
cx:[data.x]，
cy:[data.y]，
r:[7]，
}“ct圆”）；
数据元素替换（圆圈）；
}
});

.ct图表.ct-series.ct-series-a.ct区域{填充：橙色；}
.ct图表.ct-series.ct-series-a.ct线{笔划：橙色；笔划宽度：3px；}
.ct圆{填充：橙色；笔划宽度：5；笔划：#203135；}
正文{背景：#203135；}
即使需要复制线条，这是否适合您？@web tiki我确实想到了这一点，图表可能有多个数据集（彩色线条），因此我只需要为每个数据集的数据提供两次，不是吗？这会对加载时间等产生任何影响吗？还是最小？在您的情况下（假设您不需要显示大量行），我认为加载时间不会受到显著影响。关键是它不是“干净”的。享受吧。做得很好，谢谢你的链接。Chart JS在这方面做得很好，非常完美。非常感谢你！有什么全球性的方法可以做到这一点吗？看起来非常奇怪，他们一开始没有使用
circle
，因为它的代码更少，而且更容易定制..我最后只是在
point=seriesElement…
@vsync更改了源代码你有JSFIDLE的链接或任何东西要显示吗？@我有jsbin，有我自己的实现，
<div class="ct-chart ct-perfect-fourth"></div>

.ct-chart .ct-series.ct-series-a .ct-area { fill: orange; }
.ct-chart .ct-series.ct-series-a .ct-line { stroke: orange; }
.ct-chart .ct-series.ct-series-a .ct-point { stroke: orange; }

body { background: #203135; }