在具有垂直滚动条的浏览器窗口中绘制画布时出现问题。
这些图形位于正确的位置,并且可以在画布周围抓住它并建立连接,但这只有在(浏览器窗口的)垂直滚动条完全向上时才有可能。
当窗口向下滚动时,节点不能再被拖动,即使光标悬停在节点上时也不会改变。我发现向下滚动时可以拖动节点。不知何故,节点的“抓取区域”并没有改变它的位置,就好像这个区域根据浏览器窗口有一个固定的位置。
我做错了什么?
obs.: 不能发布图片 :(,我没有足够的声誉。
提前致谢!
在具有垂直滚动条的浏览器窗口中绘制画布时出现问题。
这些图形位于正确的位置,并且可以在画布周围抓住它并建立连接,但这只有在(浏览器窗口的)垂直滚动条完全向上时才有可能。
当窗口向下滚动时,节点不能再被拖动,即使光标悬停在节点上时也不会改变。我发现向下滚动时可以拖动节点。不知何故,节点的“抓取区域”并没有改变它的位置,就好像这个区域根据浏览器窗口有一个固定的位置。
我做错了什么?
obs.: 不能发布图片 :(,我没有足够的声誉。
提前致谢!
您基本上需要修改该代码以偏移页面滚动位置
canvas.fromDocumentToCanvasCoordinate = $.proxy(function(x, y) {
return new draw2d.geo.Point(
(x + window.pageXOffset - this.getAbsoluteX() + this.getScrollLeft())*this.zoomFactor,
(y + window.pageYOffset - this.getAbsoluteY() + this.getScrollTop())*this.zoomFactor);
},canvas);
canvas.fromCanvasToDocumentCoordinate = $.proxy(function(x,y) {
return new draw2d.geo.Point(
((x*(1/this.zoomFactor)) + this.getAbsoluteX() - this.getScrollLeft() - window.pageXOffset),
((y*(1/this.zoomFactor)) + this.getAbsoluteY() - this.getScrollTop() - window.pageYOffset));
},canvas);
我在 Draw2d 的 google 小组中发布了相同的问题,并从框架开发人员 Andreas Herz 那里收到了以下答案。
“你好
这是库中的小设计缺陷。
通常可以“自动检测” div/canvas 的滚动位置。但我目前没有。
解决方案:
要么:使用方法 Canvas#setScrollArea(DOMNode node) 在 draw2d.Canvas 中设置滚动容器
或者:如果第一个解决方案不起作用,您自己计算
var canvas = new draw2d.Canvas("domId");
canvas.fromDocumentToCanvasCoordinate = $.proxy(function(x, y) {
return new draw2d.geo.Point(
(x - this.getAbsoluteX() + this.getScrollLeft())*this.zoomFactor,
(y - this.getAbsoluteY() + this.getScrollTop())*this.zoomFactor);
},canvas);
/**
* @method
* Transforms a canvas coordinate to document coordinate.
*
* @param {Number} x the x coordinate in the canvas
* @param {Number} y the y coordinate in the canvas
*
* @returns {draw2d.geo.Point} the coordinate in relation to the document [0,0] position
*/
canvas.fromCanvasToDocumentCoordinate = $.proxy(function(x,y) {
return new draw2d.geo.Point(
((x*(1/this.zoomFactor)) + this.getAbsoluteX() - this.getScrollLeft()),
((y*(1/this.zoomFactor)) + this.getAbsoluteY() - this.getScrollTop()));
},canvas);"