更改ngx图表中水平条形图的默认样式
更改ngx图表中水平条形图的默认样式
提问于 2020-02-23 23:00:46
我正在使用ngx-图表 [链接至Github ]来绘制角度图.我用的是8.x版的角形。这个包非常容易使用，并且具有很好的特性。但是，我似乎不能改变水平条形图中水平条形图的默认样式。在这里，我是附加的堆栈闪电战演示，我已经尝试过。我想要红色边框在所有的水平条底部，我也想要Y轴数据标签以上的条形。
问题是生成的条形图是svg格式的。所以有点棘手。
回答 3
Stack Overflow用户
回答已采纳
发布于 2020-02-24 21:55:19
我不确定这是否对你有帮助，但在我看来，这是实现你目标的方法之一。
有一个用于笔画的stroke-dasharray SVG属性。
对于border-bottom，我找到了下面描述的解决方案：
::ng-deep .ngx-charts .bar {
stroke: red;
stroke-dasharray: 0,X,Y,0;
}其中Y是条形条宽度的值，而X是条形条的高度和宽度的和的值。
我分享一个SVG笔画属性的演示-这不是一个ngx图表演示，但在我看来，如果你能得到你的图表元素的高度和宽度，它将帮助你。
Stack Overflow用户
发布于 2020-02-24 04:40:21
Stack Overflow用户
发布于 2020-02-23 23:09:20
没有为此目的提供的句柄，但是您可以像这样调整svg以获得所需的更改：
let svgList = <HTMLScriptElement[]><any>document.getElementById(your_parent_Div_id).getElementsByTagName('path');
for (let svg of svgList) {
event.target.style.stroke = 'black';
event.target.style.strokeWidth = '4';
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60370916
复制相关文章
点击加载更多
相似问题
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
