Logo
  • DoRubyとは
  • お問い合わせ
  • Ruby/Rails
  • Web開発
  • Webマーケティング
  • アピリッツ
  • ライフハック
  • ゲーム制作/開発
  • アプリ開発
  • 新しいカテゴリ
  • Railsの小技
  • Rubyの小技
  • Gemの紹介
  • ActiveRecord
  • 初心者向け
  • Java/Scalaテク
  • Unixのあれこれ
  • データベース
  • スマホ開発
  • HTML/CSS/JavaScript
  • デザイン製作
  • インフラ
  • クラウド
  • セキュリティ
  • エディタ
  • バージョン管理
  • その他
  • python
  • アクセス解析
  • Googleアナリティクス
  • Googleデータスタジオ
  • Web広告
  • SEO
  • UI/UX
  • ソーシャルメディア
  • EC開発
  • Webシステム開発
  • コンサルティング
  • Webデザイン
  • ブロックチェーン
  • ゲーム紹介
  • アプリ紹介
  • ASP
  • 風景
  • パソコン
  • ツール
  • ガジェット
  • 仕事術
  • 健康
  • 生活
  • 書評
  • Excel(エクセル)
  • PowerPoint(パワーポイント)
  • ゲームプランニング
  • SpriteStudio
  • マスターデータ入力/作成
  • Unity
  • キャラクターデザイン
  • ゲームシナリオ
  • レベルデザイン
  • ゲーム分析
  • 3DCG
  • イラスト制作
  • CG/アニメーション
      1. ホーム
      2. Ruby/Rails
      3. Rubyの小技
      4. アニメ名探偵コナンの新一が出てる回だけを見たい
      • 2017-06-28
        • カテゴリ:
        • Rubyの小技

      アニメ名探偵コナンの新一が出てる回だけを見たい

      499f3988790a26e98bbea3374e859164

      初投稿、新卒のいくたです。よろしくお願いします。
      新一くんの声が好きなので、そればっかり見たいのです。
      バーローなのです。

      準備するもの

      • Ruby(2.1.0)
      • gem: open-uri
      • gem: Nokogiri
      • アニメ各話の情報源

      実装の概要

      今回は、名探偵コナンの非公式ファンサイト「名探偵コナン応援サイト 毛利小五郎探偵事務所」から過去のアニメ各話の情報をとってきます。

      とってきたデータをrubyのgemであるNokogiriでスクレイピング(解析)します。
      ノコギリでギコギコ切って、必要なところ(新一くん登場回)だけを表示させる。
      ざっくり言うとそんなイメージです。

      コナン…ノコギリ…バラバラ死体…
      なんだか事件の匂いがしますね。

      webページの情報をとってくる

      試しに以下のページをとってきて表示してみます。
      名探偵コナン 事件データ・1996年度(TVアニメ)

      # shinichi.rb
      
      require 'open-uri' # open-uriライブラリを読み込みます
      
      url = 'http://conan.aga-search.com/anime/1996/'
      html = open(url).read # open-uriのおかげでURL先のデータを普通のファイルと同様に扱えます
      puts html
      
      

      実行結果

      $ ruby shinichi.rb 
      <!DOCTYPE html>
      <html lang="ja">
      <head>
      <meta charset="UTF-8">
      <title>名探偵コナン 事件データ・1996年度(TVアニメ)</title>
      
      (省略)
      
      

      Webページがhtmlの形式でとってこられました。

      Nokogiri の使い方

      表の各話の登場人物の項目に着目して、'新一'を含む行だけを抜き出します。

      # shinichi.rb
      
      require 'open-uri'
      require 'nokogiri'
      
      url = 'http://conan.aga-search.com/anime/1996/'
      html = open(url).read
      
      doc = Nokogiri::HTML.parse(html)
      trs = doc.xpath('//*[@id="leftpane"]/table[2]/tbody/tr[contains(.,'新一')]')
      
      

      今回の肝となる、'新一'を含む行だけ抜き出す処理を見ていきましょう。

      doc.xpath('//*[@id="leftpane"]/table[2]/tbody/tr[contains(.,'新一')]')
      

      XpathとはHTMLのような木構造の分岐点(ノード)を指し示す表現です。
      Xpathメソッドで抜き出すノードを指定できます。

      自分の好きなところでXpathを指定しようとすると、HTMLを見てidやらタグやらを確認することになります。
      これが正直めんどくさいんです…

      が!実はXpathを指定する複雑なパターンを自分で考えなくても、簡単に好きな要素を抽出できるんです!
      次は、Chromeを使ったXpathのパターン取得方法をご紹介しましょう。

      Xpathパターンはchromeが知っている

      chromeで解析したいwebページを開き、デベロッパーツールを表示させます。
      Elementsタブから抽出したい要素を右クリックして、Copy > Copy Xpath を選びます。

      copy_xpath.png

      図1 Xpathの指定パターン取得方法

      
      これでクリップボードに以下のようなXPathの指定パターンが入ります。

      //*[@id="leftpane"]/table[2]/tbody

      HTMLをいちいち読まなくても、特定の要素を指定するパターンをchromeが教えてくれるのです。便利!

      あとは抽出する条件を付け加えるだけです。
      今回は'新一'という文字列を含むtrタグの内容をとってくるので、以下のように条件を追加します。

      //*[@id="leftpane"]/table[2]/tbody/tr[contains(.,'新一')]

      こちらの記事にいろんな指定方法がまとめられます。
      詳しく知りたい方はどうぞ〜

      最後の仕上げ

      最後にとってきたデータの形を整えて出力します。

      # shinichi.rb
      
      require 'open-uri'
      require 'nokogiri'
      
      url = 'http://conan.aga-search.com/anime/1996/'
      html = open(url).read
      
      doc = Nokogiri::HTML.parse(html)
      trs = doc.xpath('//*[@id="leftpane"]/table[2]/tbody/tr[contains(.,'新一')]')
      
      # HTMLの解析結果をtr要素ごとに処理します
      trs.each do |tr|
        td = tr.xpath('./td') # tdタグを取り出します
        story_number = td[0].text # tdタグの1番目の要素のテキストを取り出します
        story_title = td[1].text  # tdタグの2番目の要素のテキストを取り出します
        puts "名探偵コナン 第#{story_number}話 #{story_title}"
      end
      

      実行結果

      $ ruby shinichi.rb 
      名探偵コナン 第1話 ジェットコースター殺人事件
      名探偵コナン 第2話 社長令嬢誘拐事件
      名探偵コナン 第3話 アイドル密室殺人事件
      名探偵コナン 第7話 月いちプレゼント脅迫事件
      名探偵コナン 第10話 プロサッカー選手脅迫事件
      名探偵コナン 第29話 コンピューター殺人事件
      名探偵コナン 第32話 コーヒーショップ殺人事件
      名探偵コナン 第33話 探偵団サバイバル事件
      名探偵コナン 第42話 カラオケボックス殺人事件
      

      新一くんが出ている回の話数とタイトルがとってこられました!

      このキーワードを元に動画配信サイトで検索すれば、新一くんが出ている回だけを永遠見続けることができますね。

      実は、新一くんと怪盗キッドは同じ声優さんが演じています。
      'キッド'を含む回も取って来られるように、条件を追加してもいいかもしれませんね。

      それでは、今日はこの辺で。
      読んでいただき、ありがとうございました。


      • 139 views
        • Tweet
        • このエントリーをはてなブックマークに追加

      この記事を書いた人
      D88ae1fd5017d8c9eea0842bae5866d6?default=mm&size=80
      ikuta555
      自分が理解できたことはわかりやすく説明できるはず!

      「いいね!」するとDoRubyの最新記事を受け取ることができます。

      Facebook

      Twitterから最新記事を受け取るならこちら

      Follow @doruby

      Feedlyから最新記事を受け取るならこちら

      follow us in feedly

      おすすめの記事
      • 348 views
      • 2015-10-01
      RailsのViewを自在にカスタマイズするための「Cosme」gem
      • 1,277 views
      • 2016-07-27
      リニューアルをしたDoRubyの3つの目的
      • 602 views
      • 2016-07-31
      carrierwaveとfogでRiak CSへの画像アップロードを実装する
      • 706 views
      • 2017-04-24
      アピリッツの新卒合宿2017

      カテゴリ

      Icon category 1Ruby/RailsList elementRailsの小技List elementRubyの小技List elementGemの紹介List elementActiveRecordList element初心者向けIcon category 4Web開発List elementJava/ScalaテクList elementUnixのあれこれList elementデータベースList elementスマホ開発List elementHTML/CSS/JavaScriptList elementデザイン製作List elementインフラList elementクラウドList elementセキュリティList elementエディタList elementバージョン管理List elementその他List elementpythonIcon category 5WebマーケティングList elementアクセス解析List elementGoogleアナリティクスList elementGoogleデータスタジオList elementWeb広告List elementSEOList elementUI/UXList elementソーシャルメディアIcon category 6アピリッツList elementEC開発List elementWebシステム開発List elementコンサルティングList elementWebデザインList elementブロックチェーンList elementゲーム紹介List elementアプリ紹介List elementASPList element風景Icon category 7ライフハックList elementパソコンList elementツールList elementガジェットList element仕事術List element健康List element生活List element書評List elementExcel(エクセル)List elementPowerPoint(パワーポイント)List elementゲーム制作/開発List elementゲームプランニングList elementSpriteStudioList elementマスターデータ入力/作成List elementUnityList elementキャラクターデザインList elementゲームシナリオList elementレベルデザインList elementゲーム分析List element3DCGList elementイラスト制作List elementCG/アニメーションList elementアプリ開発List element新しいカテゴリ

        人気の記事
        • 122 views
        • 2018-03-30
        極・メカニカルキーボード生活
        • 93 views
        • 2018-04-02
        メモ化トラップ
        • 68 views
        • 2018-03-26
        よくわからないで使っている英語の意味を知っとこう
        • 59 views
        • 2018-03-28
        Ruby×PyCallでTensorflowのMNISTチュートリアル
        • 54 views
        • 2018-04-02
        花粉症を軽減する方法
        最近の記事
        • 52 views
        • 2018-04-02
        心くすぐられる物理学ワード
        • 54 views
        • 2018-04-02
        花粉症を軽減する方法
        • 93 views
        • 2018-04-02
        メモ化トラップ
        • 39 views
        • 2018-04-02
        Unityのシェーダーについて
        • 41 views
        • 2018-03-30
        iOS/Android向けアプリの審査基準
        Facebook

          サイト情報
          • DoRubyとは
          • 株式会社アピリッツ

          企業情報
          • 会社概要
          • 採用情報
          • お問い合わせ

          ソーシャルアカウント
          • Facebook
          • Twitter
          サービス製品
          • コミュニティサイト
          • Android向け ECアプリ制作パッケージ「ポケコマ」
          • レコメンドASP
          • サイト内検索ASP「Advantage Search」
          • オープンソースECサイト構築パッケージ「エレコマ」

          • 受注・在庫・商品情報一元管理「モールコネクター」
          • セキュリティ診断サービス
          • 戦略的EC画面設計・制作サービス
          • Googleアナリティクスセミナー
          • アクセス解析コンサルティング
          • SEOコンサルティング

          Copyright © Appirits All Rights Reserved.