WebGL References Kageyama (Kobe Univ.) Visualization *4 2 / 54

Size: px
Start display at page:

Download "WebGL References Kageyama (Kobe Univ.) Visualization 2013.05.07 *4 2 / 54"

Transcription

1 WebGL * *2 *1 X LR301 *2 05/08: Kageyama (Kobe Univ.) Visualization *3 1 / 54

2 WebGL References Kageyama (Kobe Univ.) Visualization *4 2 / 54

3 Chrome Firefox ID Kageyama (Kobe Univ.) Visualization *5 3 / 54

4 Kageyama (Kobe Univ.) Visualization *6 4 / 54

5 Web アプリ HTML + CSS + JavaScript + シェーダソースコード + オブジェクトデータ WebGL JavaScript API 頂 点 シェーダ プリミティブ 組 み 立 て ラスタ 化 フラグメントシェーダ Kageyama (Kobe Univ.) Visualization *7 5 / 54

6 n n Kageyama (Kobe Univ.) Visualization *8 6 / 54

7 頂 点 シェーダ 用 ソースコード (GLSL) 頂 点 attribute 変 数 ( 座 標 色 など) 頂 点 シェーダ 組 み 込 み 変 数 gl_position gl_frontfacing g_lpointsize ユーザ 定 義 uniform 変 数 ( 変 換 行 列 光 源 位 置 ) ユーザ 定 義 の varying 変 数 Kageyama (Kobe Univ.) Visualization *9 7 / 54

8 C OpenGL SL (Shading Language) 4 4 a t t r i b u t e vec3 avertexpos ; a t r r i b u t e vec4 a V e r t e x C o l o r ; u n i f o r m mat4 umvmatrix ; u n i f o r m mat4 upmatrix ; v a r y i n g vec4 v C o l o r ; void main ( ) { g l P o s i t i o n = upmatrix umvmatrix vec4 ( avertexpos, 1. 0 ) ; v C o l o r = a V e r t e x C o l o r ; } Kageyama (Kobe Univ.) Visualization *10 8 / 54

9 a t t r i b u t e vec3 avertexpos ; a t r r i b u t e vec4 a V e r t e x C o l o r ; attribute RGBA 4 Kageyama (Kobe Univ.) Visualization *11 9 / 54

10 u n i f o r m mat4 umvmatrix ; u n i f o r m mat4 upmatrix ; mat4 4 4 uniform Kageyama (Kobe Univ.) Visualization *12 10 / 54

11 v a r y i n g vec4 v C o l o r ; varing (varying variable) varying gl Position gl FrontFacing gl PointSize Kageyama (Kobe Univ.) Visualization *13 11 / 54

12 void main ( ) { g l P o s i t i o n = upmatrix umvmatrix vec4 ( avertexpos, 1. 0 ) ; v C o l o r = a V e r t e x C o l o r ; main varying gl Position varying vcolor Kageyama (Kobe Univ.) Visualization *14 12 / 54

13 primitive assembly 3 *15 *15 OpenGL 1.x 3 Kageyama (Kobe Univ.) Visualization *16 13 / 54

14 プリミティブ フラグメント Kageyama (Kobe Univ.) Visualization *17 14 / 54

15 varying varying varying varyingvalue_1 varyingvalue_2 varyingvalue_3 Kageyama (Kobe Univ.) Visualization *18 15 / 54

16 フラグメントシェーダ 用 ソースコード (GLSL) 組 み 込 み 変 数 gl_position gl_frontfacing g_lpointsize フラグメント シェーダ 組 み 込 み 変 数 gl_fragcolor ユーザ 定 義 varying 変 数 ユニフォーム 変 数 テクスチャ 用 サンプラ Kageyama (Kobe Univ.) Visualization *19 16 / 54

17 p r e c i s i o n mediump f l o a t ; // p r e c i s i o n q u a l i f i e r v a r y i n g vec4 v C o l o r ; // void main ( ) { g l F r a g C o l o r = v C o l o r ; } Kageyama (Kobe Univ.) Visualization *20 17 / 54

18 WebGL Web アプリ HTML + CSS + JavaScript + シェーダソースコード + オブジェクトデータ WebGL JavaScript API 頂 点 シェーダ プリミティブ 組 み 立 て ラスタ 化 フラグメントシェーダ シザーテスト マルチサンプリング ステンシルテスト デプステスト アルファブレンディング ディザリング WebGL 用 描 画 バッファ cavasの 他 の 画 像 スクリーン Kageyama (Kobe Univ.) Visualization *21 18 / 54

19 scissors *22 OpenGL Super Bible (Richard S. Wright et al., 2011, p.112) シザーテスト 不 合 格 シザーテスト 合 格 *22 Kageyama (Kobe Univ.) Visualization *23 19 / 54

20 OpenGL Super Bible (Richard S. Wright et al., 2011, p.382) Kageyama (Kobe Univ.) Visualization *24 20 / 54

21 OpenGL Super Bible (Richard S. Wright et al., 2011, p.399) Kageyama (Kobe Univ.) Visualization *25 21 / 54

22 Kageyama (Kobe Univ.) Visualization *26 22 / 54

23 Kageyama (Kobe Univ.) Visualization *27 23 / 54

24 Kageyama (Kobe Univ.) Visualization *28 24 / 54

25 WebGL WebGL Kageyama (Kobe Univ.) Visualization *29 25 / 54

26 WebGL WebGL webgl sample triangle 00.html Kageyama (Kobe Univ.) Visualization *30 26 / 54

27 WebGL 3 HTML WebGL canvas Kageyama (Kobe Univ.) Visualization *31 27 / 54

28 WebGL webgl sample triangle 00.html <!DOCTYPE HTML> <html lang= en > <head> < t i t l e>webgl Sample T r i a n g l e 00</ t i t l e> <meta c h a r s e t= u t f 8 > <s t y l e type= t e x t / c s s > canvas { b o r d e r : 2 px s o l i d g r e y ; }. t e x t { p o s i t i o n : a b s o l u t e ; top : 40 px ; l e f t : 20 px ; font s i z e : 1. 5em ; Kageyama (Kobe Univ.) Visualization *32 28 / 54

29 WebGL webgl sample triangle 00.html <!DOCTYPE HTML> <html lang= en > <head> < t i t l e>webgl Sample T r i a n g l e 00</ t i t l e> <meta c h a r s e t= u t f 8 > <s t y l e type= t e x t / c s s > canvas { b o r d e r : 2 px s o l i d g r e y ; }. t e x t { p o s i t i o n : a b s o l u t e ; top : 40 px ; l e f t : 20 px ; font s i z e : 1. 5em ; Kageyama (Kobe Univ.) Visualization *33 29 / 54

30 WebGL c o l o r : b l a c k ; } </ s t y l e > < s c r i p t t y p e= t e x t / j a v a s c r i p t > v a r g l ; v a r canvas ; v a r shaderprogram ; v a r v e r t e x B u f f e r ; f u n c t i o n c r e a t e G L C o n t e x t ( canvas ) { v a r names = [ webgl, e x p e r i m e n t a l webgl ] ; v a r c o n t e x t = n u l l ; f o r ( v a r i =0; i <names. l e n g t h ; i ++) { t r y { Kageyama (Kobe Univ.) Visualization *34 30 / 54

31 WebGL } c o n t e x t = canvas. g e t C o n t e x t ( names [ i ] ) ; } catch ( e ) {} i f ( c o n t e x t ) { break ; } } i f ( c o n t e x t ) { c o n t e x t. viewportwidth = canvas. width ; c o n t e x t. v i e w p o r t H e i g h t = canvas. h e i g h t ; } e l s e { a l e r t ( F a i l e d to c r e a t e c o n t e x t. ) ; } r e t u r n c o n t e x t ; Kageyama (Kobe Univ.) Visualization *35 31 / 54

32 WebGL f u n c t i o n l o a d S h a d e r ( type, s h a d e r S o u r c e ) { v a r s h a d e r = g l. c r e a t e S h a d e r ( t y p e ) ; g l. s h a d e r S o u r c e ( shader, s h a d e r S o u r c e ) ; g l. c o m p i l e S h a d e r ( s h a d e r ) ; } i f (! g l. g e t S h a d e r P arameter ( shader, g l. COMPILE STATUS) ) { a l e r t ( E r r o r c o m p i l i n g s h a d e r + g l. g e t S h a d e r I n f o L o g ( s h a d e r ) ) ; g l. d e l e t e S h a d e r ( s h a d e r ) ; r e t u r n n u l l ; } r e t u r n s h a d e r ; f u n c t i o n s e t u p S h a d e r s ( ) { v a r v e r t e x S h a d e r S o u r c e = Kageyama (Kobe Univ.) Visualization *36 32 / 54

33 WebGL v a r f r a g m e n t S h a d e r S o u r c e = p r e c i s i o n mediump f l o a t ; \n + v o i d main ( ) { \n + g l F r a g C o l o r = vec4 ( 0. 2, 0. 4, 0. 6, 1. 0 ) ; \n + } \n ; v a r v e r t e x S h a d e r = l o a d S h a d e r ( g l. VERTEX SHADER, v e r t e x S h a d e r S o u r c e ) ; v a r fragmentshader = l o a d S h a d e r ( g l.fragment SHADER, f r a g m e n t S h a d e r S o u r c e ) ; shaderprogram = g l. createprogram ( ) ; Kageyama (Kobe Univ.) Visualization *37 33 / 54

34 WebGL g l. a t t a c h S h a d e r ( shaderprogram, v e r t e x S h a d e r ) ; g l. a t t a c h S h a d e r ( shaderprogram, fragmentshader ) ; g l. l i n k P r o g r a m ( shaderprogram ) ; i f (! g l. getprogramparameter ( shaderprogram, g l. LINK STATUS) ) { a l e r t ( F a i l e d to s e t u p s h a d e r. ) ; } g l. useprogram ( shaderprogram ) ; } shaderprogram. v e r t e x P o s i t i o n A t t r i b u t e = g l. g e t A t t r i b L o c a t i o n ( shaderprogram, a V e r t e x P o s i t i o n ) ; f u n c t i o n s e t u p B u f f e r s ( ) { Kageyama (Kobe Univ.) Visualization *38 34 / 54

35 WebGL } v e r t e x B u f f e r = g l. c r e a t e B u f f e r ( ) ; g l. b i n d B u f f e r ( g l. ARRAY BUFFER, v e r t e x B u f f e r ) ; v a r t r i a n g l e V e r t i c e s = [ 0. 0, 0. 0, 0. 0, 0. 8, 0. 0, 0. 0, 0. 0, 0. 5, 0. 0 ] ; g l. b u f f e r D a t a ( g l. ARRAY BUFFER, new F l o a t 3 2 A r r a y ( t r i a n g l e V e r t i c e s ), g l. STATIC DRAW) ; v e r t e x B u f f e r. i t e m S i z e = 3 ; v e r t e x B u f f e r. numberofitems = 3 ; f u n c t i o n draw ( ) { g l. v i e w p o r t ( 0, 0, g l. viewportwidth, g l. v i e w p o r t H e i g h t ) ; Kageyama (Kobe Univ.) Visualization *39 35 / 54

36 WebGL g l. c l e a r ( g l. COLOR BUFFER BIT) ; } g l. v e r t e x A t t r i b P o i n t e r ( shaderprogram. v e r t e x P o s i t i o n A t t r i b u t e, v e r t e x B u f f e r. i t e m S i z e, g l. FLOAT, f a l s e, 0, 0) ; g l. e n a b l e V e r t e x A t t r i b A r r a y ( shaderprogram. v e r t e x P o s i t i o n A t t r i b u t e ) ; g l. drawarrays ( g l. TRIANGLES, 0, v e r t e x B u f f e r. numberofitems ) ; f u n c t i o n s t a r t u p ( ) { canvas = document. getelementbyid ( myglcanvas ) ; g l = c r e a t e G L C o n t e x t ( canvas ) ; s e t u p S h a d e r s ( ) ; s e t u p B u f f e r s ( ) ; g l. c l e a r C o l o r ( 0. 8, 0. 8, 0. 4, 1. 0 ) ; draw ( ) ; Kageyama (Kobe Univ.) Visualization *40 36 / 54

37 WebGL } </ s c r i p t > </head> <body o nload= s t a r t u p ( ) ; > <canvas i d= myglcanvas width= 480 h e i g h t= 480 ></canvas> <d i v c l a s s= t e x t >H e l l o. This i s my f i r s t WebGL program.</ div > </body> </html> Kageyama (Kobe Univ.) Visualization *41 37 / 54

38 WebGL HTML5 canvas getcontext method experimental-webgl *42 getcontext method WebGLRenderingContext WebGL WebGLRenderingContext gl *42 webgl Kageyama (Kobe Univ.) Visualization *43 38 / 54

39 WebGL GLSL GPU GPU HTML JavaScript GLSL fragmentshadersource Kageyama (Kobe Univ.) Visualization *44 39 / 54

40 WebGL WebGLRenderingContext Kageyama (Kobe Univ.) Visualization *45 40 / 54

41 WebGL GLSL *47 attribute float, vec2, vec3, vec4, mat2, mat3x2, mat4x2, mat2x3, mat3, mat4x3, mat4, mat2x4, mat3x4 attribute attribute *46 attribute *46 MAX VERTEX ATTRIBS *47 OpenGL 4.0 (Segal et al., 2010, p.60) Kageyama (Kobe Univ.) Visualization *48 41 / 54

42 WebGL int BindAttribLocation(unit program, unit index, const char *name); name attribute index program GL index int GetAttribLocation(unit program, const char *name); attribute (name) Kageyama (Kobe Univ.) Visualization *49 42 / 54

43 WebGL gl.useprogram(shaderprogram); shaderprogram. vertexpositionattribute = gl.getattriblocation(shaderprogram, avertexposition ); vertexpositionattribute shaderprogram. anynameisok = g l. g e t A t t r i b L o c a t i o n ( shaderprogram, a V e r t e x P o s i t i o n ) ; Kageyama (Kobe Univ.) Visualization *50 43 / 54

44 WebGL f u n c t i o n s e t u p B u f f e r s ( ) { v e r t e x B u f f e r = g l. c r e a t e B u f f e r ( ) ; g l. b i n d B u f f e r ( g l. ARRAY BUFFER, v e r t e x B u f f e r ) ; v a r t r i a n g l e V e r t i c e s = [ 0. 0, 0. 0, 0. 0, 0. 8, 0. 0, 0. 0, 0. 0, 0. 5, 0. 0 ] ; g l. b u f f e r D a t a ( g l. ARRAY BUFFER, new F l o a t 3 2 A r r a y ( t r i a n g l e V e r t i c e s ), g l. STATIC DRAW) ; v e r t e x B u f f e r. i t e m S i z e = 3 ; v e r t e x B u f f e r. numberofitems = 3 ; } Kageyama (Kobe Univ.) Visualization *51 44 / 54

45 WebGL WebGLRenderingContext createbuffer() WebGLBuffer JavaScript vertexbuffer vertexbuffer Kageyama (Kobe Univ.) Visualization *52 45 / 54

46 WebGL f u n c t i o n draw ( ) { g l. v i e w p o r t ( 0, 0, g l. viewportwidth, g l. v i e w p o r t H e i g h t ) ; g l. c l e a r ( g l. COLOR BUFFER BIT) ; } g l. v e r t e x A t t r i b P o i n t e r ( shaderprogram. v e r t e x P o s i t i o n A t t r i b u t e, v e r t e x B u f f e r. i t e m S i z e, g l. FLOAT, f a l s e, 0, 0) ; g l. e n a b l e V e r t e x A t t r i b A r r a y ( shaderprogram. v e r t e x P o s i t i o n A t t r i b u t e ) ; g l. drawarrays ( g l. TRIANGLES, 0, v e r t e x B u f f e r. numberofitems ) ; Kageyama (Kobe Univ.) Visualization *53 46 / 54

47 Kageyama (Kobe Univ.) Visualization *54 47 / 54

48 webgl sample triangle 01.html Kageyama (Kobe Univ.) Visualization *55 48 / 54

49 webgl sample triangle 01.html f u n c t i o n s e t u p S h a d e r s ( ) { v a r v e r t e x S h a d e r S o u r c e = a t t r i b u t e vec3 a V e r t e x P o s i t i o n ; \n + v o i d main ( ) { \n + g l P o s i t i o n = vec4 ( a V e r t e x P o s i t i o n, 1. 0 ) ; \n + g l P o s i t i o n = vec4 ( 0. 2, 1. 0, 1. 0, 1. 0 ) ; // Here!! \n + } \n ; Kageyama (Kobe Univ.) Visualization *56 49 / 54

50 Kageyama (Kobe Univ.) Visualization *57 50 / 54

51 Kageyama (Kobe Univ.) Visualization *58 51 / 54

52 webgl sample triangle 00.html 1. PDF 2. HTML gmail kageyama PDF HTML 5/13 Kageyama (Kobe Univ.) Visualization *59 52 / 54

53 MAX VERTEX ATTRIBS, 41 varing, 11, 38, 19, 21, 24, 45, 14, 13, 13, 20, 14, 17 Kageyama (Kobe Univ.) Visualization *60 53 / 54

54 References References Richard S. Wright, J., Haemel, N., Sellers, G., and Lipchak, B. (2011). OpenGL SuperBible: Comprehensive Tutorial and Reference. Pearson Education, Inc, Boston, MA, 5th edition. Segal, M., Akeley, K., and (2010). OpenGL Kageyama (Kobe Univ.) Visualization *61 54 / 54

WebGL X LR301 Kageyama (Kobe Univ.) Visualization / 45

WebGL X LR301 Kageyama (Kobe Univ.) Visualization / 45 2014.05.13 X021 2014 LR301 Kageyama (Kobe Univ.) Visualization 2014.05.13 1 / 45 Kageyama (Kobe Univ.) Visualization 2014.05.13 2 / 45 Kageyama (Kobe Univ.) Visualization 2014.05.13 3 / 45 Web アプリ HTML

More information

WebGL Safari WebGL WebGL Safari Kageyama (Kobe Univ.) / 5

WebGL Safari WebGL WebGL   Safari Kageyama (Kobe Univ.) / 5 04 1 2015.05.12 Kageyama (Kobe Univ.) 2015.05.12 1 / 55 WebGL Safari WebGL WebGL http://www.khronos.org/webgl/ http://www.khronos.org/webgl/wiki/demo_repository Safari Kageyama (Kobe Univ.) 2015.05.12

More information

WebGL Safari WebGL Kageyama (Kobe Univ.) Visualization / 55

WebGL Safari WebGL   Kageyama (Kobe Univ.) Visualization / 55 WebGL WebGL 2014.04.22 X021 2014 Kageyama (Kobe Univ.) Visualization 2014.04.22 1 / 55 WebGL Safari WebGL http://bit.ly/1qxgljb Kageyama (Kobe Univ.) Visualization 2014.04.22 2 / 55 Kageyama (Kobe Univ.)

More information

WebGL Kageyama (Kobe Univ.) Visualization / 39

WebGL Kageyama (Kobe Univ.) Visualization / 39 WebGL *1 WebGL 2013.04.30 *1 X021 2013 LR301 Kageyama (Kobe Univ.) Visualization 2013.04.30 1 / 39 WebGL Kageyama (Kobe Univ.) Visualization 2013.04.30 2 / 39 3 1 PC ID Kageyama (Kobe Univ.) Visualization

More information

Kageyama (Kobe Univ.) / 36

Kageyama (Kobe Univ.) / 36 DrawArrays DrawElements 05 1 2015.05.19 Kageyama (Kobe Univ.) 2015.05.19 1 / 36 Kageyama (Kobe Univ.) 2015.05.19 2 / 36 Kageyama (Kobe Univ.) 2015.05.19 3 / 36 Web アプリ HTML + CSS + JavaScript + シェーダソースコード

More information

3D CG Kageyama (Kobe Univ.) Visualization / 22

3D CG Kageyama (Kobe Univ.) Visualization / 22 WebGL 2014.07.15 X021 2014 Kageyama (Kobe Univ.) Visualization 2014.07.15 1 / 22 3D CG Kageyama (Kobe Univ.) Visualization 2014.07.15 2 / 22 Kageyama (Kobe Univ.) Visualization 2014.07.15 3 / 22 GLSL OpenGL

More information

WebGL *1 DOM API *1 X LR301 Kageyama (Kobe Univ.) Visualization / 37

WebGL *1 DOM API *1 X LR301 Kageyama (Kobe Univ.) Visualization / 37 WebGL *1 DOM API 2013.05.21 *1 X021 2013 LR301 Kageyama (Kobe Univ.) Visualization 2013.05.21 1 / 37 WebGL WebGL DOM References Kageyama (Kobe Univ.) Visualization 2013.05.21 2 / 37 WebGL WebGL Kageyama

More information

Kageyama (Kobe Univ.) 2015.06.23 2 / 41

Kageyama (Kobe Univ.) 2015.06.23 2 / 41 2015 2015.06.23 Kageyama (Kobe Univ.) 2015.06.23 1 / 41 Kageyama (Kobe Univ.) 2015.06.23 2 / 41 [ 1, +1] [ 1, +1] [ 1, +1] Kageyama (Kobe Univ.) 2015.06.23 3 / 41 Kageyama (Kobe Univ.) 2015.06.23 4 / 41

More information

WebGL WebGL DOM Kageyama (Kobe Univ.) Visualization / 39

WebGL WebGL DOM Kageyama (Kobe Univ.) Visualization / 39 WebGL DOM API 2014.05.27 X021 2014 Kageyama (Kobe Univ.) Visualization 2014.05.27 1 / 39 WebGL WebGL DOM Kageyama (Kobe Univ.) Visualization 2014.05.27 2 / 39 WebGL WebGL Kageyama (Kobe Univ.) Visualization

More information

6/ Kageyama (Kobe Univ.) / 39

6/ Kageyama (Kobe Univ.) / 39 DOM API 2015 2015.06.02 Kageyama (Kobe Univ.) 2015.06.02 1 / 39 6/9 1 6 9 2 Kageyama (Kobe Univ.) 2015.06.02 2 / 39 WebGL WebGL Kageyama (Kobe Univ.) 2015.06.02 3 / 39 WebGL canvas.getcontext() WebGLRenderingContext

More information

DrawArrays DrawElements References Kageyama (Kobe Univ.) Visualization / 34

DrawArrays DrawElements References Kageyama (Kobe Univ.) Visualization / 34 WebGL *1 DrawArrays DrawElements 2013.05.14 *1 X021 2013 LR301 Kageyama (Kobe Univ.) Visualization 2013.05.14 1 / 34 DrawArrays DrawElements References Kageyama (Kobe Univ.) Visualization 2013.05.14 2

More information

OpenGL GLSL References Kageyama (Kobe Univ.) Visualization / 58

OpenGL GLSL References Kageyama (Kobe Univ.) Visualization / 58 WebGL *1 2013.04.23 *1 X021 2013 LR301 Kageyama (Kobe Univ.) Visualization 2013.04.23 1 / 58 OpenGL GLSL References Kageyama (Kobe Univ.) Visualization 2013.04.23 2 / 58 Kageyama (Kobe Univ.) Visualization

More information

WebGL OpenGL GLSL Kageyama (Kobe Univ.) Visualization / 57

WebGL OpenGL GLSL Kageyama (Kobe Univ.) Visualization / 57 WebGL 2014.04.15 X021 2014 3 1F Kageyama (Kobe Univ.) Visualization 2014.04.15 1 / 57 WebGL OpenGL GLSL Kageyama (Kobe Univ.) Visualization 2014.04.15 2 / 57 WebGL Kageyama (Kobe Univ.) Visualization 2014.04.15

More information

Kageyama (Kobe Univ.) Visualization / 32

Kageyama (Kobe Univ.) Visualization / 32 WebGL 2014.06.24 X021 2014 Kageyama (Kobe Univ.) Visualization 2014.06.24 1 / 32 Kageyama (Kobe Univ.) Visualization 2014.06.24 2 / 32 Kageyama (Kobe Univ.) Visualization 2014.06.24 3 / 32 kobe u logo

More information

07_経営論集2010 小松先生.indd

07_経営論集2010 小松先生.indd 19 1 2009 105 123 Web Web Web Web World Wide Web WWW OS 1990 WWW Web HTML CSS JavaScript Web 1 WWW 2 Web Web 3 Web 4 HTML5 5 Web Web 3 1970 WWW HTML Web WWW WWW WWW WWW WWW 105 Web WWW 2 Web 1 1 NTT NTT

More information

C.1 GLSL ES 言語リファレンス この付録は WebGL 用のシェーダをプログラムするために使われるGLSL ES 言語のリファレンスである GLSL ESの詳細は GLSL_ES_Specifi

C.1 GLSL ES 言語リファレンス この付録は WebGL 用のシェーダをプログラムするために使われるGLSL ES 言語のリファレンスである GLSL ESの詳細は  GLSL_ES_Specifi 付録 C OpenGL ES Shading Language C.1 GLSL ES 言語リファレンス この付録は WebGL 用のシェーダをプログラムするために使われるGLSL ES 言語のリファレンスである GLSL ESの詳細は http://www.khronos.org/registry/gles/specs/2.0/ GLSL_ES_Specification_1.0.17.pdfの公式仕様書を参照していただきたい

More information

0序文‐1章.indd

0序文‐1章.indd 本 書 に 記 載 されたURL 等 は 執 筆 時 点 でのものであり 予 告 なく 変 更 される 場 合 があります 本 書 の 使 用 ( 本 書 のとおりに 操 作 を 行 う 場 合 を 含 む)により 万 一 直 接 的 間 接 的 に 損 害 が 発 生 し ても 出 版 社 および 著 者 は 一 切 の 責 任 を 負 いかねますので あらかじめご 了 承 下 さい Microsoft

More information

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML Web 工学博士大堀隆文 博士 ( 工学 ) 木下正博 共著 World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML ii HTML CSS CSS HTML HTML HTML HTML Eclipse Eclipse Eclipse

More information

m_sotsuron

m_sotsuron iphone Web 0848066 1. 1 1 1 2 iphone 2 3 2 4 3 2. 3 1 3 2 iphone Web 6 3 HTML 10 4 CSS 12 5 iphone 14 6 15 7 16 8 ipad 18 3. 22 iphone Web Web 2 iphone Web iphone iphone Web iphone Web PC 1 2000 iphone

More information

(1) <html>,,,,, <> ( ) (/ ) (2) <!DOCTYPE html> HTML5 (3) <html> HTML (4) <html lang= ja > html (ja) (5) JavaScript CSS (6) <meta charset= shift jis >

(1) <html>,,,,, <> ( ) (/ ) (2) <!DOCTYPE html> HTML5 (3) <html> HTML (4) <html lang= ja > html (ja) (5) JavaScript CSS (6) <meta charset= shift jis > HTML HTML HyperText Markup Language (Markup Language) (< > ) 1 sample0.html ( ) html sample0.html // JavaScript

More information

第3章 OpenGL の基礎

第3章 OpenGL の基礎 3 OpenGL April 20, 2012 1 / 23 31 ( ) OpenGL OpenGL 2 / 23 32 OpenGL OpenGL OpenGL (Open Graphics Library) Silicon Graphics, Inc 2 3 API (Application Program Interface) [4] UNIX OS Windows Macintosh CAD

More information

第3章 OpenGL の基礎

第3章 OpenGL の基礎 3 OpenGL April 11, 2017 1 / 28 3.1 ( ) OpenGL OpenGL 2 / 28 3.2 OpenGL OpenGL OpenGL (Open Graphics Library) Silicon Graphics, Inc. 2 3 API (Application Program Interface) [4] UNIX OS Windows Macintosh

More information

1 1 1............................ 1 2...................... 1 3..................... 2 4................... 2 2 4 1 CSS.......................... 4 2.

1 1 1............................ 1 2...................... 1 3..................... 2 4................... 2 2 4 1 CSS.......................... 4 2. 1 1 1............................ 1 2...................... 1 3..................... 2 4................... 2 2 4 1 CSS.......................... 4 2.......................... 4 3......................

More information

経営論集2011_07_小松先生.indd

経営論集2011_07_小松先生.indd 20 1 2010 103 125 HTML+CSS HTML CSS CMS Web CMS CMS CMS CMS DreamWeaver Web Web CMS Web Web CSS Web Eclipse HTML CSS Web Web HTML CSS Web HTML CSS Web HTML CSS Web 1 Web Web HTML Web 103 HTML+CSS Web HTML

More information

スライド 1

スライド 1 HTML5 と 関 連 API はじめに 一 般 的 に HTML5 と 呼 ばれている 範 囲 ( 広 義 ) HTML5 という 仕 様 Web Workers キャンバス ドラッグ&ドロップ Data Cache API オフライン コミュニケーション File API など Server-Sent API Web SQL Database Web Sockets Web Storage Indexed

More information

Java演習(4) -- 変数と型 --

Java演習(4)   -- 変数と型 -- 50 20 20 5 (20, 20) O 50 100 150 200 250 300 350 x (reserved 50 100 y 50 20 20 5 (20, 20) (1)(Blocks1.java) import javax.swing.japplet; import java.awt.graphics; (reserved public class Blocks1 extends

More information

( )

( ) 2016 13H018 1 1 2 2 3 4 3.1............................................... 4 3.2 ( ).................................... 5 4 6 4.1........................................ 6 4.2..................... 6 5

More information

2016 IP 1 1 1 1.1............................................. 1 1.2.............................................. 1 1.3............................................. 1 1.4.............................................

More information

第7章 レンダリング

第7章 レンダリング 7 April 11, 2017 1 / 59 7.1 ( ) CG 3 ( ) 2 / 59 7.2 7.2.1 ( ) 3 (rendering) 1 / (hidden line/surface calculation) a (outer normal algorithm) b Z (Z-buffer algorithm) c (scan-line algorithm) 2 (shading)

More information

第7章 レンダリング

第7章 レンダリング 7 May 18, 2012 1 / 60 71 ( ) CG 3 ( ) 2 / 60 72 71 ( ) 3 (rendering) 1 / (hidden line/surface calculation) a (outer normal algorithm) b Z (Z-buffer algorithm) c (scan-line algorithm) 2 (shading) a (flat

More information

130 11 A B C A B C Ctrl (S) 5 A B C 11.2: 11.1.2 2 11.2 (F) (A) ( OK ) 3 (E) ( ) (E) 11.1.3 3

130 11 A B C A B C Ctrl (S) 5 A B C 11.2: 11.1.2 2 11.2 (F) (A) ( OK ) 3 (E) ( ) (E) 11.1.3 3 129 11 Web IT ( 11.1) 1990 2004 2006 JIS 1 Windows 2 Web Web 11.1: 11.1 11.1.1 1 Ctrl ( ) 11.2 (U) (A) ( OK ) (S) 1 (JIS X 8341-2) (JIS X 8341-3) FAX (JIS X 8341-4) 8341 JIS JIS X8341 http://www.jisc.go.jp/

More information

1 JIS X 8341-3:2016 WCAG2.0 http://waic.jp/docs/wcag2/understanding.html WCAG2.0 http://waic.jp/docs/wcag2/techs.html 2 ... 1... 3... 6 1.1... 6 1.2... 7... 8 1.1.1... 8 1.2.1... 13 1.2.2... 14 1.2.3...

More information

1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................

1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................ HTML 1 1 1.......................... 1 2........................... 1 3 CSS CSS.................... 2 4........................... 3 2 4 1................ 4 2..................... 6 3.....................

More information

101NEO資料

101NEO資料 Version 1.5 Tutorial PDF ... 1. PDF... 2 -.... 2 -. PDF... 2 -.... 4 -. HTML... 4 -. PDF... 5 -.... 7 -.... 8 Tutorial PDF Tutorial PDF - Page 1 Tutorial PDF - Page 2 Tutorial PDF - Page 3 Tutorial PDF

More information

1 1 1........................... 1 2.............................. 1 2 2 1........................... 2 2...................... 3 3...................

1 1 1........................... 1 2.............................. 1 2 2 1........................... 2 2...................... 3 3................... 0448051 1 1 1........................... 1 2.............................. 1 2 2 1........................... 2 2...................... 3 3.................... 4 4........................ 6 5...........................

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション 3 Webデザイナーに求められる知識 優秀な HTML, CSS, 画像編集, JavaScript, jquery, XML, 色 彩理論, LL, データベース, SEO, SMO, EFO, コピーラ イティング, テキストライティング, イラストレー ション, Flash, ディレクション能力, プロジェクトマ ネジメント, Logo作成, Typography, サーバ管理, PHP, Perl,

More information

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション OpenGL ES 3.0 最新情報と OpenGL 20 周年 株式会社ディジタルメディアプロフェッショナル大渕栄作 2012 Digital Media Professionals Inc. All rights reserved. 03/Dec/2012 Page 1 Agenda OpenGL ES 3.0 OpenGL 20 周年 2012 Digital Media Professionals

More information

1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1...............

1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1............... 1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1.............................. 3 2........................... 3 3......................

More information

やさしいJavaプログラミング -Great Ideas for Java Programming サンプルPDF

やさしいJavaプログラミング -Great Ideas for Java Programming サンプルPDF pref : 2004/6/5 (11:8) pref : 2004/6/5 (11:8) pref : 2004/6/5 (11:8) 3 5 14 18 21 23 23 24 28 29 29 31 32 34 35 35 36 38 40 44 44 45 46 49 49 50 pref : 2004/6/5 (11:8) 50 51 52 54 55 56 57 58 59 60 61

More information

Microsoft PowerPoint - A07回目②.pptx

Microsoft PowerPoint - A07回目②.pptx 1 コンピュータリテラシーII ( 樋 口 担 当 ) 7 回 目 2 11/14 本 日 の 予 定 2 Webページの 作 成 ( 続 き) I. JavaScript( 画 像 関 係 ) II. 課 題 3 I.JavaScript 1.JavaScriptを 使 用 するためのお 約 束 4 の 間 に

More information

31 Jul.2012 API Application Program Interface Markup SEMANTICS OFFLINE & STORAGE DEVICE ACCESS CONNECTIVITY MULTIMEDIA 3D, GRAPHICS EFFECTS PERFORMANCE INTEGRATION CSS3 HTML5 CSS3 JavaScript WHATWG

More information

すばやく小さくはじめられる HTML5 CSS3 JavaScriptで 青森のコンテンツをつくる 青森大学ソフトウェア情報学部 小久保 温(こくぼ あつし) alert('x=' + x); var styletable = { normal: "default", syncing: "syncing", failed:

More information

コンピュータグラフィクス論

コンピュータグラフィクス論 コンピュータグラフィクス論 2015 年 4 月 9 日 高山健志 教員紹介 高山健志 ( 国立情報学研究所特任助教 ) http://research.nii.ac.jp/~takayama/ takayama@nii.ac.jp 蜂須賀恵也 ( 創造情報学専攻講師 ) http://www.ci.i.u-tokyo.ac.jp/~hachisuka/ thachisuka@siggraph.org

More information

: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1

: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1 : 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1 2 : : 1 1 : 3 : 2 (.ppsx) (A0nxxyyy.ppsx) presen (1 ) ID:A0nxxyyy Name: Title: 3 HTML (HyperText Markup Language) 4 ( ) http://pweb.cc.sophia.ac.jp

More information

388-356697252-2.pdf

388-356697252-2.pdf 専修大学 ネットワーク情報学部 2012年度 特殊演習 (Webプログラミング) 新居雅行 / Masayuki Nii 2 HTML/CSS 2012 4 23 1 2-1 Web 2 2-1 80 SSL Apache WindowsIIS Internet Information Server HTTP HyperText Transfer Protocol HTML HTML 1 1 [ URI]

More information

Developer Camp

Developer Camp A2 HTML5テクニカルセッション HTML5アプリ 開 発 入 門 エンバカデロ テクノロジーズ エヴァンジェリスト 高 橋 智 宏 ttakahashi@embarcadero.com アジェンダ HTML5とは? HTML5の 基 礎 Audio Video Canvas WebGL(Web-Based Graphics Library) AppCache(アプリケーションキャッシュ) Mobile(iOS,

More information

/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます " 出 し"の 部 分 をクリックすると"コンテンツですよ "の 字 が 表 されます もう 度 " 出 し"をクリックすると"コンテンツですよ "の 字 が 非 表 になります 折 りたたみパネルの 基

/ 0/0/ : 実 結 果 HTMLファイルを 表 します 下 図 の 画 が 表 されます  出 しの 部 分 をクリックするとコンテンツですよ の 字 が 表 されます もう 度  出 しをクリックするとコンテンツですよ の 字 が 非 表 になります 折 りたたみパネルの 基 / 0/0/ : [CSS] 折 りたたみ 可 能 なパネルの 作 成 - CSSのみを 利 した 折 りたたみ 領 域 / アコー ディオンパネル このページのタグ:[CSS] [アコーディオンパネル] 新 着 記 事 覧 タグ 覧 トップページ ipentec.com CSSのみを 利 した 折 りたたみ 可 能 なパネル( 折 りたたみ 可 能 領 域 )を 実 現 するコードを 紹 介 します

More information

コンピュータサイエンス 1. ウェブの基本

コンピュータサイエンス 1. ウェブの基本 1. Chris Plaintail May 18, 2016 1 / 27 1 2 HTML HTML 3 CSS style 2 / 27 HTML HTML HTML HTML CSS HTML CSS 3 / 27 4 / 27 HTML HTML, CSS HTML, CSS http, https file CSS HTML CSS.html PC file:// PC.html 5 /

More information

8 7 + <div class='col-12 col-md-8'> 8 <%= item.description %> 9 </div> 10 </div> 11 <% end %> 12 </div> class container container-fluid PicoPlan

8 7 + <div class='col-12 col-md-8'> 8 <%= item.description %> 9 </div> 10 </div> 11 <% end %> 12 </div> class container container-fluid PicoPlan 8 Bootstrap 8.1 PicoPlanner responsive web design PC plan_items#index app/views/plan_items/index.html.erb 1 - 1 + 2 3 - 3 +

More information

Microsoft Word - ggbook.docx

Microsoft Word - ggbook.docx 62 4GPU (Graphics Processing Unit) 4.1 4.1.1 63 63 ( 64) " () " " " 64 63 4.1.2 () GPU (Graphics Procssing Unit) (Transform) (Lighting ) T & L (Transform and Lighting) " CG 4 4 4 4 () 4 4 4 4 4 4 4 16

More information

textbook.indd

textbook.indd 02 XHTML+CSS part2 CSS Topics 前 回 習 得 した 基 礎 CSS を 元 に ボックス CLASS ID の 概 念 を 習 得 ボックスレイアウトを 用 いた 2 カラムのサイト 構 築 をします An Introduction to Webdesign + XHTML/CSS Coding 18 01. XHTML+CSS 2 19 20 21 22 23 24

More information

コンピュータグラフィクス論

コンピュータグラフィクス論 コンピュータグラフィクス論 2016 年 4 月 7 日 高山健志 教員紹介 高山健志 ( 国立情報学研究所特任助教 ) http://research.nii.ac.jp/~takayama/ takayama@nii.ac.jp 蜂須賀恵也 ( 創造情報学専攻講師 ) http://www.ci.i.u-tokyo.ac.jp/~hachisuka/ thachisuka@siggraph.org

More information

untitled

untitled 25 10 12 11 24 (1) 14 (2) 26 10 44 (3) (4) (5) 27 10 68 (6) (7) (8) 25 10 ( ) (1) (2) (3) ) city.yokohama.lg.jp city.yokohama.jp WEB WEB WEB WEB WEB WEB 1 25 10 WEB WEB (1) (2) (3) (4) 25 10 (1) WEB (2)

More information

6 2 1

6 2 1 6 1 6 (1) (2) HTML (3) 1 Web 1 Web Web 1 Web HTML 6 2 1 6 3 1.1 HTML(XHTML) Web HTML(Hyper Text Markup Language) ( ) html htm HTML HTML5 takahagi

More information

コンピュータサイエンス 4. ウェブプログラミング

コンピュータサイエンス 4. ウェブプログラミング 4. Chris Plaintail 2014 1 / 43 1 HTML CSS 2 JavaScript DOM jquery 3 4 PHP SQL PHP SQL 2 / 43 HTML HTML CSS HTML Ajax (Asynchronous JavaScript + XML) PHP SQL 3 / 43 HTML, CSS http, https CSS HTML CSS.html

More information

GLS user s reference 19 8 21 1 3 1.1....................................................... 3 1.2....................................................... 3 1.3.......................................................

More information

CONTENTS 0 1 2 3 4 5 6 7 8 9 10 0 viii ix x http://www.vector.co.jp/vpack/filearea/win/writing/edit/hm/index.html http://hidemaru.xaxon.co.jp/lib/macro/index.html ftp://ftp.m17n.org/pub/mule/windows/ http://www.yatex.org/

More information

untitled

untitled FONT FACE=" " /FONT hp11.html FONT FACE=" " /FONT FONT FACE=" " HTML HP10.html HTML HTML HTML html head title /title font face=" " size="5" /fontbr font face=" " size="5" /fontbr font size="5" /fontbr

More information

第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C

第 10 問 スマートフォンはパソコンとは 異 なり コンピュータウイルスなどの 不 正 プログラムの 侵 入 感 染 フィッシングなど の 詐 欺 に 遭 うことがないため セキュリティソフトをスマートフォンに 導 入 する 必 要 はない 2. 以 下 の 設 問 に 答 えよ 第 11 問 C 1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 HTML5 では タグの 省 略 は 一 切 認 められていない 第 2 問 インターネット 上 のすべてのコンピュータは イーサネットで 繋 がっている 第 3 問 新 規 にウェブサイトを 公 開 する 際 は HTML ドキュメントをアップロードした 後 に

More information

1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1..............................

1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1.............................. 1 1 1............................ 1 2 jquery........................ 2 3................ 3 4................... 3 2 4 1.............................. 4 2.............................. 6 3...........................

More information

JavaScript の使い方

JavaScript の使い方 JavaScript Release10.5 JavaScript NXJ JavaScript JavaScript JavaScript 2 JavaScript JavaScript JavaScript NXJ JavaScript 1: JavaScript 2: JavaScript 3: JavaScript 4: 1 1: JavaScript JavaScript NXJ Static

More information

Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheet

Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheet 2012 Homepage HTML+CSS Flash JavaScript Homepage Homepage Homepage Homepage Web HTML Hyper Text Markup Language XHTML XHTML HTML5 CSS Cascading Style Sheets CSS2 CSS3 Web Web2.0 Web3.0 Web IT Web Homepage

More information

InfoPros13_digest.key

InfoPros13_digest.key ! CSS sample2.css h1 h1 { color : blue ; } : ; { } : 14 : : p { font-size: 14pt; } p { font-style: italic; } p { text-decoration: underline; } p { font-size:

More information

1. 2 DITA 2 2. 1 2. 1. 1 UModel UModel Altova [1] UModel UModel UML(Unified Modeling Language) Java C# VB.NET UML UModel UML 2. 1. 2 XML XML [7] chksp

1. 2 DITA 2 2. 1 2. 1. 1 UModel UModel Altova [1] UModel UModel UML(Unified Modeling Language) Java C# VB.NET UML UModel UML 2. 1. 2 XML XML [7] chksp 30 (2013 ) DITA DITA(Darwin Information Typing Architecture) In software development processes, several documents are created in period of each development phases. Most of these have different file type

More information

ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3

ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3 Web 2.0 Web Web Web Web Web Web Web I II I ii II Web Web HTML CSS PHP MySQL Web Web CSS JavaScript Web SQL Web 2014 3 1. 1.1 Web... 1 1.1.1... 3 1.1.2... 3 1.1.3... 4 1.2... 4 I 2 5 2. HTMLCSS 2.1 HTML...

More information

6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1

6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1 6 1 6 (1) (2) HTML (3) PDF Copy&Paste 1 Web 1 Web Web 1 Web HTML 6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1 6 3 1.1 HTML Web HTML(Hyper Text Markup Language)

More information

2004-2006 2004-2006 CSS Web Quiz LOVE PC 2012 4 Windows 8 / CPP Fluid PE CSS3 RWD Quiz 1. 2. 3. 4. 1. 2. 3. 4. CSS3 #btn {! display:block;! width:300px;! font-size:28px;! font-weight:bold;!

More information

SGML HTML XML Markup Language Web HTML HTML SGML Standard Generalized Markup Language Markup Language DTD Document Type Definition XML SGML Markup Language HTML XML HTML XML JavaScript JAVA CGI HTML Web

More information

r3.dvi

r3.dvi 00 3 2000.6.10 0 Java ( 7 1 7 1 GSSM 1? 1 1.1 4 4a 4b / / 0 255 HTML X 0 255 16 (0,32,255 #0020FF Java xclock -bg #0020FF xclock ^C (Control C xclock 4c 1 import java.applet.applet; import java.awt.*;

More information

1 GPU GPGPU GPU CPU 2 GPU 2007 NVIDIA GPGPU CUDA[3] GPGPU CUDA GPGPU CUDA GPGPU GPU GPU GPU Graphics Processing Unit LSI LSI CPU ( ) DRAM GPU LSI GPU

1 GPU GPGPU GPU CPU 2 GPU 2007 NVIDIA GPGPU CUDA[3] GPGPU CUDA GPGPU CUDA GPGPU GPU GPU GPU Graphics Processing Unit LSI LSI CPU ( ) DRAM GPU LSI GPU GPGPU (I) GPU GPGPU 1 GPU(Graphics Processing Unit) GPU GPGPU(General-Purpose computing on GPUs) GPU GPGPU GPU ( PC ) PC PC GPU PC PC GPU GPU 2008 TSUBAME NVIDIA GPU(Tesla S1070) TOP500 29 [1] 2009 AMD

More information

K227 Java 2

K227 Java 2 1 K227 Java 2 3 4 5 6 Java 7 class Sample1 { public static void main (String args[]) { System.out.println( Java! ); } } 8 > javac Sample1.java 9 10 > java Sample1 Java 11 12 13 http://java.sun.com/j2se/1.5.0/ja/download.html

More information

r1.dvi

r1.dvi 2006 1 2006.10.6 ( 2 ( ) 1 2 1.5 3 ( ) Ruby Java Java Java ( Web Web http://lecture.ecc.u-tokyo.ac.jp/~kuno/is06/ / ( / @@@ ( 3 ) @@@ : ( ) @@@ (Q&A) ( ) 1 http://www.sodan.ecc.u-tokyo.ac.jp/cgi-bin/qbbs/view.cgi

More information

(1)

(1) 第 回 アビリンピック 京 都 大 会 ホームページ 部 門 練 習 問 題 (1) 仕 様 1 ホームページの 内 容 府 立 京 都 高 等 技 術 専 門 校 のホームページを 作 成 する 2 ページ 構 成 とファイル index.html guid.html course.html mystyle.css ie.css 以 上 のファイルと 素 材 はホームページよりダウンロードして

More information

第3回HP講習会資料ver1.2(2007.9.20)

第3回HP講習会資料ver1.2(2007.9.20) 1.はじめに 第 3 回 技 術 センター 職 員 向 けHP 講 習 会 では スタイルシートの 基 礎 として CSSを 使 った Webページを 作 成 していきます HTMLだけでは 出 来 ないCSSを 用 いたレイアウトを 分 かり 易 く 体 験 してもらえるように 今 回 はCSSの 中 でもクラスやIDといった 概 念 を 省 いています 2.スタイルシートとは? スタイルシート

More information

( ) 1 1: 1 #include <s t d i o. h> 2 #include <GL/ g l u t. h> 3 #include <math. h> 4 #include <s t d l i b. h> 5 #include <time. h>

( ) 1 1: 1 #include <s t d i o. h> 2 #include <GL/ g l u t. h> 3 #include <math. h> 4 #include <s t d l i b. h> 5 #include <time. h> 2007 12 5 1 2 2.1 ( ) 1 1: 1 #include 2 #include 3 #include 4 #include 5 #include 6 7 #define H WIN 400 // 8 #define W WIN 300 // 9

More information

IPSJ SIG Technical Report iphone iphone,,., OpenGl ES 2.0 GLSL(OpenGL Shading Language), iphone GPGPU(General-Purpose Computing on Graphics Proc

IPSJ SIG Technical Report iphone iphone,,., OpenGl ES 2.0 GLSL(OpenGL Shading Language), iphone GPGPU(General-Purpose Computing on Graphics Proc iphone 1 1 1 iphone,,., OpenGl ES 2.0 GLSL(OpenGL Shading Language), iphone GPGPU(General-Purpose Computing on Graphics Processing Unit)., AR Realtime Natural Feature Tracking Library for iphone Makoto

More information

1 3DCG [2] 3DCG CG 3DCG [3] 3DCG 3 3 API 2 3DCG 3 (1) Saito [4] (a) 1920x1080 (b) 1280x720 (c) 640x360 (d) 320x G-Buffer Decaudin[5] G-Buffer D

1 3DCG [2] 3DCG CG 3DCG [3] 3DCG 3 3 API 2 3DCG 3 (1) Saito [4] (a) 1920x1080 (b) 1280x720 (c) 640x360 (d) 320x G-Buffer Decaudin[5] G-Buffer D 3DCG 1) ( ) 2) 2) 1) 2) Real-Time Line Drawing Using Image Processing and Deforming Process Together in 3DCG Takeshi Okuya 1) Katsuaki Tanaka 2) Shigekazu Sakai 2) 1) Department of Intermedia Art and Science,

More information

第 10 問 取 得 したドメインでウェブサイトを 公 開 する 場 合 共 用 サーバは 一 切 使 えないので 専 用 サーバを 用 意 する 必 要 が ある 第 11 問 WaSP とは Web accessibility Standard Project の 略 称 である 第 12 問

第 10 問 取 得 したドメインでウェブサイトを 公 開 する 場 合 共 用 サーバは 一 切 使 えないので 専 用 サーバを 用 意 する 必 要 が ある 第 11 問 WaSP とは Web accessibility Standard Project の 略 称 である 第 12 問 1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 グローバルナビゲーションとは 水 平 方 向 に 配 置 されるものを 指 し 垂 直 方 向 に 配 置 されるものはローカルナビ ゲーションと 呼 ばれる 第 2 問 イーサネットとは 1000BASE-T の 規 格 のみをさす 第 3 問 IPv6 で 定

More information

Taro13-第6章(まとめ).PDF

Taro13-第6章(まとめ).PDF % % % % % % % % 31 NO 1 52,422 10,431 19.9 10,431 19.9 1,380 2.6 1,039 2.0 33,859 64.6 5,713 10.9 2 8,292 1,591 19.2 1,591 19.2 1,827 22.0 1,782 21.5 1,431 17.3 1,661 20.0 3 1,948 1,541 79.1 1,541 79.1

More information

HTML文書の作成

HTML文書の作成 99 C HTML 1 1 2 HTML 1 3 2 4 HTML 2 4.1... 2 4.2... 3 4.3... 5 5 HTML 8 5.1... 8 5.2... 10 5.3... 12 6 HTML 13 7 13 1 HTML HTML [1] 2 HTML HTML Hyper-Text Markup Language World Wide Web (WWW)[2] HTML Hyper-Text

More information

PowerPoint Presentation

PowerPoint Presentation XML 6 614 XBRL XBRL Japan 1 2 XBRL 3 4 5 6 7 XBRL XBRL XBRL EDINET Web XBRL Essentials, C. Hoffman, AICPA, 2001 All Rights Reserved, Copyright 2002, Hitachi Ltd. XBRL Essentials, C. Hoffman, AICPA, 2001

More information

... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2

... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2 1 ... 3... 3... 3... 3... 4... 7... 10... 10... 11... 12... 12... 13... 14... 15... 18... 19... 20... 22... 22... 23 2 3 4 5 6 7 8 9 Excel2007 10 Excel2007 11 12 13 - 14 15 16 17 18 19 20 21 22 Excel2007

More information

HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17

HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17 1 11 13 2 11 27 3 12 11 HTML HTML HTML 4.1 4.2 4.3 4.4 14 15 16 17 WWW(World Wide Web) HTML(HyperText Markup Language) HTML HTML HTML HTML - 1 - .1 HTML (V)(C) HTML - 2 - HTML HTML OS Windows 2.1 HTML

More information

分散情報システム構成法

分散情報システム構成法 Web Information System Design No.3 Web 文 書 にスタイルを 付 ける Tatsuya Hagino (hagino@sfc.keio.ac.jp) 1 Webページの 構 成 要 素 直 交 技 術 を 組 み 合 わせる 内 容 スタイル プログラミング スタイル プログラミング JavaScript CSS Webページ Web 文 書 HTML 内 容

More information

第 11 問 XML は Extensible Markup Language の 略 である 第 12 問 IPv6 で 定 義 可 能 な IP アドレスの 数 の 理 論 値 は 2 の 32 乗 である 第 13 問 Document Object Model (DOM) の 仕 様 は J

第 11 問 XML は Extensible Markup Language の 略 である 第 12 問 IPv6 で 定 義 可 能 な IP アドレスの 数 の 理 論 値 は 2 の 32 乗 である 第 13 問 Document Object Model (DOM) の 仕 様 は J 1. 各 設 問 において 正 しいものは1を 間 違 っているものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 GIF 形 式 などで 用 いられるディザリングとは 限 られた 色 数 でより 多 くの 色 を 擬 似 的 に 表 現 する 手 法 である 第 2 問 HTML5 文 書 の 内 部 には SVG 要 素 を 直 接 書 き 込 むことができる 第 3 問 cookie

More information