FabricJS: как создать эффект линзы увеличительного стекла, который отображает как фоновое изображение, так и объекты холста в линзе.

Я пытаюсь реализовать функцию масштабирования, которая не только увеличивает фоновое изображение, но и отображает объекты FabricJS (треугольник и круг), присутствующие на холсте.

В настоящее время я достиг того, что увеличенное изображение отображается правильно, но я также хочу отображать объекты, присутствующие на холсте, для отображения в объективе и иметь возможность щелкать по ним.

Я понимаю, что фон только клонируется через,
fabric.util.object.clone а затем передается в «объектив», откуда он затем отправляется в «clipTo» и отображается в виде увеличительного стекла.

Но как клонировать все объекты и передать их в объектив? не только фоновое изображение.

Я прикрепил здесь скрипку моего прогресса: https://jsfiddle.net/7m3otzq0/9/

Желаемый эффект состоит в том, чтобы иметь что-то похожее на то, как работает библиотека AnythingZoomer2. Я бы предпочел использовать исключительно FabricJs, поскольку это потрясающая библиотека
https://css-tricks.com/examples/AnythingZoomer/index.php#?id=568.

Решение проблемы

У меня сейчас точно такая же проблема....

Кто-нибудь уже знает решение для этого?