在小画布上看到更大画布的一部分

时间:2016-09-21 10:53:45

标签: javascript canvas html5-canvas fabricjs

我有一块1377x740px的大画布,以及其他尺寸为200x200的画布。 最后一个画布用于预览模式,在下拉列表中选择对象。当我选择对象的名称时,对象需要以相同的比例出现在小画布中。

我的问题是,我该怎么做?

我有一个代码,但是这个代码使对象适合小画布的宽度和高度,

date_threshold

这不起作用, 我想要这样的东西:这个fit-object-css

像盒子一样#34;包含"图像。

1 个答案:

答案 0 :(得分:2)

点了这段代码:

var BR = obj.getBoundingRect();
        if(BR.width>canvas2.width){
            while(BR.width+50>canvas2.width){
                canvas2.zoomToPoint(new fabric.Point(canvas2.getCenter().top, canvas2.getCenter().left), canvas2.getZoom()/1.2);
                BR=obj.getBoundingRect();
            }
        }
        if(BR.width+3<canvas2.width){
            while(BR.width+50<canvas2.width){
                canvas2.zoomToPoint(new fabric.Point(canvas2.getCenter().top, canvas2.getCenter().left), canvas2.getZoom()*1.2);
                BR=obj.getBoundingRect();
            }
        }
        if(BR.height>canvas2.height){
            while(BR.height>canvas2.height){
                canvas2.zoomToPoint(new fabric.Point(canvas2.getCenter().top, canvas2.getCenter().left), canvas2.getZoom()/1.2);
                BR=obj.getBoundingRect();
            }
        }