纸张js显示停止问题

时间:2016-08-11 16:06:57

标签: html5-canvas paperjs

我使用paper.js和canvas来制作web api,但是当打开网页时,除非我在画布上移动鼠标,否则什么都没有。我不知道为什么。 代码如下,实际上当我尝试绘制一个盒子时,它也是这样的。

<script language="javascript" type="text/javascript" canvas="canvas">
paper.install(window);

window.onload=function(){
    var scope2 = new PaperScope();
    paper = scope2.setup('controlpanel');

    // var L_controlpanel = new Layer();
    var bgshadoW = new Shape.Rectangle({
        point:[10,10],
        size:[200,360],
        fillColor:'#f2f2f2',
        shadowColor:'black',
        shadowBlur: 12,
        shadowOffset: [5, 5]
    });

    var colorfunC ;
    var G_colorfunC = new Group();
    var colorcontenT = ['#ffff66','#77ff33','#66b3ff','#f0aad9','#ffd486']
    for (var i, i=0;i<5;i++){
        colorfunC = new Path.Rectangle({
            point:[20,20+30*i],
            size:[15,15],
            radius:5,
            strokeColor: 'black',
            strokeWidth: 1,
            fillColor:'#f2f2f2',
            data:{'click':0,'color':colorcontenT[i]}        
        });
        G_colorfunC.addChild(colorfunC);
        colorfunC.onClick = function(event){
                G_colorfunC.fillColor='#f2f2f2';
                this.fillColor=' #4dc3ff';
                fillcolorshoT = this.data['color'];
        }   
        fixdemO = new Path.Rectangle({
            point:[60,20+30*i],
            size:[50,15],
            fillColor:colorcontenT[i]
         });

    }
    var G_denVfunC = new Group();
    var denVcontenT = [120,150,200,250,300]
    for (var i, i=0;i<5;i++){
        denVfunC = new Path.Rectangle({
            point:[20,200+30*i],
            size:[15,15],
            radius:5,
            strokeColor: 'black',
            strokeWidth: 1,
            fillColor:'#f2f2f2',
            data:{'click':0,'denV':denVcontenT[i]}      
        });
        G_denVfunC.addChild(denVfunC);
        denVfunC.onClick = function(event){
                G_denVfunC.fillColor='#f2f2f2';
                this.fillColor='#4dffa6';
                denV = this.data['denV'];
        }   
        FixText = new PointText({
            point:[60,212+30*i],
            fontSize:14,
            fillColor: 'black',
            content:'DOMA density: '+denVcontenT[i]
         });

    }


}


</script>

1 个答案:

答案 0 :(得分:0)

找到原因,只需添加

paper.view.update();