Google Visualisation API googlev is

Size: px
Start display at page:

Download "1 3 1.1............................................ 3 1.2 Google Visualisation API................................ 3 2 googlev is 5 2.1..............."

Transcription

1 Google Visualisation API R googlevis Markus Gesmann, Diego de Castillo googlev is R Google Visualisation API Google Visualisation API TED Hans Rosling googlev is R Google Google Visualisation API googlev is Google JavaScript html googlev is R HTTP 1

2 Google Visualisation API googlev is googlev is gvis gvismerge googlev is gvis googlev is WordPress googlev is Google, Blogger googlev is googlev is R.rsp RApache brew googlev is googlev is 22 5 R

3 Hans Rosling 50 TED [Ros06] Rosling Gapminder [Fou10b] 1 Rosling 1 Gapminder Google 1 Google Visualisation API [Inc12e] Guardian taz.de Die Tageszeitung 2010 R/Rmetrics Sebastián Peréz Saaibi [Saa10] Google R R.rsp [Ben12] googlevis [GdC12],[GdC11] Many Eyes [RtICsg10] Open Flash Chart (Flash) [JG10] OpenLayers (JavaScript) [Fou10c] Processing (Java) [FR10] simile (AJAX) [DKM10] FLARE (Action- Script) [Lab10] 1.2 Google Visualisation API Google Visualisation API [Inc12e] Google API Google Public Data Explorer [Inc12c] HTML Google Visualisation API DataTable [Inc12d] RJSONIO [Lan12] R JSON [JSO06] DataTable 3

4 1: Google plot(gvismotionchart(fruits, idvar= Fruit, timevar= Year )) Google visualisation gallery [Inc10a] html 1 1 <html> 2 <head> 3 <script type="text/javascript" 4 src="http://www.google.com/jsapi"> 5 </script> 6 <script type="text/javascript"> 7 google.load( visualization, 1, 8 { packages :[ motionchart ]}); 9 google.setonloadcallback(drawchart); 10 function drawchart() { 11 var data=new google.visualization.datatable(); 12 data.addcolumn( string, Fruit ); 13 data.addcolumn( date, Date ); 14 data.addcolumn( number, Sales ); 15 data.addcolumn( number, Expenses ); 16 data.addcolumn( string, Location ); 17 data.addrows([ 18 [ Apples,new Date(1988,0,1),1000,300, East ], 19 [ Oranges,new Date(1988,0,1),1150,200, West ], 20 [ Bananas,new Date(1988,0,1),300,250, West ], 21 [ Apples,new Date(1989,6,1),1200,400, East ], 22 [ Oranges,new Date(1989,6,1),750,150, West ], 23 [ Bananas,new Date(1989,6,1),788,617, West ] 4

5 24 ]); 25 var chart=new google.visualization.motionchart( 26 document.getelementbyid( chart_div )); 27 chart.draw(data, {width: 600, height:300}); 28 } 29 </script> 30 </head> 31 <body> 32 <div id="chart_div" 33 style="width:600px; height:300px;"> 34 </div> 35 </body> 36 </html> 1 html 5 2 ˆ Google AJAX ( 4 ) Visualisation API 7 8 ) ˆ DataTable ˆ ˆ width height 27 ˆ HTML <div> Google Visualisation API 2 API Google Visualization API [Inc12a] 2 googlev is googlev is R Google Visualisation API Google Visualisation API R Motion Chart Annotated Time Line Geo Map Map Geo Chart Intensity Map Table Gauge Treemap Line Chart Bar Chart Bubble Chart Column Chart Area Chart Stepped Area Combo Chart Scatter Chart Candlestick Chart Pie Chart Org Chart 2 3 googlev is Google JavaScript HTML 1 Policy 2 charts.html 3 5

6 2: demo(googlevis) gvismotionchart gvisannotatedtimeline gvisgeomap gvistreemap gvistable gvismap 2.1 googlev is CRAN R> install.packages( googlevis ) library(googlevis) R> library(googlevis) Welcome to googlevis version Please read the Google API Terms of Use before you use the package: Type?googleVis to access the overall documentation and 6

7 vignette( googlevis ) for the package vignette. You can execute a demo of the package via: demo(googlevis) More information is available on the googlevis project web-site: Contact: To suppress the this message use: suppresspackagestartupmessages(library(googlevis)) 2.2 googlev is googlev is 1 API googlev is 4 2 gvis+ gvismotionchart(data, idvar= id, timevar= date, options=list(), chartid) data idvar timevar id options 14 Google Visualisation API R> help( gvismotionchart ) 3: gis 4 7

8 chartid id 1 id googlev is id html 3 rsp 20 RApache 21 Google googlev is gvis list print print.gvis plot plot.gvis Fruits 2.3 Google API Fruits R> data(fruits) R> Fruits Fruit Year Location Sales Expenses Profit Date 1 Apples 2008 West Apples 2009 West Apples 2010 West Oranges 2008 East Bananas 2008 East Oranges 2009 East Bananas 2009 East Oranges 2010 East Bananas 2010 East id F ruit Y ear Y ear Date R> M <- gvismotionchart(fruits, idvar="fruit", timevar="year") gvismotionchart R> str(m) List of 3 $ type : chr "MotionChart" $ chartid: chr "MotionChartID46d3641c73d" $ html :List of 4..$ header : chr "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0..$ chart : Named chr [1:7] "<!-- MotionChart generated in R attr(*, "names")= chr [1:7] "jsheader" "jsdata" "jsdrawch..$ caption: chr "<div><span>data: Fruits Chart ID: <a h..$ footer : chr "\n<!-- htmlfooter -->\n<span> \nr version

9 - attr(*, "class")= chr [1:2] "gvis" "list" 2 type id chartid 5 R> M$type [1] "MotionChart" R> M$chartid [1] "MotionChartID46d3641c73d" html header chart caption footer html html html R> print(m, tag= header ) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>motionchartid46d3641c73d</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <style type="text/css"> body { color: #444444; font-family: Arial,Helvetica,sans-serif; font-size: 75%; } a { color: #4D87C7; text-decoration: none; } </style> </head> <body> M$html$header header tag print cat(m$html$header) Google visualisation html JavaScript HTML JavaScript id print.gvis R> names(m$html$chart) [1] "jsheader" "jsdata" "jsdrawchart" "jsdisplaychart" [5] "jschart" "jsfooter" "divchart" R> print(m, tag= chart ) ## cat(m$html$chart) 5 9

10 <!-- MotionChart generated in R by googlevis package --> <!-- Fri Jun 1 19:45: > <!-- jsheader --> <script type="text/javascript" src="http://www.google.com/jsapi"> </script> <script type="text/javascript"> // jsdata function gvisdatamotionchartid46d3641c73d () { var data = new google.visualization.datatable(); var datajson = [ [ "Apples", 2008, "West", 98, 78, 20, " " ], [ "Apples", 2009, "West", 111, 79, 32, " " ], [ "Apples", 2008, "West", 98, 78, 20, " " ], [ "Apples", 2009, "West", 111, 79, 32, " " ], 10

11 [ "Apples", 2010, "West", 89, 76, 13, " " ], [ "Oranges", 2008, "East", 96, 81, 15, " " ], [ "Bananas", 2008, "East", 85, 76, 9, " " ], [ "Oranges", 2009, "East", 93, 80, 13, " " ], [ "Bananas", 2009, "East", 94, 78, 16, " " ], [ "Oranges", 2010, "East", 98, 91, 7, 11

12 " " ], [ "Bananas", 2010, "East", 81, 71, 10, " " ] ]; data.addcolumn( string, Fruit ); data.addcolumn( number, Year ); data.addcolumn( string, Location ); data.addcolumn( number, Sales ); data.addcolumn( number, Expenses ); data.addcolumn( number, Profit ); data.addcolumn( string, Date ); data.addrows(datajson); return(data); } // jsdrawchart function drawchartmotionchartid46d3641c73d() { var data = gvisdatamotionchartid46d3641c73d(); var options = {}; options["width"] = 600; options["height"] = 500; var chart = new google.visualization.motionchart( document.getelementbyid( MotionChartID46d3641c73d ) ); chart.draw(data,options); } // jsdisplaychart function displaychartmotionchartid46d3641c73d() { google.load("visualization", "1", { packages:["motionchart"] }); google.setonloadcallback(drawchartmotionchartid46d3641c73d); } // jschart displaychartmotionchartid46d3641c73d() <!-- jsfooter --> //--> </script> 12

13 <!-- divchart --> <div id="motionchartid46d3641c73d" style="width: 600px; height: 500px;"> </div> jschart R> cat(m$html$chart[ jschart ]) # print(m, jschart ) // jschart displaychartmotionchartid46d3641c73d() html html R> print(m, tag= caption ) <div><span>data: Fruits Chart ID: <a href="chart_motioncha R> print(m, tag= footer ) <!-- htmlfooter --> <span> R version RC ( r58819) <a href="http://co <a href="https://developers.google.com/terms/">google Term </span></div> </body> </html> 2.4 gvis R> plot(m) # gvis plot id HTML R HTTP & id R tempdir() file print html R> print(m, file="mygooglevischart.html") 13

14 6 Tony Breyal stackoverflow.com 1. manager04.html html 5. OK googlev is html 2.5 gvismerge gvismerge 2 gvis 1 HTML 2 horizontal vertival gvismerge gvis gvismerge 4 R> G <- gvisgeochart(exports, "Country", "Profit", + options=list(width=200, height=100)) R> T <- gvistable(exports, + options=list(width=200, height=270)) R> M <- gvismotionchart(fruits, "Fruit", "Year", + options=list(width=400, height=370)) R> GT <- gvismerge(g,t, horizontal=false) R> GTM <- gvismerge(gt, M, horizontal=true, + tableoptions="bgcolor=\"#cccccc\" cellspacing=10") R> plot(gtm) 2.6 googlev is 7 Google Visualisation API option R> df <- data.frame(country=c("us", "GB", "BR"), + val1=c(1,3,4), val2=c(23,12,32)) R> Line <- gvislinechart(df, xvar="country", yvar=c("val1","val2"), + options=list( + title="hello World", 6 7 googlev is 14

15 + titletextstyle="{color: red, + fontname: Courier, + fontsize:16}", + backgroundcolor="#d3d3d3", + vaxis="{gridlines:{color: red, count:3}}", + haxis="{title: Country, titletextstyle:{color: blue }}", + titletextstyle:{color: blue }}", + series="[{color: green, targetaxisindex: 0}, + {color: orange,targetaxisindex:1}]", + vaxes="[{title: val1 }, {title: val2 }]", + legend="bottom", + curvetype="function", + width=500, + height=300 + )) R> plot(line) 4: gvismerge 3 = width=500 { } 2 [ ] 6 R> Geo <- gvisgeochart(citypopularity, locationvar= City, + colorvar= Popularity, + options=list(region= US, height=350, + displaymode= markers, + coloraxis="{values:[200,400,600,800], + colors:[\ red, \ pink\, \ orange,\ green ]}") + ) 15

16 5: R> plot(geo) 6: gvis.editor 7 gvis.editor Edit me! 8 R> Editor <- gvislinechart(df, options=list(gvis.editor= Edit me! )) R> plot(editor) 8 Google Visualization API Reference html#google visualization charteditor 16

17 7: options = list (gvis.editor = Edit me! ) googlev is googlevis JSON JSON R> df <- data.frame("year"=c(2010,2011), "Lloyd\\ s"=c(86.1, 93.3), + "Munich Re\\ s R/I"=c(95.3, 100.5), + check.names=false) R> df Year Lloyd\\ s Munich Re\\ s R/I R> CR <- gviscolumnchart(df, options=list(vaxis= {baseline:0}, + title="combined Ratio %", + legend="{position: bottom }")) R> plot(cr) 3 googlev is 3.1 gvis googlev is gvismotionchart gvismotionchart 17

18 8: R> print(m, chart ) ## cat(m$html$chart) html R & R> print(m, chart, file= myfilename ) 3.2 googlev is WordPress WordPress googlev is WordPress WordPress JavaScript googlev is WordPress JavaScript WordPress 1 custom fields shortcode 9 googlev is R R> M <- gvismotionchart(fruits, "Fruit", "Year", options=list(width=400, height=370)) R> print(m, chart ) WordPress value Fruits [cf]fruits[/cf]

19 9: googlev is WordPress 3.3 googlev is Google, Blogger Google Google Google Blogger Google Code wiki Google Google XML HTML Javascript Google Hello World Wikipedia <?xml version="1.0" encoding="utf-8"?> <Module> <ModulePrefs title="simple hello world example" /> <Content type="html"> <![CDATA[ Hello, world! ]]> </Content> </Module> googlev is creategooglegadget gvis XML R> M <- gvismotionchart(fruits, "Fruit", "Year") R> G <- creategooglegadget(m) R> cat(g, file="mygadget.xml") Google Docs mygadget.xml URL Google Site 19

20 ˆ Google Site "Insert" -> "More gadgets..." -> "Add gadget URL", ˆ wiki:gadget Google Code wiki <wiki:gadget url="http://example.com/gadget.xml" />, ˆ Blogger blogger post googlev is post & googlev is Dropbox <iframe> <iframe width="100%" height="400px" frameborder="0" src="http://example.com/mygooglevischart.html"> </iframe> 3.4 googlev is googlev is R R.rsp [Ben12] brew [Hor11a] R HTML 2 R.rsp brew RApache [Hor11b] Apache HTTP [Fou10a] RApache UNIX/Linux Mac OS X googlev is R.rsp R.rsp R HTML R R.rsp rsp <html> <body> <% library(googlevis) M <- gvismotionchart(fruits, idvar="fruit", timevar="year") %> <%= M$html$chart %> </body> </html> <%...%> R R.rsp HTTP R : HTML R <\%=...\%> cat googlev is R R> library(r.rsp) R> browsersp() 20

21 R> # googlevis rsp googlev is R> file.path(system.file("rsp", package = "googlevis"), "index.rsp") R.rsp RApache brew googlev is RApache R Apache HTTP RApache Apache R R HTML R brew HTTP brew brew R RApache R.rsp 2 R RApache http: //rapache.net/manual.html, Mac OS X blogspot.com/2010/08/installing-rapache-on-mac-os-x-snow.html RApache RApache Apache apache2.conf httpd.conf /etc/httpd Mac OS X /private/etc/apache2/httpd.conf LoadModule R_module \url{/usr/lib/apache2/modules/mod_r.so} ## On Mac OS X more likely to be: ## LoadModule R_module libexec/apache2/mod_r.so ROutputErrors RSourceOnStartup "/var/www/rapache/r/startup.r" ## On Mac OS X the www folder is often equivalent to: ## /Library/WebServer/Documents/ 1 Apache R 2 startup.r ## Ensure the packages are installed so that mod_r ## has access to them, e.g. not in your home folder library{googlevis} library{lattice} library{cairo} MyGlobalVar <- 42 RApache RApache files/rapacheinfo.html brew R> install.packages( brew ) 21

22 brew Apache apache2.conf httpd.conf RHandler brew <Directory /var/www/rapache/brew> ## On Mac OS more likely to be something like: ## <Directory /Library/WebServer/Documents/rapache/brew> SetHandler r-script RHandler brew::brew </Directory> HTTP brew <html> <body> <h1>fruits</h1> <% library(googlevis) M <- gvismotionchart(fruits, idvar="fruit", timevar="year") %> <%= M$html$chart %> </body> </html> brew rsp RApache brew brew googlev is 2 R R> system.file("brew", package = "googlevis") 4 googlev is Google Visualisation API googlevis MS Power- Point 10 Google Docs OpenOffice Impress Apple Keynot JavaScript deck.js [Tro11] Caleb Troughton HTML jquery YouTube googlevis mages s googlevis blogspot.com/2011/11/interactive-presentations.html 10 MS-Windows Microsoft PowerPoint liveweb PowerPoint 22

23 10: deck.js googlevis : 5 R R 5.1 Google visualisations 11 2 JavaScript ˆ google.visualization.events.trigger() fire ˆ google.visualization.events.addlistener() listen Google selection 1 var table = new google.visualization.table(document.getelementbyid( table_div )); table.draw(data, options); google.visualization.events.addlistener(table, select, selecthandler); function selecthandler() { alert( A table row was selected ); } addlistner select addlistener gvis.listener.jscode gvis JavaScript Wikipedia R> jscode <- "window.open( + + data.getvalue(chart.getselection()[0].row,0)); " R> J1 <- gvisgeomap(exports, locationvar= Country, numvar= Profit, + options=list(datamode="regions", gvis.listener.jscode=jscode)) R> plot(j1) R> plot(gvisorgchart(regions, options=list(gvis.listener.jscode=jscode))) R> plot(gvislinechart(regions[,c(1,3)], options=list(gvis.listener.jscode=jscode)))

24 R> jscode <- " + var sel = chart.getselection(); + var row = sel[0].row; + var text = data.getvalue(row,1); + alert(text); + " R> J2 <- gvistable(population, options=list(gvis.listener.jscode=jscode)) R> plot(j2) demo(eventlistener) Google Visualisation API Google Visualisation API 6.2 R googlevis R> citation("googlevis") R> citation() 6.3 gmail.com [Ben12] Henrik Bengtsson. R.rsp: R server pages R package version [DKM10] MacKenzie Smith (MIT Libraries) David Karger (MIT CSAIL). Simile: Semantic Interoperability of Metadata and Information in unlike Environments [Fou10a] Apache Foundation. Apache HTTP Server [Fou10b] Gapminder Foundation. Gapminder [Fou10c] Open Source Geospatial Foundation. Openlayers: Free maps for the web. openlayers.org/, [FR10] Ben Fry and Casey Reas. Processing an open source programming language and environ- 24

25 ment to create images, animations, and interactions [GdC11] Markus Gesmann and Diego de Castillo. Using the Google Visualisation API with R. The R Journal,3(2):40-44, December [GdC12] Markus Gesmann and Diego de Castillo. googlevis: Using the Google Visualisation API with R R package version [Hor11a] Jeffrey Horner. brew: Templating framework for report generation. R-project.org/package=brew, R package version [Hor11b] Jeffrey Horner. RApache: Web application development with R and Apache. http: //www.rapache.net/, [Inc12a] Google Inc. Google API Terms of Service. https://developers.google.com/terms/, [Inc12b] Google Inc. Google Motion Chart API. https://google-developers.appspot.com/ chart/interactive/docs/gallery/motionchart.html, [Inc12c] Google Inc. Google Public Data Explorer [Inc12d] Google Inc. Google Visualisation Reference. https://developers.google.com/chart/ interactive/docs/reference, [Inc12e] Google Inc. Google Visualization API. https://google-developers.appspot.com/ chart/interactive/docs/gallery, [JG10] George Neusse John Glazebrook, Guenther Harrasser. Open flash chart. teethgrinder.co.uk/open-flash-chart/, [JSO06] JSON.org. JSON RFC 4627 application/json. [Lab10] UC Berkeley Visualization Lab. flare: Data visualisation for the web. prefuse.org, [Lan12] Duncan Temple Lang. RJSONIO: Serialize R objects to JSON, JavaScript Object Notation R package version [Ros06] Hans Rosling. TED Talk: Hans Rosling shows the best stats you ve ever seen. rosling shows the best stats you ve ever seen.html, [RtICsg10] IBM Research and the IBM Cognos software group. Many eyes. alphaworks.ibm.com/manyeyes/page/create a Visualization.html, [Saa10] Sebasti an Pe rez Saaibi. R/RMETRICS Generator Tool for Google Motion Charts. https: //www.rmetrics.org/, Meielisalp, Lake Thune Switzerland, June 27 - July 1, [Tro11] Caleb Troughton. deck.js: Modern HTML Presentations, jquery framework for creating HTML presentations. 25

Google Chart Tools googlevis

Google Chart Tools googlevis googlevis-0.6.1 Markus Gesmann *, Diego de Castillo 2016 9 1 2016 9 21 googlevis R Google Google TED Hans Rosling googlevis R Google Google Chart googlevis Google JavaScript HTML googlevis R HTTP Flash

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

0序文‐1章.indd

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

More information

WebGIS WebGIS(Web Geographic Information System) Web WebGIS Web WebGIS API(Application Program Interface) Web Google GoogleMaps API WebGISJSGI i

WebGIS WebGIS(Web Geographic Information System) Web WebGIS Web WebGIS API(Application Program Interface) Web Google GoogleMaps API WebGISJSGI i 18 WebGIS A Sharing of Geographic Information for WebGIS 1095303 2007 3 9 WebGIS WebGIS(Web Geographic Information System) Web WebGIS Web WebGIS API(Application Program Interface) Web Google GoogleMaps

More information

JavaScriptプログラミング入門

JavaScriptプログラミング入門 JavaScript 2015 8 15 1 2 1.1 JavaScript.................................. 2 1.2..................................... 3 1.3 if................................... 4 2 6 2.1.....................

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

経営論集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

What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私 ) ぜひ 名 前 を 覚 えていってくださ

What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私 ) ぜひ 名 前 を 覚 えていってくださ HeartRails APIs for MA5 ハートレイルズの 提 供 API について http://www.heartrails.com/ What 色 々な Web サービスを 提 供 している 会 社 です http://www.heartrails.com/ http://twitter.com/heartrails( 会 社 ) http://twitter.com/joraku( 私

More information

携帯電話でGoogle Mapsを使う

携帯電話でGoogle Mapsを使う PHPのファイルは UTF-8 BOMなしで 保 存 し www.cyaneum.orgのpublic_htmlに 置 く! テーマ 研 究 会 (04/28) Google Mapsを 使 う 政 策 情 報 学 部 渡 辺 恭 人 riho-m@cuc.ac.jp メーリングリスト riho-m-rg10@cuc.ac.jp 資 料 http://www.cuc.ac.jp/rg10/ 前 回

More information

(1) ,,,,, <> ( ) (/ ) (2) HTML5 (3) HTML (4) html (ja) (5) JavaScript CSS (6)

(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

あいち電子自治体ガイドライン(第1章)

あいち電子自治体ガイドライン(第1章) 1-1 HTML/XHTML 5 1-2 h 6 1-3 TITLE 7 1-4 8 1-5 9 1-6 10 1-7 11 1-8 12 2-1 13 2-2 14 2-3 15 2-4 16 2-5 17 2-6 18 2-7 19 2-8 20 3-1 21 3-2 22 3-3 23 3-4 24 3-5 25 3-6 4 26 3-7 27 3-8 28 - i - 4-1 29 4-2

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

コンピュータサイエンス 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

2 : Open Clip Art Library [4] 2 3 4 5 6 2. 2 2. 1 Microsoft Office PowerPoint Web PowerPoint 2 Yahoo! Web [5] SlideShare 2. 1. 1 Yahoo! Web Yahoo! Web

2 : Open Clip Art Library [4] 2 3 4 5 6 2. 2 2. 1 Microsoft Office PowerPoint Web PowerPoint 2 Yahoo! Web [5] SlideShare 2. 1. 1 Yahoo! Web Yahoo! Web DEWS2008 E4-4 606-8501 E-mail: {hsato,oyama,tanaka}@dl.kuis.kyoto-u.ac.jp.. Supporting the Selection of Images Based on Referential Semantics from Surrounding Information of the Image in Presentation Files

More information

Introduction to Information and Communication Technology (a)

Introduction to Information and Communication Technology (a) Introduction to Information and Communication Technology (a) 5 th week: 1.4 Transmission, exchange and evaluation of information Kazumasa Yamamoto Dept. Computer Science & Engineering Introduction to ICT(a)

More information

Web 1990,HTTP, HTML, URL XML HTML XHTML XML Web XMLSOAPWSDL ( ) Web2.0 Web XML+WebAPI 2 http://www.xmlconsortium.org/ http://www.amazon.co.jp/ 3

Web 1990,HTTP, HTML, URL XML HTML XHTML XML Web XMLSOAPWSDL ( ) Web2.0 Web XML+WebAPI 2 http://www.xmlconsortium.org/ http://www.amazon.co.jp/ 3 XML Consortium XMLSOAWeb2.0 1 Web 1990,HTTP, HTML, URL XML HTML XHTML XML Web XMLSOAPWSDL ( ) Web2.0 Web XML+WebAPI 2 http://www.xmlconsortium.org/ http://www.amazon.co.jp/ 3 Web

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

Web±ÜÍ÷¤Î³Ú¤·¤µ¤ò¹â¤á¤ëWeb¥Ú¡¼¥¸²ÄÄ°²½¥·¥¹¥Æ¥à

Web±ÜÍ÷¤Î³Ú¤·¤µ¤ò¹â¤á¤ëWeb¥Ú¡¼¥¸²ÄÄ°²½¥·¥¹¥Æ¥à Web Web 2 3 1 PC, Web, Web. Web,., Web., Web HTML, HTML., Web, Web.,,., Web, Web., Web, Web., Web, Web. 2 1 6 1.1.................................................. 6 1.2.................................................

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

全ゲ連発表黒

全ゲ連発表黒 mixiアプリをちょっとかじってみた 黒 河 優 介 発 表 者 について 全 ゲ 連 第 二 回 で Wiiリモコン 使 ったゲーム について 発 表 した 人 とある 会 社 の 社 蓄 でも ソーシャルアプリは 業 務 とは 全 く 関 係 な い mixiアプリとは? mixi 上 で 動 かすことが 出 来 るアプリです 全 画 面 はもちろん ガジェットのようにページ の 一 部 のみ

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

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

1 Web Web 1,,,, Web, Web : - i -

1 Web Web 1,,,, Web, Web : - i - 2015 Future University Hakodate 2015 System Information Science Practice Group Report Project Name Improvement of Environment for Learning Mathematics at FUN A ( ) Group Name GroupA (System) /Project No.

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

1 6 1.1........................................... 6 1.1.1 Wiki.............................. 6 1.1.2............................. 7 1.2..............

1 6 1.1........................................... 6 1.1.1 Wiki.............................. 6 1.1.2............................. 7 1.2.............. Wiki 1 6 1.1........................................... 6 1.1.1 Wiki.............................. 6 1.1.2............................. 7 1.2.......................................... 7 1.2.1................

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

何かの宣言。必要。

<!DOCTYPE html> 何かの宣言。必要。 プロジェクトI/II テーマH( 担 当 : 日 紫 喜 光 良 ) 目 標 地 図 上 に 情 報 を 表 示 することが 解 決 に 役 立 つような 問 題 を 見 つけることができる 問 題 解 決 のために 必 要 な 情 報 をグループメンバーと 協 力 して 収 集 できる Google の 地 図 (Google Maps) 上 に 情 報 を 表 示 することができる 地 理 情

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

Vol.61 No.1 June 2011

Vol.61 No.1 June 2011 Title 戦 時 期 における 陸 軍 委 託 研 究 に 関 する 資 料 Author(s) 沢 井, 実 Citation 大 阪 大 学 経 済 学. 61(1) P.150-P.161 Issue 2011-06 Date Text Version publisher URL http://hdl.handle.net/11094/51779 DOI Rights Osaka University

More information

1 Fig. 2 2 Fig. 1 Sample of tab UI 1 Fig. 1 that changes by clicking tab 5 2. Web HTML Adobe Flash Web ( 1 ) ( 2 ) ( 3 ) ( 4 ) ( 5 ) 3 Web 2.1 Web Goo

1 Fig. 2 2 Fig. 1 Sample of tab UI 1 Fig. 1 that changes by clicking tab 5 2. Web HTML Adobe Flash Web ( 1 ) ( 2 ) ( 3 ) ( 4 ) ( 5 ) 3 Web 2.1 Web Goo Web 1,a) 1,b) Web Web HTML Indicating Important Parts in Searched Web Pages by Retrieval Terms Yokoo Shunichi 1,a) Yoshiura Noriaki 1,b) Abstract: Users cannot always find retrieval terms immediately in

More information

第 11 問 画 像 が 多 いウェブページに HTTP1.0 でアクセスする 場 合 クライアント サーバ 間 のコネクション 数 も 多 くなる 第 12 問 新 しい VDT 作 業 における 労 働 衛 生 管 理 のためのガイドライン では 1. 対 象 となる 作 業 2. 作 業 環

第 11 問 画 像 が 多 いウェブページに HTTP1.0 でアクセスする 場 合 クライアント サーバ 間 のコネクション 数 も 多 くなる 第 12 問 新 しい VDT 作 業 における 労 働 衛 生 管 理 のためのガイドライン では 1. 対 象 となる 作 業 2. 作 業 環 1. 各 設 問 において 正 しいと 思 われるものは1を 間 違 っていると 思 われるものは 2 を 該 当 設 問 の 解 答 欄 に 記 せ 第 1 問 ウェブブラウザはユーザエージェントの 一 つである 第 2 問 イーサネットとは 1000BASE-T の 規 格 のみをさす 第 3 問 JavaScript で 記 述 されたコードは ウェブブラウザに 内 臓 されている Java

More information

インターネットマガジン1997年4月号―INTERNET magazine No.27

インターネットマガジン1997年4月号―INTERNET magazine No.27 3.0 4.0 A N S W E R1 A N S W E R2 308 INTERNET magazine 1997/4 1 jhttp://www.tucows.com/ A { text-ecoration: none; } INTERNET magazine

More information

2 1 6 2 7 2.1....................................... 7 2.2.......................................... 7 3 9 3.1.......................................

2 1 6 2 7 2.1....................................... 7 2.2.......................................... 7 3 9 3.1....................................... 23 Travel M 20 2 1 6 2 7 2.1....................................... 7 2.2.......................................... 7 3 9 3.1....................................... 9 3.1.1....................................

More information

WordPress Web

WordPress Web 0948011 1 1 1.............................. 1 2 WordPress....................... 2 3........................ 3 4........................ 4 2 4 1 Web......... 4 3 5 1 WordPress...................... 5 2..........................

More information

Z7000操作編_本文.indb

Z7000操作編_本文.indb 2 8 17 37Z700042Z7000 46Z7000 28 42 52 61 72 87 2 3 12 13 6 7 3 4 11 21 34 61 8 17 4 11 4 53 12 12 10 75 18 12 42 42 13 30 42 42 42 42 10 62 66 44 55 14 25 9 62 65 23 72 23 19 24 42 8 26 8 9 9 4 11 18

More information