toDataURL() возвращает пустое изображение, если Konva не отображается

У меня есть приложение, в котором Konva изначально скрыта (это вторая "вкладка" вкладки на странице).

Когда пользователь нажимает кнопку "Сохранить" на этой странице, я пытаюсь позвонить Stage.toDataURL()чтобы получить контент в Konva. Однако, если вторая вкладка никогда не отображается, всегда возвращается пустое изображение.

  • Я пробовал позвонить Stage.draw() перед Stage.toDataURL(), но это не помогло.
  • Я пробовал кешировать Stage перед вызовом Stage.toDataURL()также. Не повезло.
  • У меня нет изображений на холсте, поэтому ждать загрузки изображений не проблема.
  • После отображения 2-й вкладки, даже если пользователь затем переключается обратно на 1-ю вкладку и повторно скрывает Konva, тогда она работает нормально.

Это известное ограничение Konva? Что он не будет отображаться, если его не будет видно?

РЕДАКТИРОВАТЬ: Решено

Некоторый код пытался центрировать и масштабировать Konva в своем контейнере при загрузке страницы. Поскольку контейнер еще не был виден, его ширина и высота были равны 0. Это заставило код установить ширину и высоту Konva Stage на отрицательные числа. Как только я это предотвратил, он смог нормально экспортировать изображение, даже если оно было скрыто.

Источник

1 ответ

Это решено. Некоторый код пытался центрировать и масштабировать Konva в своем контейнере при загрузке страницы. Поскольку контейнер еще не был виден, его ширина и высота были равны 0. Это заставило код установить ширину и высоту Konva Stage на отрицательные числа. Как только я это предотвратил, он смог нормально экспортировать изображение, даже если оно было скрыто.

Источник
Другие вопросы по тегам