osc2007-niigata - mashup
TRANSCRIPT
![Page 1: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/1.jpg)
風呂でのぼせないうちに作るマッシュアップ株式会社ワイズノット 増井 雄一郎
![Page 2: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/2.jpg)
![Page 3: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/3.jpg)
↓Macbook pro
![Page 4: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/4.jpg)
↓Macbook proNot 防水
![Page 5: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/5.jpg)
1時間以上かけてたらのぼせちゃう
![Page 6: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/6.jpg)
Rails使ったことある人
![Page 7: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/7.jpg)
自分でMashup
したことある人
![Page 8: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/8.jpg)
サイトなんかも公開しちゃってる人
![Page 9: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/9.jpg)
Mashupマッシュアップ
![Page 10: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/10.jpg)
音楽用語
![Page 11: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/11.jpg)
Remixとの違い
![Page 12: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/12.jpg)
曲をいじったりくっつけるのが
Remix
![Page 13: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/13.jpg)
歌詞はこっちメロディーはあっちで
Mashup
![Page 14: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/14.jpg)
繋げるだけじゃなく変えるだけじゃなく
![Page 15: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/15.jpg)
いろんなサイトをごちゃまぜにしちゃえ
![Page 16: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/16.jpg)
携帯と地図のMashup
![Page 18: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/18.jpg)
Mashupとは
![Page 19: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/19.jpg)
アプリケーションの再構築
![Page 20: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/20.jpg)
昔は無理矢理やっていた
![Page 21: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/21.jpg)
HTML解析して・・・
![Page 22: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/22.jpg)
自分で使う分には良いけど公開できない
![Page 23: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/23.jpg)
いまでもAPI公開してないサイトのデータを使うときにやる
![Page 24: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/24.jpg)
データが命!勝手に使わせるなんてもってのほか!
![Page 25: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/25.jpg)
でもWeb2.0時代はサイト側がある程度自由にデータや
システムを使わせてくれる
![Page 26: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/26.jpg)
なんで?
![Page 27: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/27.jpg)
ビジネスモデルの変化
![Page 28: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/28.jpg)
データを囲い込んでも換金する方法がない
![Page 29: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/29.jpg)
でもトラフィックは広告で金になる
![Page 30: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/30.jpg)
サイトに誘導するためデータを使おう
![Page 31: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/31.jpg)
その使わせてくれる口がWebAPI
![Page 32: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/32.jpg)
色々なWebAPIが提供されてきている
![Page 33: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/33.jpg)
大別すると3種類
![Page 34: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/34.jpg)
データ系
![Page 35: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/35.jpg)
RSSAmazon Web Service
Google検索ホットペッパーじゃらんnet
![Page 36: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/36.jpg)
データを公開
![Page 37: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/37.jpg)
ここの部分が多い
![Page 38: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/38.jpg)
既存にデータを持っているところは容易に展開できる為
![Page 39: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/39.jpg)
処理系
![Page 40: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/40.jpg)
スクリーンショット形態素解析
テキスト→MP3変換
![Page 41: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/41.jpg)
データを投げると何らかの処理をしてくれる
![Page 42: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/42.jpg)
表示系
![Page 43: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/43.jpg)
Google MapsNIFTY Timeline
べつやくメソッドAPI
![Page 44: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/44.jpg)
色々なデータを表示する基盤
![Page 45: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/45.jpg)
ほとんどのAPIはMVCのMやVに相当
![Page 46: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/46.jpg)
Controllerをどうやって作る?
![Page 47: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/47.jpg)
既存の手法と同じ
![Page 48: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/48.jpg)
PHP, Perl, Ruby, Java....
![Page 49: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/49.jpg)
ちゃんと作ると非同期処理が多く
PHPは不利
![Page 50: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/50.jpg)
そこで我らがRuby on Rails
![Page 51: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/51.jpg)
救世主
![Page 52: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/52.jpg)
さすがはWeb2.0系フレークワーク
![Page 53: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/53.jpg)
WebAPIを楽にするActiveResource
![Page 54: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/54.jpg)
Rails2.0から標準添付
![Page 55: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/55.jpg)
でもRails2.0がいつ出るかは謎
![Page 56: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/56.jpg)
しかしActiveResourceは
![Page 57: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/57.jpg)
Rails 対 Rails にしか使えない
![Page 58: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/58.jpg)
別の方法を考えよう
![Page 59: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/59.jpg)
さてMashupで何を作る?
![Page 60: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/60.jpg)
OSC-Doではblogでリクエストを
募って
![Page 61: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/61.jpg)
「北海道温泉マップ」
![Page 62: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/62.jpg)
じゃらんが温泉情報をWebAPIで公開
![Page 63: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/63.jpg)
これをマッピング
![Page 64: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/64.jpg)
なので新潟では
![Page 65: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/65.jpg)
「新潟温泉マップ」
![Page 66: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/66.jpg)
まずは温泉情報を持ってこよう
![Page 67: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/67.jpg)
APIのページを読む
![Page 69: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/69.jpg)
API使うには登録がいる
![Page 70: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/70.jpg)
APIキーをもらったらURLを叩くだけ
![Page 71: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/71.jpg)
http://jws.jalan.net/APICommon/OnsenSearch/V1/?
key=**********&l_area=010802&count=1&xml_ptn=1
![Page 72: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/72.jpg)
XMLで帰ってくる
![Page 73: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/73.jpg)
![Page 74: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/74.jpg)
これをプログラムでごにょごにょ・・・
![Page 75: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/75.jpg)
Railsを使えば一発!
![Page 76: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/76.jpg)
とは行かない・・・
![Page 77: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/77.jpg)
require 'net/http'require 'cgi'require 'rexml/document'
class Onsen attr_accessor :address, :name, :id
KEY = 'phe11375af71ba' URL = 'http://jws.jalan.net/APICommon/OnsenSearch/V1/?' def self.find(params) results = [] get(params).elements.each('Results/Onsen') do |el| results << Onsen.new(el.elements["OnsenID"].text, el.elements["OnsenName"].text, el.elements["OnsenAddress"].text) end results end
def self.url(params) params[:key] = KEY URI.parse(URL+((params.map { |key,value| "#{key}=#{CGI::escape(value.to_s)}"}).join('&'))) end
def self.get(params) REXML::Document.new(Net::HTTP.get(url(params))) end def initialize(id, name, address) @id, @name, @address = id, name, address endend
![Page 78: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/78.jpg)
これでAPIを使える
![Page 79: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/79.jpg)
ちょっと読めないよね
![Page 80: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/80.jpg)
詳細はWebで!
![Page 81: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/81.jpg)
新潟の温泉リストを取り出す
![Page 82: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/82.jpg)
irb> puts Onsen.find(:count => 10, :pref => '170000').map{|o| o.name}.join(',')=>平根崎温泉,秋津温泉,椎崎温泉,住吉温泉,潟上温泉,佐和田温泉,
八幡温泉,小木温泉,瀬波温泉,湯沢温泉 (荒川峡)
![Page 83: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/83.jpg)
このリストをGoogle Mapに入れる
![Page 84: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/84.jpg)
こっちはRubyのライブラリがある
![Page 85: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/85.jpg)
YM4R/GM
![Page 86: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/86.jpg)
GoogleMaps APIをRailsで使うライブラリ
![Page 87: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/87.jpg)
$ rails onsen -d sqlite3$ cd onsen$ script/plugin install \ svn://rubyforge.org/var/svn/ym4r/Plugins/GM/trunk/ym4r_gm$ ./script/generate controller onsen index
![Page 88: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/88.jpg)
さっきのOnsenクラスはlib/onsen.rbに保存
![Page 89: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/89.jpg)
class OnsenController < ApplicationController def index @map = GMap.new("map_div") @map.control_init :large_map => true, :map_type => true @map.center_zoom_init([37.60988,138.872681], 10) endend
![Page 90: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/90.jpg)
<html><head><%= GMap.header %><%= @map.to_html %></head><body><%= @map.div(:width => 600, :height => 400) %></body></html>
![Page 91: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/91.jpg)
これだけで地図表示
![Page 92: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/92.jpg)
![Page 93: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/93.jpg)
これにじゃらんでゲットした温泉をピンで打つ
![Page 94: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/94.jpg)
Google Mapsでピンを打つには緯度経度が
必要
![Page 95: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/95.jpg)
じゃらんAPIでは住所しか持ってない
![Page 96: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/96.jpg)
そこでジオコーディング
![Page 97: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/97.jpg)
住所から緯度経度を割り出す
![Page 98: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/98.jpg)
これもGoogle Maps API
の一つ
![Page 99: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/99.jpg)
YM4R/GMを使えばそれも楽々
![Page 100: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/100.jpg)
新潟の緯度経度を調べる
![Page 101: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/101.jpg)
irb> nigata = Geocoding.get(‘新潟駅’)
irb> nigata.first.latlon=> [37.912016, 139.061847]
![Page 102: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/102.jpg)
Onsenクラスにコレをくっつける
![Page 103: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/103.jpg)
class Onsen ~中略~ def latlon Geocoding.get(@address).first.latlon endend
![Page 104: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/104.jpg)
でもGoogleのジオコーディングは郡に対応していない
![Page 105: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/105.jpg)
正規表現で「郡」を取り除けば大丈夫
![Page 106: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/106.jpg)
class Onsen ~中略~ def latlon Geocoding.get(@address.gsub(/(北海道|府|県).{1,5}郡/,'¥¥1')).first.latlon
endend
![Page 107: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/107.jpg)
これで2つのAPIをMashup
![Page 108: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/108.jpg)
これを地図に放り込む
![Page 109: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/109.jpg)
class OnsenController < ApplicationController def index @map = GMap.new("map_div") @map.control_init(:large_map => true, :map_type => true) @map.center_zoom_init([37.60988,138.872681], 8) return Onsen.find(:count => 30, :pref => '170000').each do |o| begin marker = GMarker.new( o.latlon, :title => o.name, :info_window => render_to_string( :partial => 'point', :locals => { :onsen => o }) ) @map.overlay_init(marker) rescue end end end
![Page 110: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/110.jpg)
吹き出しのHTMLも
![Page 111: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/111.jpg)
<div><strong><%=h onsen.name %></strong></div><div><%=h onsen.address %></div>
![Page 112: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/112.jpg)
できあがり
![Page 113: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/113.jpg)
![Page 114: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/114.jpg)
つまらない・・・
![Page 115: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/115.jpg)
温泉の写真も貼ろう
![Page 116: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/116.jpg)
写真と言えばFlickr
![Page 117: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/117.jpg)
![Page 118: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/118.jpg)
もちろんWebAPI公開
![Page 119: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/119.jpg)
Ruby用バインドも複数公開
![Page 120: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/120.jpg)
でも温泉の写真は全然ヒットしない
![Page 121: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/121.jpg)
ほかに写真を公開しているAPIは・・・
![Page 122: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/122.jpg)
![Page 123: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/123.jpg)
Yahoo画像検索Webサービス
![Page 124: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/124.jpg)
![Page 125: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/125.jpg)
キーワードの写真が取得できる
![Page 126: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/126.jpg)
すばらしい!
![Page 127: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/127.jpg)
使い方も簡単
![Page 128: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/128.jpg)
http://api.search.yahoo.co.jp/ImageSearchService/V1/
imageSearch?appid=YahooDemo&results=1&
query=湯の平温泉
![Page 129: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/129.jpg)
![Page 130: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/130.jpg)
これもOnsenクラスにいれちゃう
![Page 131: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/131.jpg)
class Onsen ~中略~ def photo Onsen.get({ :appid=>'onsen', :query=>@name.gsub(/ ¥(.*/,''),
:results => 1}, "http://api.searc........rch?" ).elements['/ResultSet/Result/Thumbnail/Url'].text endend
![Page 132: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/132.jpg)
これで写真も取得できちゃう
![Page 133: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/133.jpg)
最後にこれをマッピング
![Page 134: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/134.jpg)
<div><strong><%=h onsen.name %></strong></div><div><%=h onsen.address %></div><div style="height: 120px"><%= image_tag(onsen.photo) rescue 'No photo' %></div>
![Page 135: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/135.jpg)
これで吹き出しに写真が出た
![Page 136: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/136.jpg)
![Page 137: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/137.jpg)
![Page 138: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/138.jpg)
写真合ってない・・・
![Page 139: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/139.jpg)
ひとまずこれで完成
![Page 140: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/140.jpg)
不満点が沢山
![Page 141: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/141.jpg)
遅い!
![Page 142: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/142.jpg)
キャッシュで改善
![Page 143: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/143.jpg)
新潟以外は?
![Page 144: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/144.jpg)
選べるようにしましょう
![Page 145: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/145.jpg)
コメントとかは?
![Page 146: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/146.jpg)
acts_as_commentableで
![Page 147: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/147.jpg)
携帯は?
![Page 148: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/148.jpg)
jpmobileで
![Page 149: OSC2007-niigata - mashup](https://reader038.vdocuments.site/reader038/viewer/2022102700/55530430b4c9054e3f8b4854/html5/thumbnails/149.jpg)
これを改善して自分温泉地図を作りませんか?