我想了解为什么我的SVG定位 outside SVG容器元素而不是默认位于x：0 / y0坐标？
CSS: 最小（如果没有CSS，只删除文档正文中的边距/填充）
Javascript:
var svg = d3.select('div#map').append('svg:svg');
svg.append('svg:g')
.append('svg:text')
.text('Hello word')
//.attr('x', 0)
//.attr('y', 0)
.attr('fill', 'red');
HTML:
<div class="map" id="map"></div>
文本元素在那里，填充红色和可见但在屏幕的左上角溢出 . 为什么SVG元素默认位于顶部/左侧0px 0px？
1 回答
文本元素的原点是文本基线的左手边缘，用于从左到右文本 .
基线是大多数字符的底部点，有些像g，y，p等下降到它下面 . Hello world没有下降器的字符，所以你根本看不到它 .
有CSS properties可以改变这一点，如对齐基线和显性基线 . 请注意，并非所有UA都支持所有属性 .