v17 vue3 浮动对象x y计算规则

收藏

本帖最后由 Clark.Pan 于 2024-11-11 16:17 编辑

当我拖动浮动对象的时候， fo.x() 的值，是根据这个浮动对象的最左边计算么？

我的需求是，我在配置的时候，使用document.getElementById('vp')，获取 vp 这个div的 offsetWidth（实际宽度）
然后 fo.x() ➗ offsetWidth 得到一个比例。

然后在大屏页面展示时，根据实际页面宽度✖️比例再去设fo.x()，但是现在会有偏差，怎么解决？

eyAndrew · eyAndrew

如图所示，我再配置的时候位置正好在里面，实际计算展示时，有偏差

Clark.Pan · Clark.Pan

fo.x() 看上去是一个内部接口，SpreadJS的内部接口设置的目的不是提供给用户使用的，能告诉我们使用内部接口的目的是什么吗？

eyAndrew · eyAndrew

默认生成浮动对象使用开始行结束行开始列结束列，这是没问题的，但是实际需求中，我有些浮动元素不要跟着单元格位置走，要固定宽高，然后设置x y边距，比如某个浮动元素位置要在单元格中间开始。

customFloatingObject.width()
customFloatingObject.height()
customFloatingObject.x()
customFloatingObject.y()
新版这是内部接口了么？怎么实现我的需求。

Clark.Pan · Clark.Pan

参考一下附件demo，附件demo中的浮动元素设置起始于单元格C2的中点位置

eyAndrew · eyAndrew

这没在中间呀，我的需求不止设置中间，因为浮动元素是可挪动位置的，我需要记录挪动的位置相对于当前视口的位置信息，然后在不同尺寸的大屏，根据设计时记录的位置比例，重新设置这个浮动元素信息。

Clark.Pan · Clark.Pan

一看就是css没有引入吧

eyAndrew · eyAndrew

Clark.Pan 发表于 2024-11-12 10:42
一看就是css没有引入吧

你给的demo，css给个相对路径，就不会引入呀，我引入本地css会正常，但是我的需求不止设置中间，因为浮动元素是用户自由挪动位置的，我怎么记录挪动后的位置相对于当前视口的位置信息，然后在不同尺寸的大屏，根据设计时记录的位置比例，重新设置这个浮动元素信息。

你的意思我只需要记录startRowOffset startColumnOffset的偏移量么？

Clark.Pan · Clark.Pan

是的，因为列宽和行高是固定的px像素，不会随着分辨率的改变放大或缩小，如果分辨率变大，屏幕一屏显示的格子变多，分辨率变小反之，然而单元格行高和列宽的大小是固定像素不变的。
demo中startRowOffset startColumnOffset设置的偏移量是根据单元格行高列宽得来的，所以也是固定的，没必要重新设置。

eyAndrew · eyAndrew

Clark.Pan 发表于 2024-11-12 11:26
是的，因为列宽和行高是固定的px像素，不会随着分辨率的改变放大或缩小，如果分辨率变大，屏幕一屏显示的格 ...

问题是我的行高列宽是不固定的，我部分列宽行高会设置为*让它自适应宽高，有的会固定行高列宽，这个时候怎么处理？

		自动登录	找回密码
密码			立即注册

[处理中] v17 vue3 浮动对象x y计算规则

14 个回复

讲师达人

悬赏达人

微信认证勋章

SpreadJS 认证

SpreadJS 高级认证

元老葡萄