可调整大小的2楼平面图，拖动图像上的标尺

Question

我正在寻找具有以下功能的交互式二维平面图

这意味着用户可以同时拖动和调整楼层地图的大小。 只有我找到的相对链接是

编辑：到目前为止，我已经能够创建基于svg的图并应用锚点 拖动图像

我的小提琴

https://jsfiddle.net/sbh24vuq/

 $(function() {

          addBackdrop(50);

          var $window = $(window);
          var radius = 40, editColor = 'rgb(79, 128, 255)';
          var type = /(canvas|webgl)/.test(url.type) ? url.type : 'svg';
          var two = new Two({
              type: Two.Types[type],
              fullscreen: true,
              autostart: true
            }).appendTo(document.body);


         ....
complete code is on fiddle 
        }

但我想在拖动时添加标尺。

Answer 1

从探索现有的开源平面图项目开始：

• https://github.com/topics/floorplan?l=javascript
• https://github.com/topics/floorplans?l=javascript

以下是快速搜索显示的内容：

• react-planner
• Floor Plan V4
• homeRoughEditor

之后，您要转到演示页面来检查其功能：

• react-planner demo
• homeRoughEditor demo

接下来，您将深入研究代码并尝试理解其实现方式。