canvas setDimension() breaks функция перетаскивания на рисунке

Question

Я использую draw2dtouch6.1.66 version (последняя версия). Первоначально ширина и высота холста были 1000px и 800px соответственно. При нажатии кнопки я меняю ширину и высоту холста на 2170px и 902px соответственно.

Теперь я не могу перетащить фигуру прямоугольника за пределы 1000px по ширине. Он застревает до 1000px, который был начальной ширины.

Примечание: я проверяю свой html, оба холста div и svg показывают width:2170px и height:902px.

<div _ngcontent-awi-17="" draw2d-canvas="" id="canvas" style="height: 902px; cursor: default; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); width: 2170px;"> 

<svg height="902" version="1.1" width="2170" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="overflow: hidden; position: absolute; left: -0.828125px;"> 

Вот мой код:

$("#canvas").css("height",902); 
$("#canvas").css("width", 2170); 
canvas.setDimension(new draw2d.geo.Rectangle(0, 0, 2170, 902)); 

Answer 1

Установка width и height холста с помощью CSS, приведет к шкале, как эффект, так как основной imageData массив не обновляется с новыми размерами.

Так что, если вам нужно масштабировать холст, использовать атрибуты холста, например, так:

$('#canvas').attr({width: <width>, height: <height>}); 

Имейте в виду, что изменение этих значений будет очистить холст и вам нужно перерисовывать все.