如何使用d3.js在SVG图表上居中显示标题

How to center title over SVG chart with d3.js?

本文关键字：显示标题 d3 何使用 js SVG 更新时间：2023-09-26

演示：http://jsfiddle.net/29j6ozqn/

我创建了一个带有两个轴的简单SVG，并添加了一个text元素作为图表的标题。但我找不到一种可靠的方法来将标题集中在图表的中点上。我希望文本元素的中间在x轴上的"0.5"刻度上对齐。对我来说，从视觉上看，这是图表的中间部分。

我想要一个通用的解决方案，这意味着无论文本字符串有多长，中间总是超过"0.5"。x轴是什么类型的轴（无论是线性的、有序的等）也不重要

使用text-anchor: middle或text-align: center而不是text-anchor: start:Fiddle。