lufylegend库 LGraphics

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>lufylegend</title>
    <script type="text/javascript" src="lufylegend-1.7.6.js"></script>
</head>

<body>
    <div id="mylegend">loading...</div>
    <script type="text/javascript">
    init(50, ‘mylegend‘, 500, 350, main);

    function main() {
        var graphics = new LGraphics();
        addChild(graphics);
        graphics.drawRect(1, ‘#000000‘, [50, 50, 100, 100]);
        graphics.drawRect(1, ‘#000000‘, [170, 50, 100, 100], true, ‘#cccccc‘);
        graphics.drawArc(1, ‘#000000‘, [60, 230, 50, 0, 2 * Math.PI]);
        graphics.drawArc(1, ‘#000000‘, [180, 230, 50, 0, 2 * Math.PI], true, ‘#cccccc‘);
        graphics.drawVertices(1, ‘#000000‘, [
            [50, 20],
            [80, 20],
            [100, 50],
            [80, 80],
            [50, 80],
            [30, 50]
        ]);
        graphics.drawVertices(1, ‘#000000‘, [
            [150, 20],
            [180, 20],
            [200, 50],
            [180, 80],
            [150, 80],
            [130, 50]
        ], true, ‘#cccccc‘);
        graphics.add(function(coodx, coody) {
            LGlobal.canvas.strokeStyle = ‘#000000‘;
            LGlobal.canvas.moveTo(20, 20);
            LGlobal.canvas.lineTo(200, 200);
            LGlobal.canvas.stroke();
        });

    }
    </script>
</body>

</html>

时间： 2024-10-07 11:25:15

lufylegend库 LGraphics的相关文章

lufylegend库 LGraphics绘制图片

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript" src="lufylegend-1.7.6.js"></script> </head&g

这几天对于网页前端有点兴趣,学习了一下Canvas的相关知识. 看到Lufylegend库之后,感觉很棒,有一种在写AS的感觉.今天入门第一站,写了一个画板. 是一个非常简易的画板,但是可以看到一些重要的思想. 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Mouse Event</title&g

lufylegend库 LTextField

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript" src="lufylegend-1.7.6.js"></script> </head&g

lufylegend库 LBitmapData LBitmap LSprite

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript" src="lufylegend-1.7.6.js"></script> </head&g

lufylegend库鼠标事件循环事件键盘事件

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript" src="lufylegend-1.7.6.js"></script> </head&g

lufylegend库 LButton

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript" src="lufylegend-1.7.6.js"></script> </head&g

HTML5 Canvas游戏开发（四）lufylegend开源库件(下)

一.文本 LTextField对象是lufylegend库件中专门用于显示文本信息的一个对象. 1.文本属性创建的文本框对象不会自动加入可视化对象列表中.只有手动调用addChild()方法才能使它显示. var layer = new LSprite(); //初始化LSprite对象 addChild(layer); //将对象添加进canvas画布中 var field = new LTextField(); //创建文本框对象 field.text = "Hello World!&qu

lufylegend:图形变形3

面来看看drawtriangles函数的扩展.利用drawtriangles函数来实现一个旋转的3D地球,效果如下因为lufylegend1.5.0版的drawtriangles函数有个bug,所以我悄悄的更新了lufylegend1.5.1版,大家可以到官网下载,地址如下 http://lufylegend.com/lufylegend 其实绘制3d球体效果的话,首先就是绘制一个平面,然后将这个平面分成一个一个的小三角形,然后再用这些小三角形拼凑成一个圆球就可以了现在,我先创建一个空白的L

lufy-legend学习笔记之帧速率

最近发现一个HTML开源游戏引擎,感觉还不错http://lufylegend.com/ 但是没有基础的同学,看起来费劲,所以打算边学边记笔记,说明都在注释中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>帧速率</title> <script src="js/lufylegend-1.9.7.js"><