The issue has been closed
坐标系的范围,用上图描述应该是哪一个部分呢?在下图创建坐标系实例的时候,忽略了中间内边距的部分,却把呼吸区域和外边距区域的范围算了进去,没有理解为什么要这样计算
或者说:
这张图里面的计算逻辑是对的吗?因为很明显可以看出,加了 padding 以后,“坐标系的范围” 和标记绘制区域完全错开了
Originally posted by @BinghuiXie in https://github.com/antvis/G2/discussions/5399

这里看上去确实有点问题,应该不需要加 margin,我排查一下。
posted by pearmini over 1 year ago
坐标系的范围就应该是下图红色区域:
<img src="https://github.com/antvis/G2/assets/49330279/c8369242-2609-4bec-b323-23e917db193c" width=640 />
正确创建坐标系应该如下:
const options = {
...layout,
x: insetLeft,
y: insetTop,
width: innerWidth - insetLeft - insetRight,
height: innerHeight - insetBottom - insetTop,
transformations: transform.flatMap(useCoordinate),
};
x 和 y 没有考虑 margin 和 padding 的原因是:在绘制的时候会对 group 进行偏移:
function updateBBox(selection) {
selection
.style('x', (d) => d.paddingLeft + d.marginLeft)
.style('y', (d) => d.paddingTop + d.marginTop)
.style('width', (d) => d.innerWidth)
.style('height', (d) => d.innerHeight);
}
posted by pearmini over 1 year ago