ant-design-charts icon indicating copy to clipboard operation
ant-design-charts copied to clipboard

👑 [需求]组织架构图缩放及恢复问题

Open hhbusui opened this issue 2 years ago • 3 comments

🥰 需求描述 [详细地描述需求,让大家都能理解]

在组织架构图中,我有一个下拉框【存放的值: 200%/150%/100%/75%/50%】

我想在用户选择200%时画面放大到原图的2倍,100%时画面恢复至原始大小,50%时缩小1倍。

我通过api: zoom去实现,但最后的显示效果,并没有如预想的设置为1时,画面始终为原始大小 。

  1. 请问有什么方式可以这种效果么?
  2. 官方的api说明只找到这个,是否有更详细的说明或者demo呢? image

🧐 解决方案 [如果你有解决方案,在这里清晰地阐述]

        const [chartPlot, setChartPlot] = useState(null);
	const canvasZoomValue = useSelector(state => state.homeResData.canvasZoomValue);
	useEffect(() => {
		if (!chartPlot) return;
		// console.log(chartPlot);
		if (canvasZoomValue < 1) {
			chartPlot.zoom(-0.2);
		} else {
			chartPlot.zoom(0.2);
		}
	}, [canvasZoomValue]);

🚑 其他信息 [如截图等其他信息可以贴在这里]

image

image

hhbusui avatar Sep 19 '22 08:09 hhbusui

在组织架构图渲染的时候位置会错乱,请问这个问题解决可以从何处入手呢?

image

hhbusui avatar Sep 19 '22 08:09 hhbusui

我在官网测试了,是可以缩放的,提供一下复现。

const graph = React.useRef(null); onReady= {(g)=>{ graph.current = g; }} graph.current.zoom(0.5);

lxfu1 avatar Sep 19 '22 08:09 lxfu1

我在官网测试了,是可以缩放的,提供一下复现。

const graph = React.useRef(null); onReady= {(g)=>{ graph.current = g; }} graph.current.zoom(0.5);

感谢您的回复。 是的,通过这种方式是可以缩放的。 请问对于zoom的值有详细的描述么?我这边使用graph.current.zoom(0.5); 代码,我的画布一直在变小。可以实现放大 和重置(恢复到初始大小)的功能么? @lxfu1

hhbusui avatar Sep 19 '22 09:09 hhbusui

今天升级到最新到最新版本后,不存在此问题了。 image

hhbusui avatar Oct 17 '22 07:10 hhbusui