forked from pixijs/pixijs
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
132 lines (113 loc) · 6.52 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!DOCTYPE HTML>
<html>
<head>
<!--<link href=<script src="http://fonts.googleapis.com/css?family=Snippet|Arvo:700italic|Podkova<script src=" rel=<script src="stylesheet<script src=" type=<script src="text/css<script src=">-->
<title>pixi.js example 10 Text</title>
<style>
body {
margin: 0;
padding: 0;
background-color: #000000;
}
</style>
<script src="../../src/pixi/Pixi.js"></script>
<script src="../../src/pixi/core/Point.js"></script>
<script src="../../src/pixi/core/Rectangle.js"></script>
<script src="../../src/pixi/core/Polygon.js"></script>
<script src="../../src/pixi/core/Circle.js"></script>
<script src="../../src/pixi/core/Ellipse.js"></script>
<script src="../../src/pixi/core/Matrix.js"></script>
<script src="../../src/pixi/display/DisplayObject.js"></script>
<script src="../../src/pixi/display/DisplayObjectContainer.js"></script>
<script src="../../src/pixi/display/Sprite.js"></script>
<script src="../../src/pixi/display/SpriteBatch.js"></script>
<script src="../../src/pixi/display/MovieClip.js"></script>
<script src="../../src/pixi/filters/FilterBlock.js"></script>
<script src="../../src/pixi/text/Text.js"></script>
<script src="../../src/pixi/text/BitmapText.js"></script>
<script src="../../src/pixi/InteractionData.js"></script>
<script src="../../src/pixi/InteractionManager.js"></script>
<script src="../../src/pixi/display/Stage.js"></script>
<script src="../../src/pixi/utils/Utils.js"></script>
<script src="../../src/pixi/utils/EventTarget.js"></script>
<script src="../../src/pixi/utils/Detector.js"></script>
<script src="../../src/pixi/utils/Polyk.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLShaderUtils.js"></script>
<script src="../../src/pixi/renderers/webgl/shaders/PixiShader.js"></script>
<script src="../../src/pixi/renderers/webgl/shaders/PixiFastShader.js"></script>
<script src="../../src/pixi/renderers/webgl/shaders/StripShader.js"></script>
<script src="../../src/pixi/renderers/webgl/shaders/PrimitiveShader.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLGraphics.js"></script>
<script src="../../src/pixi/renderers/webgl/WebGLRenderer.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLMaskManager.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLShaderManager.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/WebGLFilterManager.js"></script>
<script src="../../src/pixi/renderers/webgl/utils/FilterTexture.js"></script>
<script src="../../src/pixi/renderers/canvas/utils/CanvasMaskManager.js"></script>
<script src="../../src/pixi/renderers/canvas/utils/CanvasTinter.js"></script>
<script src="../../src/pixi/renderers/canvas/CanvasRenderer.js"></script>
<script src="../../src/pixi/renderers/canvas/CanvasGraphics.js"></script>
<script src="../../src/pixi/primitives/Graphics.js"></script>
<script src="../../src/pixi/extras/Strip.js"></script>
<script src="../../src/pixi/extras/Rope.js"></script>
<script src="../../src/pixi/extras/TilingSprite.js"></script>
<script src="../../src/pixi/extras/Spine.js"></script>
<script src="../../src/pixi/textures/BaseTexture.js"></script>
<script src="../../src/pixi/textures/Texture.js"></script>
<script src="../../src/pixi/textures/RenderTexture.js"></script>
<script src="../../src/pixi/loaders/AssetLoader.js"></script>
<script src="../../src/pixi/loaders/JsonLoader.js"></script>
<script src="../../src/pixi/loaders/AtlasLoader.js"></script>
<script src="../../src/pixi/loaders/SpriteSheetLoader.js"></script>
<script src="../../src/pixi/loaders/ImageLoader.js"></script>
<script src="../../src/pixi/loaders/BitmapFontLoader.js"></script>
<script src="../../src/pixi/loaders/SpineLoader.js"></script>
<script src="../../src/pixi/filters/AbstractFilter.js"></script>
<script src="../../src/pixi/filters/AlphaMaskFilter.js"></script>
<script src="../../src/pixi/filters/ColorMatrixFilter.js"></script>
<script src="../../src/pixi/filters/GrayFilter.js"></script>
<script src="../../src/pixi/filters/DisplacementFilter.js"></script>
<script src="../../src/pixi/filters/PixelateFilter.js"></script>
<script src="../../src/pixi/filters/BlurXFilter.js"></script>
<script src="../../src/pixi/filters/BlurYFilter.js"></script>
<script src="../../src/pixi/filters/BlurFilter.js"></script>
<script src="../../src/pixi/filters/InvertFilter.js"></script>
<script src="../../src/pixi/filters/SepiaFilter.js"></script>
<script src="../../src/pixi/filters/TwistFilter.js"></script>
<script src="../../src/pixi/filters/ColorStepFilter.js"></script>
<script src="../../src/pixi/filters/DotScreenFilter.js"></script>
<script src="../../src/pixi/filters/CrossHatchFilter.js"></script>
<script src="../../src/pixi/filters/RGBSplitFilter.js"></script>
</head>
<body>
<script>
// create an new instance of a pixi stage
var stage = new PIXI.Stage(0x66FF99);
// create a renderer instance
var renderer = PIXI.autoDetectRenderer(400, 300);
// add the renderer view element to the DOM
document.body.appendChild(renderer.view);
requestAnimFrame(animate);
// create a texture from an image path
var texture = PIXI.Texture.fromImage("bunny.png");
// create a new Sprite using the texture
var bunny = new PIXI.Sprite(texture);
// center the sprites anchor point
bunny.anchor.x = 0.5;
bunny.anchor.y = 0.5;
// move the sprite t the center of the screen
bunny.position.x = 200;
bunny.position.y = 150;
stage.addChild(bunny);
function animate() {
requestAnimFrame(animate);
// just for fun, let's rotate mr rabbit a little
bunny.rotation += 0.1;
// render the stage
renderer.render(stage);
}
</script>
</body>
</html>