Hatena::Groupkdri

KazusaAPI開発日誌 このページをアンテナに追加 RSSフィード

2008-03-29

Javascriptのサムネイルビューア Highslide JSをつかってみる。

|  Javascriptのサムネイルビューア [http://vikjavev.no/highslide/:title=Highslide JS]をつかってみる。 - KazusaAPI開発日誌 を含むブックマーク はてなブックマーク -  Javascriptのサムネイルビューア [http://vikjavev.no/highslide/:title=Highslide JS]をつかってみる。 - KazusaAPI開発日誌  Javascriptのサムネイルビューア [http://vikjavev.no/highslide/:title=Highslide JS]をつかってみる。 - KazusaAPI開発日誌 のブックマークコメント

screenshot

no title

Highslide JS はサムネイル画像とHTMLのポップアップをページにつけることができる。ポップアップはワンクリックで消したり、移動することが可能。

ポップアップの中身は、静的なもの、AJAXで取得するもの、iframe を使うもの、flash をつかうものなどが扱える。

つかう

ダウンロードしたソースファイル(highslide-3.3.12.zip)のなかにコメント付きのサンプルコードがあるので、それを読む。highslide-3.3.12/index.html にサンプルコードへのリンクがある。

Highslide JS core - White 10px border and drop shadow

サムネイル画像のビューアを使うのに必要なコードをみてみる。必要なコードは(1)ライブラリの読み込み、(2)ページワイドの設定、(3)CSS、(4)サムネイル、(5)キャプションです。

ライブラリの読み込み。

<script type="text/javascript" src="highslide/highslide.js"></script> 

画像ファイルのパス指定。ほかにページワイドな設定があればここでする。

<script type="text/javascript">    
    hs.graphicsDir = 'highslide/graphics/';
</script> 

ポップアップがロード中(Loading...)のまま止まるときは、画像ファイルのパス指定がまちがっていることがある。

CSS設定。これは別ファイルとして、インクルードすることも可。

 
a.highslide-full-expand {
    background: url(highslide/graphics/fullexpand.gif) no-repeat;
    display: block;
    margin: 0 10px 10px 0;
    width: 34px;
    height: 34px;
}
 
/* These must always be last */
.highslide-display-block {
    display: block;
}
.highslide-display-none {
    display: none;
}
</style>

サムネイル。

<a href="images/full-image.jpg" class="highslide" 
   onclick="return hs.expand(this)"> 
  <img src="images/thumbnail.jpg" 
       alt="Highslide JS" title="Click to enlarge" 
       height="120" width="107" />
</a>

ポップアップのキャプション。

<div class="highslide-caption">This caption can be styled using CSS.</div>

.highslide の次の .highslide-caption が利用される。

Highslide HTML extension - Inline content

HTML のポップアップを使うのに必要なコードをみてみる。

まとめ

ポップアップする機能を実現するにはいろいろなライブラリがすでに存在しているところで、Highslide JS に注目したのは、ポップアップを自由に移動して配置することが出来る点である。

2008-03-13

DAS サーバから Feature をとりだす(取り出すだけ)

|  DAS サーバから Feature をとりだす(取り出すだけ) - KazusaAPI開発日誌 を含むブックマーク はてなブックマーク -  DAS サーバから Feature をとりだす(取り出すだけ) - KazusaAPI開発日誌  DAS サーバから Feature をとりだす(取り出すだけ) - KazusaAPI開発日誌 のブックマークコメント

Processing から DAS サーバにアクセスしてゲノム座標情報を取得してみます。ここでは、localhost で動いている gbrowse 付属の DAS サーバにはいっている TAIR7 のデータをつかっています。

HTTP GET

DAS サーバへのアクセスは HTTP の GET で、XML 文章がかえります。Processing の XML ライブラリは引数に url を指定できるので、Network Client クラス等は不要です。

  url = "http://localhost/cgi-bin/das/arabidopsis/features?segment=Chr1:1,100";
  gff = new XMLElement(this, url); 

XML の処理

XML の要素にはタグ名の階層でアクセスできます。features コマンドからかえってくる XML 文章は次のようなものです。

<DASGFF>
  <GFF HREF="http://localhost/cgi-bin/das/arabidopsis/features?segment=Chr1%3A1%2C100" VERSION="1.01">
    <SEGMENT ID="Chr1" VERSION="1.0" STOP="100" START="1">
      <FEATURE ID="TEL1N" LABEL="TEL1N">
        <TYPE ID="BAC_cloned_genomic_insert:TAIR" CATEGORY="Assembly">BAC_cloned_genomic_insert:TAIR</TYPE>
        <METHOD ID="BAC_cloned_genomic_insert">BAC_cloned_genomic_insert</METHOD>
        <START>1</START>
        <END>444</END>
        <SCORE>-</SCORE>
        <ORIENTATION>+</ORIENTATION>
        <PHASE>0</PHASE>
        <LINK HREF="http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=TEL1N;class=Sequence;ref=Chr1;start=1;end=444">BAC_cloned_genomic_insert:TAIR</LINK>
        <GROUP ID="TEL1N"/>
      </FEATURE>

FEATURE の階層のタグを複数とりだすには、XMLElement::getChildren() メソッドを使用します。

  XMLElement[] features = gff.getChildren("GFF/SEGMENT/FEATURE");

FEATURE タグの ID の値(ここでは "TEL1N")をとりだすには、XMLElement::getStringAttribute() メソッドを使用します。

    println("    ID: " + features[i].getStringAttribute("ID"));

START タグの中身(ここでは 1)をとりだすには、XMLElement::getContent() メソッドを使用します。

    println(" " + features[i].getChild("START").getContent());  

プログラム

import processing.xml.*;

/**
 * DAS HTTP Client. 
 */

String url;
XMLElement gff;

void setup() {
  size(500, 400);
  background(50);
  fill(200);
  url = "http://localhost/cgi-bin/das/arabidopsis/features?segment=Chr1:1,100";
  gff = new XMLElement(this, url); 

  XMLElement seg = gff.getChild("GFF/SEGMENT/FEATURE");
  println(seg);
  
  XMLElement[] features = gff.getChildren("GFF/SEGMENT/FEATURE");
  println("Length: " + features.length);

  for (int i = 0; i < features.length; i++) {
    println("i: " + i);
    println(features[i]);
    println("FEATURE:");
    println("    ID: " + features[i].getStringAttribute("ID"));
    println(" LABEL: " + features[i].getStringAttribute("LABEL"));
    
    println("TYPE:");
    println("       ID: " + features[i].getChild("TYPE").getAttribute("ID"));
    println(" CATEGORY: " + features[i].getChild("TYPE").getAttribute("CATEGORY"));
    println(" " + features[i].getChild("TYPE").getContent());
      
    println("METHOD:");
    println("       ID: " + features[i].getChild("METHOD").getAttribute("ID"));
    println(" " + features[i].getChild("METHOD").getContent());
  
    println("START:");
    println(" " + features[i].getChild("START").getContent());  

    println("END:");
    println("E: " + features[i].getChild("END").getContent());  

    println("SCORE:");
    println(" " + features[i].getChild("SCORE").getContent());  
    
    println("ORIENTATION:");
    println(" " + features[i].getChild("ORIENTATION").getContent());  
    
    println("PHASE:");
    println(" " + features[i].getChild("PHASE").getContent());  

    println("LINK:");
    println(" HREF: " + features[i].getChild("LINK").getAttribute("HREF"));
    println(" " + features[i].getChild("LINK").getContent()); 
    
    println("GROUP:");
    println(" ID: " + features[i].getChild("GROUP").getAttribute("ID"));
    println(" " + features[i].getChild("GROUP").getContent());  
  }

}

void draw() {
}

出力

<FEATURE ID="TEL1N" LABEL="TEL1N"><TYPE ID="BAC_cloned_genomic_insert:TAIR" CATEGORY="Assembly">BAC_cloned_genomic_insert:TAIR</TYPE><METHOD ID="BAC_cloned_genomic_insert">BAC_cloned_genomic_insert</METHOD><START>1</START><END>444</END><SCORE>-</SCORE><ORIENTATION>+</ORIENTATION><PHASE>0</PHASE><LINK HREF="http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=TEL1N;class=Sequence;ref=Chr1;start=1;end=444">BAC_cloned_genomic_insert:TAIR</LINK><GROUP ID="TEL1N"/></FEATURE>
Length: 4
i: 0
<FEATURE ID="TEL1N" LABEL="TEL1N"><TYPE ID="BAC_cloned_genomic_insert:TAIR" CATEGORY="Assembly">BAC_cloned_genomic_insert:TAIR</TYPE><METHOD ID="BAC_cloned_genomic_insert">BAC_cloned_genomic_insert</METHOD><START>1</START><END>444</END><SCORE>-</SCORE><ORIENTATION>+</ORIENTATION><PHASE>0</PHASE><LINK HREF="http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=TEL1N;class=Sequence;ref=Chr1;start=1;end=444">BAC_cloned_genomic_insert:TAIR</LINK><GROUP ID="TEL1N"/></FEATURE>
FEATURE:
    ID: TEL1N
 LABEL: TEL1N
TYPE:
       ID: BAC_cloned_genomic_insert:TAIR
 CATEGORY: Assembly
 BAC_cloned_genomic_insert:TAIR
METHOD:
       ID: BAC_cloned_genomic_insert
 BAC_cloned_genomic_insert
START:
 1
END:
E: 444
SCORE:
 -
ORIENTATION:
 +
PHASE:
 0
LINK:
 HREF: http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=TEL1N;class=Sequence;ref=Chr1;start=1;end=444
 BAC_cloned_genomic_insert:TAIR
GROUP:
 ID: TEL1N
 
i: 1
<FEATURE ID="SALK_001127" LABEL="SALK_001127"><TYPE ID="transposable_element_insertion_site:TAIR7" CATEGORY="Variation">transposable_element_insertion_site:TAIR7</TYPE><METHOD ID="transposable_element_insertion_site">transposable_element_insertion_site</METHOD><START>1</START><END>1</END><SCORE>-</SCORE><ORIENTATION>+</ORIENTATION><PHASE>0</PHASE><LINK HREF="http://www.arabidopsis.org/servlets/TairObject?name=SALK_001127type=polyallele">transposable_element_insertion_site:TAIR7</LINK><GROUP ID="SALK_001127"/></FEATURE>
FEATURE:
    ID: SALK_001127
 LABEL: SALK_001127
TYPE:
       ID: transposable_element_insertion_site:TAIR7
 CATEGORY: Variation
 transposable_element_insertion_site:TAIR7
METHOD:
       ID: transposable_element_insertion_site
 transposable_element_insertion_site
START:
 1
END:
E: 1
SCORE:
 -
ORIENTATION:
 +
PHASE:
 0
LINK:
 HREF: http://www.arabidopsis.org/servlets/TairObject?name=SALK_001127type=polyallele
 transposable_element_insertion_site:TAIR7
GROUP:
 ID: SALK_001127
 
i: 2
<FEATURE ID="WISCDSLOX354D10" LABEL="WISCDSLOX354D10"><TYPE ID="transposable_element_insertion_site:TAIR7" CATEGORY="Variation">transposable_element_insertion_site:TAIR7</TYPE><METHOD ID="transposable_element_insertion_site">transposable_element_insertion_site</METHOD><START>2</START><END>2</END><SCORE>-</SCORE><ORIENTATION>+</ORIENTATION><PHASE>0</PHASE><LINK HREF="http://www.arabidopsis.org/servlets/TairObject?name=WISCDSLOX354D10type=polyallele">transposable_element_insertion_site:TAIR7</LINK><GROUP ID="WISCDSLOX354D10"/></FEATURE>
FEATURE:
    ID: WISCDSLOX354D10
 LABEL: WISCDSLOX354D10
TYPE:
       ID: transposable_element_insertion_site:TAIR7
 CATEGORY: Variation
 transposable_element_insertion_site:TAIR7
METHOD:
       ID: transposable_element_insertion_site
 transposable_element_insertion_site
START:
 2
END:
E: 2
SCORE:
 -
ORIENTATION:
 +
PHASE:
 0
LINK:
 HREF: http://www.arabidopsis.org/servlets/TairObject?name=WISCDSLOX354D10type=polyallele
 transposable_element_insertion_site:TAIR7
GROUP:
 ID: WISCDSLOX354D10
 
i: 3
<FEATURE ID="Chr1" LABEL="Chr1"><TYPE ID="chromosome:TAIR7" CATEGORY="chromosome">chromosome:TAIR7</TYPE><METHOD ID="chromosome">chromosome</METHOD><START>1</START><END>30432563</END><SCORE>-</SCORE><ORIENTATION>+</ORIENTATION><PHASE>0</PHASE><LINK HREF="http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=Chr1;class=Sequence;ref=Chr1;start=1;end=30432563">chromosome:TAIR7</LINK><GROUP ID="Chr1"/></FEATURE>
FEATURE:
    ID: Chr1
 LABEL: Chr1
TYPE:
       ID: chromosome:TAIR7
 CATEGORY: chromosome
 chromosome:TAIR7
METHOD:
       ID: chromosome
 chromosome
START:
 1
END:
E: 30432563
SCORE:
 -
ORIENTATION:
 +
PHASE:
 0
LINK:
 HREF: http://localhost/cgi-bin/gbrowse_details/arabidopsis?name=Chr1;class=Sequence;ref=Chr1;start=1;end=30432563
 chromosome:TAIR7
GROUP:
 ID: Chr1

2008-03-11

Entrez Gene に位置から遺伝子を検索する機能が追加された

Entrez Gene に位置から遺伝子を検索する機能が追加された - KazusaAPI開発日誌 を含むブックマーク はてなブックマーク - Entrez Gene に位置から遺伝子を検索する機能が追加された - KazusaAPI開発日誌 Entrez Gene に位置から遺伝子を検索する機能が追加された - KazusaAPI開発日誌 のブックマークコメント

Home - PubMed - NCBI の Limits タブから染色体の範囲とさまざまなフィルターで遺伝子の絞り込み検索ができるようになりました。

screenshot

Entrez Gene の Limits by Chromosomal Region 検索ボックスには、つぎのようなクエリを入力できます。

zinc finger[All Fields] AND (NC_000019[nucl_accn] AND 40000000[CHRPOS]:50000000[CHRPOS])

この問い合わせと同等な URL は次のとおりです。

http://www.ncbi.nlm.nih.gov/sites/entrez?Db=gene&Cmd=DetailsSearch&Term=zinc+finger%5BAll+Fields%5D+AND+(NC_000019%5Bnucl_accn%5D+AND+000040000000%5BCHRPOS%5D+%3A+000050000000%5BCHRPOS%5D)

Term=の値が検索ボックスの文字列と同値になっています。

2008-03-10

ProServer を CPAN からインストールする

|  ProServer を CPAN からインストールする - KazusaAPI開発日誌 を含むブックマーク はてなブックマーク -  ProServer を CPAN からインストールする - KazusaAPI開発日誌  ProServer を CPAN からインストールする - KazusaAPI開発日誌 のブックマークコメント

ProServerPerl で書かれた DAS サーバです。ここでは Mac OS X 10.5 にインストールする手順を説明します。

ここでは、perlMacPorts の /opt/local/bin/perl とします。

CPAN からインストールする

最初に、ProServer の入っているモジュール名をしらべます。

$ /opt/local/bin/perl -MCPAN -e shell
...
cpan[5]> m /ProServer/
Module    Bio::Das::ProServer    (RPETTETT/Bio-Das-ProServer-2.070.tar.gz)
Module    Bio::Das::ProServer::Config (LDS/Bio-Das-1.02.tar.gz)
...

RPETTETT/Bio-Das-ProServer-2.070.tar.gz と LDS/Bio-Das-1.02.tar.gz がマッチしています。

cpan[6]> install RPETTETT/Bio-Das-ProServer-2.070.tar.gz
...

特に問題もなくインストールは完了しました。

man ページが /opt/local/share/man/man3/Bio::Das::ProServer などにインストールされています。perldoc Bio::Das::ProServer のようにするとドキュメントが読めます。

サーバスクリプトの準備をする

proserver のサーバスクリプトがインストールされていないようなので、~/.cpan/build/Bio-Das-ProServer-2.070-*/eg の中のファイルをコピーしてつかってみます。

サーバのファイル構成

  • eg/proserver -- サーバ本体
  • eg/proserver.ini -- 設定ファイル

ここでは、これらを ~/Desktop にコピーします。

$ sudo rsync -a ~/.cpan/build/Bio-Das-ProServer-2.070-vReRo1/eg ~/Desktop/
Password:
$ cd ~/Desktop/eg
$ ls 
proserver			proserver.guest207.wtgc.org.log	proserver.pagoda.psyphi.net.err
proserver.cgi			proserver.guest207.wtgc.org.pid	proserver.pagoda.psyphi.net.log
proserver.guest207.wtgc.org.err	proserver.ini			proserver.pagoda.psyphi.net.pid

サーバの起動をする

proserver はウェブサーバ機能をもっているので、cgi としてではなく DAS サーバを構築することができます。

$ /opt/local/bin/perl proserver -x -c proserver.ini 
##############################################################################
#  ProServer DAS Server v2.070 (c) GRL 2007                                  #
#  http://www.sanger.ac.uk/proserver/                                        #
#                                                                            #
#  Please cite:                                                              #
#   ProServer: A simple, extensible Perl DAS server.                         #
#   Finn RD, Stalker JW, Jackson DK, Kulesha E, Clements J, Pettett R.       #
#   Bioinformatics 2007; doi: 10.1093/bioinformatics/btl650; PMID: 17237073  #
##############################################################################

hostname             => localhost
port                 => 9000
response_hostname    => das.example.com
response_port        => 80
response_protocol    => 
response_baseuri     => 
interface            => 
prefork              => 
maxclients           => 10
pidfile              => 
logfile              => 
ensemblhome          => 
oraclehome           => 
bioperlhome          => 
coordshome           => 
styleshome           => 
http_proxy           => 
serverroot           => 
maintainer           => das@example.com
logformat            => 
Configuring Adaptor mysimple on
Configuring Adaptor gensat off
Configuring Adaptor swissprot off
Configuring Adaptor image off
Configuring Adaptor interpro off
Configuring Adaptor ncbi33 off
Configuring Adaptor myembl off
Configuring Adaptor hydra001 off
Configuring Adaptor pfamAlign off
Configuring Adaptor pdbStructure off
Writing pidfile proserver.meta.local.pid
Server 20348 has begun listening on :9000
 at /opt/local/lib/perl5/site_perl/5.8.8/POE/Session.pm line 465
Exited fork at /opt/local/lib/perl5/site_perl/5.8.8/POE/Session.pm line 465

http://localhost:9000/das をブラウザで開くと Welcome to ProServer v2.070 というページがみえるはず。見えないときはどこかおかしいです。

[mysimple] という Source のリンクがみえていますが、これは正常には利用できません。proserver.ini の [mysimple] の state = on を state = off にして消しましょう。

変更前

[mysimple]
adaptor       = simple
state         = on
transport     = file
;mapmaster     = http://foo.com/mysimple_reference
description   = Simple example source
doc_href      = http://my.homepage.com
filename      = /path/to/genelist.txt
baseurl       = http://www.example.org/datascript?id=
type          = gene
feature_query = field0 lceq "%s"
unique        = 1
; Coordinate system and test range:
coordinates   = Ensembl,Gene_ID -> ENSG00000139618

変更後

[mysimple]
adaptor       = simple
state         = off
transport     = file
;mapmaster     = http://foo.com/mysimple_reference
description   = Simple example source
doc_href      = http://my.homepage.com
filename      = /path/to/genelist.txt
baseurl       = http://www.example.org/datascript?id=
type          = gene
feature_query = field0 lceq "%s"
unique        = 1
; Coordinate system and test range:
coordinates   = Ensembl,Gene_ID -> ENSG00000139618

このあとは、no title を実際にやってみるとよいでしょう。



ProServer の SVN HEAD をインストールする

|  ProServer の SVN HEAD をインストールする - KazusaAPI開発日誌 を含むブックマーク はてなブックマーク -  ProServer の SVN HEAD をインストールする - KazusaAPI開発日誌  ProServer の SVN HEAD をインストールする - KazusaAPI開発日誌 のブックマークコメント

screenshot

ソースは http://sf.net/projects/proserver から取得できます。つぎのレポジトリにもあります。SVN には最新のコードがありますが、拡張モジュールについてはまだ CVS にしかないものもあるようです。

依存モジュールは次の通りです。

  1. Perl (>5.6.1)
  2. DBI
  3. Getopt::Long
  4. POSIX
  5. Sys::Hostname
  6. CGI
  7. POE
  8. HTTP::Request
  9. HTTP::Response
  10. Config::InFiles
  11. Compress::Zlib

ソースの取得

$ mkdir ProServer
$ cd ProServer
$ svn co https://proserver.svn.sf.net/svnroot/proserver/trunk
...
Checked out revision 425.
$ cd trunk
$ ls
Changes		README		eg/		stylesheets/
MANIFEST	coordinates/	homepages/	t/
Makefile.PL	doc/		lib/

とりあえずビルド

$ /opt/local/bin/perl Makefile.PL 
Warning: prerequisite Bio::EnsEMBL::DBSQL::DBAdaptor 0 not found.
Warning: prerequisite Bio::EnsEMBL::Registry 0 not found.
Warning: prerequisite Bio::Pfam::Structure::Chainset 0 not found.
Warning: prerequisite Bio::SeqIO 1.0050021 not found. We have unknown version.
Writing Makefile for Bio::Das::ProServer

いろいろインストールする必要があるようです。このマシンには gbrowse 1.69 が既にインストールされているので、これくらいですが、素の Mac OS X の場合はさらに多くのモジュールをインストールする必要があるようです。。

それぞれのモジュールがなにに依存しているのかが Makefile.PL のコメントに記載されいていました。

30     'Bio::SeqIO'                     => 1.0050021, # Optional, for Transpotr::bioseqio
31     'Bio::EnsEMBL::DBSQL::DBAdaptor' => 0,         # Optional, for SourceAdaptor::ensembl
32     'Bio::EnsEMBL::Registry'         => 0,         # Optional, for SourceAdaptor::ensembl
33     'Bio::Pfam::Structure::Chainset' => 0,         # Optional, for Transport::pdbStructure

Optional なのでとりあえずここでは放置します。

なお、Bio::EnsEMBLhttp://www.ensembl.org/info/using/api/api_installation.html からインストールできるはずです。試してはいない。

ビルド

$ /opt/local/bin/perl Makefile.PL
$ make

サーバの起動

Bio-Das-ProServer を事前にインストールしているので、モジュールのパスを指定して起動します。

$ /opt/local/bin/perl -Ilib eg/proserver -x -c eg/proserver.ini 

つづく