11月 22

WCG ← ブログパーツのお知らせ

メンバー(個人)向けのブログパーツをちょっと前に作りました。
ここで公開

明日からの3連休で、もう一度調整します。

※改修予定項目
 → スタイルシートの整理
 → 利用者同士の交流を助ける、ウェブリング機能の実装

ちなみに、ブログじゃなくても、タグを貼り付ければ動きますよ。

11月 16

GIMPでWeb素材を作ろう

完成画像

背景やボタンとしても使えそうで、今風(?)なWeb素材を作ってみましょう。
このような画像が作れるようになります。
文字を重ねると、ボタンらしくなりますね。
この解説で使用したバージョンは、2.2.4です。

実際に作ってみる

それでは、手順を追って作ってみましょう。

  1. 新規画像を作成します。
    手順1-1
    とりあえず、200×40というサイズで作ることにします。
    細かなサイズ指定は、慣れれば各自が判断できるでしょう。
    手順1-2
    問題なく作成されれば、こういうウィンドウが出現します。
  2. 基本とする色を塗ります。
    手順2
    ここでは、お気に入りの色である緑色を使いましたが、どのような色でもかまわないでしょう。
    ただし、濃い目のほうがいいかもしれません。
  3. グラデーションを塗るための準備をします。
    画像を全選択してください。
    手順3-1
    そして、選択領域の縮小で2px縮めます。
    手順3-2
    次に、角を丸めます。
    ここでは、半径を「50%」という設定で丸めます。
    好みで変更してもかまわないでしょう。
    手順3-3
    ここまで問題がなければ、このような状態になります。
  4. シャドウとなるグラデーションを塗ります。
    2枚目のレイヤーを作成します。
    手順4-1
    最上部になるように配置してください。
    手順4-2
    新規レイヤーへグラデーションで塗ります。
    「前景から透明に」を選択します。
    形状は「Linear」反復は「なし」です。
    手順4-3
    下から中間までを選択し、グラデーションで塗ります。
    ここまで問題がなければ、このような状態になります。
  5. ハイライトとなるグラデーションを塗ります。
    手順5-1
    減算選択で半分にします。
    手順5-2
    再び角を丸めます。
    半径を「100%」という設定で丸めます。
    もし、膨らむようなら設定値を「90%」などに減らします。
    手順5-3
    ここまで問題がなければ、このような状態になります。
  6. グラデーションの調整を行います。
    手順6-1
    グラデーションを塗ったレイヤーの透明度を「50%」に変更します。
    手順6-2
    うまくいけば、こういう状態になります。
    なんとなく、雰囲気が出てきたでしょうか。
    しかし、もうちょっと手を加えていきましょう。
  7. ボーダーを塗るための準備を行います。
    手順7
    画像全体を選択して、それから2px縮小します。
    選択領域を反転しておきます。
    今回、角は丸めません。
  8. ボーダーを塗ります。
    この手順は、一気に進めてしまいます。
    3枚目のレイヤーを作成します。
    手順8-1
    最上部になるように配置してください。
    手順8-2
    白色で描画色塗りします。
    画像の端2pxをすべて塗ってしまいます。
    作業しやすいように、表示倍率を800%に変更してあります。
    手順8-3
    画像全体を選択して、それから1px縮小します。
    選択領域を反転して、角もそのままです。
    黒色で描画色塗りします。
    画像の端1pxをすべて塗ってしまいます。
    手順8-4
    アクセントに、角の1pxを白色で塗っておきました。
  9. ボーダーの調整を行います。
    手順9-1
    3枚目のレイヤーをオーバーレイモードに変更します。
    手順9-2
    白色はハイライトっぽく、黒色はシャドウっぽくみえるようになります。
    手順9-3
    等倍で表示すると、こういう状態になります。

Web素材の完成

画像として書き出して完成です。
完成画像
透明度のある、それっぽい画像が出来上がりました。
パターン追加
背景とグラデーションの間にパターン塗りを加えてみました。
雰囲気が変わって、いい感じになります。
こういうWeb素材が使われているのを、よく見かけると思います。

自分で作るのが面倒な方へ

ここで使用したデータファイルをお使いください。
背景画像の色を変えるだけで、いろんなパターンの素材が作れることと思います。
ダウンロードで内容を表示してしまうブラウザの場合には、右クリックメニューから対象を保存してください。
Photoshopでは、こういった作業をマクロにしてしまえば、いろんなサイズでも自動的に作れます。
しかし、GIMPではマウス操作の記録という機能がなく、スクリプトをコーディングしなければなりません。
自動化できるようになるのは、いつになることでしょう…。

更新履歴

2008/04/14
サイト移動に伴うHTMLの修正(旧URI:[廃止])
2007/11/16
公開
9月 16

HTML/AA 0.01

HTML/AAPHPのモジュールです。
スクリプトと同じ階層か、PHPのモジュール用のパスに設置してください。
AAはアスキーアート(Ascii Art)と同じ要領で、アスキーアジャスト(Ascii Adjust)を行います。
このモジュールは、ブラウザに表示する文字列を整形する機能を有します。
このモジュールは、PerlのHTML::AAモジュールの移植版です。
UTF-8への対応も予定しておりますので、しばらくお待ちください。
ご意見、ご感想は、モジュール内に記載されているメールアドレスまでお寄せください。
PEARへの登録方法がよく分かりません。誰か教えて・・・

注意

エンコードはEUC-JP、Shift_JISに対応しています。
解説は、このページが一番詳しく、判りやすいと思います。
文字コードが異なる場合には、正常な結果を得ることができません。
MS Pゴシック12ポイントで表示した場合に限り、正常に表示できると予想されます。
文字列の先頭に半角スペースが出力された場合、それが行頭になるとずれる現象が発生します。
詳しくは、アスキーアートを紹介しているサイト等を参考にしてください。
文字列内に半角スペースの連続が混入していないと仮定します。

構文

HTML/AAモジュールを使う準備

require_once( 'HTML/AA.php' );
$aart = new AA( );
printf( '%s Version %s', $aart -> module, $aart -> version );
PHP HTML/AA module Version 0.01

文字列の長さを求める

echo $aart -> calcu_euc( '文字列の長さを求める' );
152

文字列を文字1つの配列に分解する

echo join( '|', $aart -> divide_euc( '文字列を文字1つの配列に分解する' ) );
文|字|列|を|文|字|1|つ|の|配|列|に|分|解|す|る

調整ドットを挿入して指定したサイズに整形

// 調整ドットは左側
echo $aart -> adjust_left_euc( '左側の文字', '右側の文字', 256 );
// 調整ドットは右側
echo $aart -> adjust_right_euc( '左側の文字', '右側の文字', 256 );
左側の文字.         右側の文字
左側の文字         .右側の文字

配列を1行と見立てて、整形できる最小のサイズを求める

$ary = array( '配列の中から', '整形可能な最小のサイズを', '返します' );
echo $aart -> shorter_euc( $ary );
226

配列を1行と見立てて、指定された倍数で、整形できる最小のサイズと、何倍かを求める

$ary = array( '配列を1行と見立てて', '指定された倍数で', '整形できる最小のサイズと', '何倍かを求める' );
echo join( ':', $aart -> shorter_multiple_euc( 16, $ary, $ary ) );
400:25

サンプルスクリプト

サンプルスクリプトのEUC-JPとShift_JISはダウンロード用パッケージに同梱されています。

<html>
<head>
<style type="text/css">
<!--
  table,tr,th,td { border:1px gray solid; border-collapse:collapse; text-align:center; }
  input,textarea { margin:4px; }
  input { text-align:center; }
//-->
</style>
</head>
<body>
<?php
require_once( 'HTML/AA.php' );
$aart = new AA( );
printf( '<h1>%s Version %s</h1>', $aart -> module, $aart -> version );
?>
<h3>EUC-JPサンプル</h3>
<ul>
  <li><a href="http://penlabo.net/PHP/HTML-AA.html">HTML/AA(ぺんラボ)</a></li>
  <li><a href="HTML-AA_euc.php">EUC-JP</a></li>
  <li><a href="HTML-AA_sjis.php">Shift_JIS</a></li>
</ul>
<form action="" method="post">
<table>
<tr>
  <td>左側</td>
  <td><input type="submit" value="整形"></td>
  <td>右側</td>
</tr>
<tr>
  <td>
    <textarea name="multilineL" cols="50" rows="10" style="font-size:85%">FightAIDS@Home
Human Proteome
Discovering Dengue Drugs - Together
Rosetta@home
SIMAP
TANPAKU
proteins@home
SETI@Home
Folding@Home
CHRONOS</textarea>
  </td>
  <td>
    <input type="text" name="separate" value="│" size="2">
  </td>
  <td>
    <textarea name="multilineR" cols="50" rows="10" style="font-size:85%">HIVの新薬開発
たんぱく質構造の予測
デング熱治療薬開発プロジェクト
たんぱく質構造の予測
たんぱく質の類似性データベースの構築
たんぱく質構造の予測
たんぱく質構造の予測
地球外の知的生命を検出
たんぱく質構造の予測・アルツハイマー解析
ヒトゲノム染色体間法則性解明</textarea>
  </td>
</tr>
</table>
</form>
<div style="font-family:MS Pゴシック;font-size:12pt">
<?php
if( isset( $_POST['multilineL'] ) && isset( $_POST['multilineR'] ) ){
  aa( $aart );
}
function aa( &$aart ){
  // mb_splitにもスイッチつけれ
  mb_regex_encoding( 'EUC-JP' );
  // 改行コード除去
  $aryL = mb_split( '\x0d\x0a|\x0d|\x0a', $_POST['multilineL'] );
  $aryR = mb_split( '\x0d\x0a|\x0d|\x0a', $_POST['multilineR'] );
  // 配列の小さいほうを基準に
  $max = count( $aryL ) < count( $aryR ) ? count( $aryL ) : count( $aryR );
  $aryL = array_splice( $aryL, 0, $max );
  $aryR = array_splice( $aryR, 0, $max );
  // 最短整列ドット数
  $minL = $aart -> shorter_euc( $aryL );
  $minR = $aart -> shorter_euc( $aryR );
  // 整形
  for( $i = 0; $i < $max; $i ++ ){
    echo $_POST['separate'];
    echo $aart -> adjust_right_euc( '', $aryL[$i], $minL );
    echo $_POST['separate'];
    echo $aart -> adjust_left_euc( $aryR[$i], '', $minR );
    echo $_POST['separate'];
    echo "<br>\r\n";
  }
}
?>
</div>
</body>
</html>
│            .FightAIDS@Home│HIVの新薬開発.                  │
│             .Human Proteome│たんぱく質構造の予測              │
│Discovering Dengue Drugs - Together│デング熱治療薬開発プロジェクト        │
│              .Rosetta@home│たんぱく質構造の予測              │
│                    .SIMAP│たんぱく質の類似性データベースの構築.   │
│                  . TANPAKU│たんぱく質構造の予測              │
│               .proteins@home│たんぱく質構造の予測              │
│                SETI@Home│地球外の知的生命を検出             │
│               .Folding@Home│たんぱく質構造の予測・アルツハイマー解析│
│                 .CHRONOS│ヒトゲノム染色体間法則性解明.        │

動作サンプル

EUC-JPサンプル
Shift_JISサンプル

補足

各バージョンごとに使い方が変わると思います。ご注意ください。
使い勝手がいいとはいえません。ぼちぼち更新していくかもしれませんが、関数名が変更になる可能性があります。
下のように、バージョンチェックをしたほうがいいかもしれません。

if( $aart -> version != 0.01 ){ echo 'The version of the HTML/AA module is different.'; }

ダウンロード

HTML_AA-0.01.zip

履歴

2008-04-07
サイト移動に伴うHTMLの修正(旧URI:[廃止])
2007-09-16
Perlから移植 バージョン0.01
8月 02

RSS(RubyでRSSをパースする)

説明
RSSファイルを参照し、オリジナルのリーダーを作成する。

RSSの解説は、下のサイトを参考にしました。
RSSによるサイトの情報の要約と公開
RSSモジュールの解説は、下のサイトを参考にしました。
RubyRSS
RSS Parser
確認環境
OS:Windows2000、WindowsVista
Ruby:ruby 1.8.6 (2007-03-13 patchlevel 0) [i386-mswin32]
必要なパッケージ:RSSモジュール(インストールが必要です)
注意
RSSモジュールは、標準でインストールされていません。
Windowsでパッケージを追加するには、上にあるリンクからRSSモジュールのパッケージファイルをダウンロードしてください。
インストール方法は、パッケージを解凍して、その中にある「setup.rb」を実行、つまり「ruby setup.rb」でインストールできます。
リファレンスどおりにコーディングしても、RSSのバージョンによっては正常にパースできないことがあるようです。
動作確認を行ったモジュールのバージョンは0.1.7です。ファイル名でバージョンがわかるようにしてください…。
サンプル
http://pear.php.net/のRSS
ソース
#!/ruby/bin/ruby

require 'rss'

# RSSファイルのURL
url = "http://raa.ruby-lang.org/index.rdf"
content = ""

open( url ) do |s|
	content = s.read
end

# RSSのパース
begin
	rss = RSS::Parser.parse( content )
rescue RSS::InvalidRSSError
	rss = RSS::Parser.parse( content, false )
end

# HTMLの出力開始
print "Content-type: text/html\n\n"

# channnelタグ出力
channel = rss.channel
printf("<html>\n<head>\n\t<title>RSS - %s</title>\n</head>\n<body>\n",
	channel.title
)

printf( "<h3><a href=\"%s\">%s</a></h3>\n<p>%s</p>\n",
	channel.link,
	channel.title,
	channel.description
)

# imageタグ出力
if rss.image != nil then
	image = rss.image
	printf( "<p><a href=\"%s\"><img src=\"%s\" alt=\"%s\" align=\"right\"></a></p>\n",
		image.link,
		image.url,
		image.title
	)
end

# itemタグ出力
print "<dl>\n"
rss.items.each do |i|
	printf( "\t<dt><a href=\"%s\">%s</a></dt>\n\t<dd>%s</dd>\n",
		i.link,
		i.title,
		i.description
	)
end
print "</dl>\n"

# HTMLの出力終了
print "</body>\n</html>\n"

exit;

更新履歴

2007-08-19
nilチェックをさせたら動いた。モジュールなら、自動的にやってくれればいいものを。
2007-08-02
公開。このモジュールではパース出来ないRSSも多く、あまり使えるものにはなっていない。
7月 30

XML/RSS(PHPでRSSをパースする)

RSSファイルを参照し、オリジナルのリーダーを作成します。
RSSの解説は、RSSによるサイトの情報の要約と公開を参考にしました。
XML_RSSパッケージの解説は、XML_RSSを参考にしました。
使用したXML_RSSパッケージのバージョンは1.14(0.9.10)でした。
XML_RSSパッケージは、PHPのバージョン5.2.1ではインストールされていません。

インストール方法

XML_RSSをインストールすると、XML_Treeも同時にインストールされます。

pear install -a XML_RSS

サンプル

http://pear.php.net/のRSS

構文

<?php
require_once( "XML/RSS.php" );
// RSSファイルのURL
$rss = new XML_RSS( "http://pear.php.net/feeds/latest.rss" );
// RSSのパース
$rss -> parse();
// channnelタグ出力
$channel = $rss -> getChannelInfo();
printf( "<html>\n<head>\n\t<title>RSS - %s</title>\n</head>\n",
  $channel['title']
);
printf( "<h1><a href=\"%s\">%s</a></h1>\n<p>%s</p>\n",
  $channel['link'],
  $channel['title'],
  $channel['description']
);
// imageタグ出力
if( isset( $rss -> images ) ){
  foreach( $rss -> getImages() as $image ){
    if( !count($image) ){ continue; }
    printf( "<p><a href=\"%s\"><img src=\"%s\" alt=\"%s\" align=\"right\"></a></p>\n",
      $image['link'],
      $image['url'],
      $image['title']
    );
  }
}
// itemタグ出力
echo "<dl>\n";
foreach( $rss -> getItems() as $item ){
  printf( "\t<dt><a href=\"%s\">%s</a></dt>\n\t\t<dd>%s</dd>\n",
    $item['link'],
    $item['title'],
    isset( $item['description'] ) ? $item['description'] : ""
  );
}
echo "</dl>\n";
// HTMLの出力終了
echo "</body>\n</html>";
?>

更新履歴

2008/04/04
サイト移動に伴うHTMLの修正(旧URI:[廃止])
2007/07/31
PHPXML_RSSとあわせるための細かな修正
2007/07/30
公開
7月 30

XML::RSS(PerlでRSSをパースする)

  現在はバージョン1.33が公開されています。

RSSファイルを参照し、オリジナルのリーダーを作成してみます。
RSSの解説は、RSSによるサイトの情報の要約と公開を参考にしました。
このモジュールは、ローカルに保存したファイルのタイムスタンプを比較し、無駄なトラフィックを回避しているそうです。
使用したXML::RSSモジュールのバージョンは1.12でした。
Perlのバージョンが5.8では、インストールされていません。
動作確認を行ったXML::RSSのバージョンは1.12です。最新版は確認しておりません。

インストール方法

CPANからインストール

以下のように、パッケージを直接指定しなければなりません。
CPANでインストールすると、バージョンは1.32です。

cpan install S/SH/SHLOMIF/XML-RSS-1.32.tar.gz

ppmでインストール

モジュール名の指定でインストールできます。
ppmでインストールすると、バージョンは1.12です。

ppm install XML-RSS

サンプル

http://search.cpan.orgのRSS

構文

#!/perl/bin/perl
use strict;
use XML::RSS;
use LWP::Simple;
# RSSファイルのURL
my $url = 'http://search.cpan.org/uploads.rdf';
# 保存ファイルパス
my $file = './rss';
# RSS更新確認(ここで$fileが最新になる)
mirror( $url, $file );
# RSSパース
my $rss = new XML::RSS;
$rss -> parsefile( $file );
# HTMLの出力開始
print qq|Content-type: text/html\n\n|;
# channnelタグ出力
my $channel = $rss -> {'channel'};
printf( qq|<html>\n<head>\n\t<title>RSS - %s</title>\n</head>\n<body>\n|,
  $channel -> {'title'},
);
printf( qq|<h1><a href="%s">%s</a></h1>\n<p>%s</p>\n|,
  $channel -> {'link'},
  $channel -> {'title'},
  $channel -> {'description'},
);
# imageタグ出力
my $image = $rss -> {'image'};
printf( qq|<p><a href="%s"><img src="%s" alt="%s" align="right"></a></p>\n|,
  $image -> {'link'},
  $image -> {'url'}, 
  $image -> {'title'},
);
# itemタグ出力
print qq|<dl>\n|;
foreach my $item ( @{$rss -> {'items'}} ){
  printf( qq|\t<dt><a href="%s">%s</a></dt>\n\t<dd>%s</dd>\n|,
    $item->{'link'},
    $item->{'title'},
    $item->{'description'},
  );
}
print qq|</dl>\n|;
# HTMLの出力終了
print qq|</body>\n</html>|;
exit;

更新履歴

2008-08-31
バージョン1.33公開の追記
2008-04-04
サイト移動に伴うHTMLの修正(旧URI:[廃止])
2007-07-31
PHPのXML_RSSとあわせるための細かな修正
2007-07-30
公開
7月 21

VB.NETでMicrosoft Outlookのメールを読む

はじめに
VB.NETの環境は、Microsoft Visual Basic 2005 Express Editionを利用しています。
Microsoft OutlookではないOutlookには、対応していません。
準備
新しいプロジェクトを作成してください。
次に、APIの読み込みを行います。「メニューバーのプロジェクト > 参照の追加」より、COMタブを選択し、「Microsoft Outlook 9.0 Library」コンポーネントを選択します。数値の部分は、インストールしてあるMicrosoft Officeのバージョンで変化することがあります。ちなみに、Microsoft Office2000では9.0です。
受信トレイのメールを読む
まずは、受信トレイのメールを読んでみたいと思います。
受信したメールタイトルを表示するためのリストボックス(ListBox1)を用意します。
受信トレイのメールを読むタイミングは、起動時に行います。つまり、Form1_Loadに記述します。
  Private Sub Form1_Load( _
      ByVal sender As System.Object, _
      ByVal e As System.EventArgs _
  ) Handles MyBase.Load

      Dim myOlApp As Outlook.Application = CreateObject("Outlook.Application")
      Dim myNameSpace = myOlApp.GetNamespace("MAPI")
      Dim myFolder = myNameSpace.GetDefaultFolder(6)

      Dim i As Integer
      For i = 1 To myFolder.Items.Count
          Dim myitem = myFolder.Items(i)
          ListBox1.Items.Add(myitem.Subject)
      Next

      myFolder = Nothing
      myNameSpace = Nothing
      myOlApp = Nothing

  End Sub
myNameSpace.GetDefaultFolder(6)の6が受信トレイのフォルダを指します。
フォルダにある各メールは番号で管理されており、Itemsのインデックス番号で参照できます。
Microsoft Outlookの受信トレイにメールがあるのを確認してから、実行してください。
outlook1
問題なく表示できたでしょうか?
メールの本文を読む前に
次は、メールのタイトルを読むことができたので、リストを選択すると内容が表示されるようにします。
メールの内容を読むためには、そのメールのインデックス番号が必要です。
そこで、メールタイトルをキーに、メール番号を値としたハッシュを用意します。
    Public mail As Hashtable = New Hashtable

    Private Sub Form1_Load( _
        ByVal sender As System.Object, _
        ByVal e As System.EventArgs _
    ) Handles MyBase.Load

        Dim myOlApp As Outlook.Application = CreateObject("Outlook.Application")
        Dim myNameSpace = myOlApp.GetNamespace("MAPI")
        Dim myFolder = myNameSpace.GetDefaultFolder(6)

        Dim i As Integer
        For i = 1 To myFolder.Items.Count
            Dim myitem = myFolder.Items(i)
            ListBox1.Items.Add(myitem.Subject)
            mail(myitem.Subject) = i
        Next

        myFolder = Nothing
        myNameSpace = Nothing
        myOlApp = Nothing

    End Sub

変更した場所を赤く表示しています。これで、リストの値からメール番号を得られるようになりました。
メールの本文を読む
内容を表示するためのテキストボックス(TextBox1)を用意します。
TextBox1はプロパティの設定で、MultilineとScrollBarsをTrueに変更しておきます。
内容を表示するには、ListBox1のSelectedIndexChangedイベントを利用します。
  Private Sub ListBox1_SelectedIndexChanged( _
      ByVal sender As System.Object, _
      ByVal e As System.EventArgs _
  ) Handles ListBox1.SelectedIndexChanged

      Dim myOlApp As Outlook.Application = CreateObject("Outlook.Application")
      Dim myNameSpace = myOlApp.GetNamespace("MAPI")
      Dim myFolder = myNameSpace.GetDefaultFolder(6)

      Dim myitem = myFolder.Items(mail(ListBox1.Text))
      TextBox1.Text = myitem.Body

  End Sub
メール番号は1から始まります。
outlook2
これで、選択したメールの内容を表示することができました。
メールの内容は、text形式かhtml形式かの判断は行っていません。
html形式では、ソースが表示されますが、一部は「?」という文字に化けます。
おまけ
myitem.Subject 件名
myitem.SenderName 送信者名
myitem.SentOnBehalfOfName 送信者名(SenderNameとどう違う?)
myitem.Body 内容
myitem.ReceivedTime 受信時間
myitem.To 送信先

更新履歴

2007-07-21
公開
6月 02

ImageMagickで文字を描画する

このページは、Text Handingを基準に作成されていますが、
翻訳ページではありませんので、ご注意ください。
captionでも作成できますが、とりあえず保留します。
また、コード内において改行が含まれていますが、実際には改行を含まずに入力することが必要です。
サンプルで使用したフォントはあくあフォントです。

オプションの説明

文字については、フォントが持っている幅が利用されるため、余白が生まれます。
-trim“オプションを利用すれば、出来るだけ小さな画像にすることは出来ますが、
座標で決め打ちするような画像の合成時に、誤差の原因となる可能性があるため、利用は控えたほうがいいかもしれません。

オプション 内容 細く
-background 背景の色 指定しない場合は白色になり、透明情報を持てる形式で出力する場合には「none」を指定すれば透明になる。
-fill 文字の色 文字の色を指定しなければ、背景で塗られた画像が作成される。
ただし、画像サイズは文字の色を指定したときと同じものになる。
-pointsize 文字の大きさ
(pt)
文字の大きさを指定しなくても、画像サイズが指定されていれば自動で調整されるが、
画像サイズが指定されていなければ、おそらく12ptで作成されているらしい。

文字サイズを基準に描画する

画像サイズは自動的に調整されます。

convert -background white -fill blue 
	-font aquafont.ttf -pointsize 32 label:penlabo.net text1.png
文字サイズ基準画像

png画像、176×34ピクセル

画像サイズを基準に描画する

縦と横のサイズを指定する

文字サイズは自動的に調整されますが、余白が出来ます。
この余白を調整するには”-gravity“オプションを設定します。

convert -background white -fill blue 
	-font aquafont.ttf -size 256x64 label:penlabo.net text2.png

画像サイズ基準画像

png画像、256×64ピクセル

横のサイズを指定する

文字サイズは自動的に調整されますが、余白が出来ます。
横のサイズのみを指定することにより、縦は自動で調整されます。

convert -background white -fill blue 
	-font aquafont.ttf -size 256x label:penlabo.net text3.png

画像サイズ横基準画像

png画像、256×47ピクセル

縦のサイズを指定する

文字サイズは自動的に調整されますが、余白が出来ます。
縦のサイズのみを指定することにより、横は自動で調整されます。

convert -background white -fill blue 
	-font aquafont.ttf -size x64 label:penlabo.net text4.png

画像サイズ縦基準画像

png画像、336×64ピクセル

改行を含む文字描画する

文字列に「\n」を含めれば、改行コードも利用できます。

convert -background white -fill blue 
	-font aquafont.ttf -pointsize 32 label:penlabo\n.net text5.png

画像サイズ改行有り画像

png画像、113×67ピクセル

日本語を描画する

テキストファイルを指定すれば、日本語も画像に出来ます。
ただし、文字コードは「UTF-8」で保存する必要がありますが、BOMの有り無しは関係ないようです。
改行も有効なので、スクリプトから画像を作成する際には便利です。

convert -background white -fill blue 
	-font aquafont.ttf -pointsize 32 label:@text6.txt text6.png

画像サイズ縦基準画像

png画像、126×34ピクセル

画像の中の指定した場所に文字描画する

-annotate“オプションを利用することで、文字を自由に配置できますが、
画像のx座標と座標だけでは、思い通りになりません。
フォントの持つ特性を理解しなければならならず、ちょっとした工夫が必要となります。

とりあえず、何も考えずに座標(0,0)を指定してみましょう。

convert -size 256x64 xc:white -fill blue 
	-font aquafont.ttf -pointsize 32 
	-annotate +0+0 penlabo.net annotate1.png

座標0,0画像

png画像、256×64ピクセル

とても悲惨な画像が作成されました。
上部になにやら見えていますが、これでは何一つ判りません。
次は試しにy座標の値を、画像の高さと同じに変更してみましょう。

convert -size 256x64 xc:white -fill blue 
	-font aquafont.ttf -pointsize 32 
	-annotate +0+64 penlabo.net annotate2.png
座標0,64画像

png画像、256×64ピクセル

今度は、どういう文字が書いてあるのかが判るようになりましたが、今度は下部が切れてしまいました。
2つの画像を見比べると、上下につなぎ合わせれば1つの画像になることが判ります。

座標0,0画像←画像2つ目
座標0,64画像←画像1つ目

-annotate“でy座標を指定するときには、フォントのベースラインを基準にしなければならないのです。
-font“、”-poinsize“を基準に求めたベースラインの座標を指定しなければ、思うように配置が出来ないのです。

いろいろ調べましたが、ベースラインの座標を求める方法が見つかりませんでした。
もし、ご存知の方がいらっしゃいましたら、ご教授をお願いいたします。
次の方法を取れば、画像を作ってはそのサイズを求め・・・といった肯定を省くことが出来ます。
ベースラインの座標を求めるには、文字を基準に画像を作成し、余白を除去する”-trim”オプションを追加します。

convert -font aquafont.ttf -pointsize 32 
	label:penlabo.net -trim info:

背景や文字の色は、指定しなくても問題ありません。
ファイル名を”info:”と指定することで、画像ファイルではなく画像情報が出力されます。

label:penlabo.net LABEL 173x27 176x34+1+5 DirectClass 8-bit

この場合は27ピクセルとわかりました。

convert -size 256x34 xc:white -fill blue 
	-font aquafont.ttf -pointsize 32 
	-annotate +0+27 penlabo.net annotate3.png

これで、座標を指定して思い通りの場所に文字描画することができるようになりました。

更新履歴

2007-06-02
公開
5月 08

WCG日報スクリプト配布

WCGとは、World Community Gridの略で、
分散コンピューティングBOINCの医療系プロジェクトの名称。
WCGに参加すると、タンパク質の構造予測や解析、新薬の開発に携わることになります。
2007年4月27日に突然UD(United Devices)が終了し、
UDの最強チーム「Team 2ch」のユーザーが移動(後に難民の大移動と呼ばれる)したため、
WCGの弱小チーム「Team 2ch」はその日を境に、強大なチームへと変貌する。
当サイトの管理者である404は、日報支援サイトとしてWCGTeam 2ch:404を運営しており、
このページでは、そのサイトで使用している日報スクリプトの公開を行っております。

WCG-LOGO

日報スクリプト

日報スクリプトは、割と高度な処理が行われています。
まず、WCGの更新を監視し、情報の取得と解析、そして計算が行われます。
これら一連の処理は、レンタルサーバーで実行することは難しいでしょう。
自宅サーバーを公開できるスキルと、Perlのモジュールを追加できる知識が求められます。

ファイル構成

folder wcg-team2ch
├ while_wcg.pl – 繰り返しcheck_wcg.plを起動するためのもの
| └ check_wcg.pl – コア
|   ├ require.pl – いろいろなライブラリ
|   └ calender.pl – カレンダーライブラリ
folder public_html – 公開用ディレクトリ(httpサーバールート)
├ stat.cgi – 日報CGI
| ├ menu.cgi – メニューAjax
| ├ stat.js – JavaScript
| └ menu.js – JavaScript
folder grp – 板名(自動生成)
│ ├ 801.txt
│ ├ ainotae.txt
│ └(以下、更新毎に変化)
folder log – 更新情報
│ ├ 20080523_board.tsv
│ ├ 20080523_member.tsv
│ ├ 20080523_team.tsv
│ ├ 20080524_country.tsv
│ ├ board_ame.txt
│ ├ board_points.tsv
│ ├ board_result.tsv
│ ├ country_point.tsv
│ ├ file.txt
│ ├ team_points.tsv
│ └ (以下、更新毎に増殖)
folder msg – check_wcg.pl活動ログ
│ ├ 20080523_act.log
│ └(以下、更新毎に増殖)
folder temp – テンポラリ
| ├ folder id – ID別
| | ├ 0B5RSMBR9N1.xml
| | ├ 0BCGCWNDR1.xml
| | └ (以下、更新毎に変化)
│ ├ country_member.tsv
│ ├ country_point.tsv
│ ├ country_result.txt
│ ├ country_time.txt
│ ├ member_total.tsv
│ ├ member_total.txt
│ ├ team_id.tsv
│ └(更新毎に変化)
folder xml – テンポラリ
│ ├ %2d777%2d%40slot.xml
│ ├ %2d+silverfox+%2d.xml
| └ (以下、更新毎に変化)
folder zip – 書庫(tmpl書庫ファイル)
├ 20080523_member.zip
├ 20080523_team.zip
├ 20080524_country.zip
└ (以下、更新毎に増殖)

必須モジュール

公開しているスクリプトは、Perl5.8.8での動作を確認しています。
モジュールは記憶違いにより、追加(インストール)が必要だったり、
ビルドやバージョンの違い(Perl5.10もあり)で標準モジュールかもしれません。
モジュールの追加方法は、Google先生または404へ直接聞いてください。

  • Archive::Zip – 追加
  • CGI – 標準
  • Encode – 要upgrade
  • File::Path – 追加
  • HTML::AA – 追加
  • HTTP::Request – 標準
  • HTTP::Request::Common – 標準
  • HTTP::Cookies -標準
  • HTTP::Date – 追加
  • HTML::Entities
  • HTML::Template – 追加
  • Jcode – 要upgrade
  • LWP::UserAgent – 標準
  • XML::Simple – 追加

動作の流れ

ソースを見てください…。m(_ _)m

稼動サイト

WCG-Team2ch 404

ダウンロード

更新履歴

2008-05-24
サイト移動に伴うHTMLの加筆
(旧URI:[廃止])
2008年5月22日バージョン公開
2007-07-25
公開
9月 27

HTML::AA 0.10 原文

「翻訳」ではなく「原文」なのは、私が作ったモジュールだからです。
HTML::AAモジュールのバージョンは0.10です。
なお、perlmanの内容とは異なります。次期バージョン(UTF-8対応予定)であわせます。
コードの説明は、PHPのHTML/AAパッケージの方が詳しいです。
構文はほぼ同じなので読み替えてください。

モジュールのバグについて

以下のような指摘を頂きましたので掲載しておきます。(2010-02-17記)

#  名無しさん Says:
2月 17th, 2010 at 2:49 PM e

エントリとは関係ないですが、バグ報告です。
PerlのHTML::AAにおいて、文字の0を数字とみなすことによって
エラーが発生します。
270 my @array;
271 while($str) {
272 $str =~ s/(.)//;

を

270 my @array;
271 while($str ne ”) {
272 $str =~ s/(.)//;
にするとうまくいきましたので、ご報告まで。

説明

HTML::AAPerlモジュールです。
AAアスキーアート(Ascii Art)と同じ要領で、アスキーアジャスト(Ascii Adjust)を行います。
このモジュールは、ブラウザに表示する文字列を整形する機能を有します。
アスキーアートほどの表現力はありませんが、文字列の横ピクセル数を計算したり、面倒な右揃え等の整形をすることが出来ます。
このモジュールは、UnitedDevicesの日報支援サイト「UD-Team2ch 404」を作ったことがきっかけです。
UTF-8への対応も予定しておりますので、しばらくお待ちください。
ご意見、ご感想は、モジュール内に記載されているメールアドレスまでお寄せください。
元はWWW::AAとして公開しておりましたが、カテゴリが違うという判断から0.10よりHTML::AAに変更いたしました。

特徴

罫線表示が必要な場合に有効な、指定サイズ(罫線の倍数)の倍数での最小サイズを求めるshorter_multipleを実装しています。

注意

エンコードはEUC-JP、Shift_JISに対応しています。
作者は英語が全然出来ないので、翻訳ソフトにかけた英文で記述されています。
解説は、このページが一番詳しく、判りやすいと思います。
文字コードが異なる場合には、正常な結果を得ることができません。
MS Pゴシック12ポイントで表示した場合に限り、正常に表示できると予想されます。
文字列の先頭に半角スペースが出力された場合、それが行頭になるとずれる現象が発生します。
詳しくは、アスキーアートを紹介しているサイト等を参考にしてください。
原則、日本語の文字(概ね2バイト文字)のみの入力においてのみ正常な動作を保証いたしますが、半角スペース以外は正常に動作することを確認しています。
文字列内に半角スペースの連続が混入している場合、表示の際にずれます。対策処理を検討中。

解説

アスキーコードで正規表現を利用していますが、主要な部分は次の通りです。
判別しやすいように、文字のままで表記しています。
これは、プロトタイプとしてJavaScriptで作成したものを少し修正したものです。

my $str  = shift;
my $count = 0;
$count += 15 * ($str =~ s/ー|M|m|あ|い|お|け|す|そ|ぞ|た|だ|つ|づ|に|ひ|び|ぴ|ん|ウ|オ|ガ|キ|ギ|グ|ケ|ゲ|ズ|セ|ダ|チ|ヂ|ヅ|デ|ナ|ニ|ネ|ヘ|ベ|ペ|ホ|ボ|ポ|ユ|ワ|ヴ//g);
$count += 14 * ($str =~ s/え|き|ぎ|ご|ざ|ち|ぢ|て|で|ど|な|ま|ゃ|ゅ|よ|る|ろ|ゎ|を|ア|エ|ゴ|シ|ジ|ス|ゾ|ツ|テ|ビ|ピ|ブ|プ|マ|モ|レ|ロ|ン//g);
$count += 13 * ($str =~ s/O|Q|ぃ|ぉ|ぐ|こ|っ|も|ら|イ|ォ|カ|ク|コ|ソ|ヌ|フ|ャ|ュ|ラ|ヲ//g);
$count += 12 * ($str =~ s/M|W|m|ヽ|ヾ|ゝ|B|C|D|G|H|K|N|R|S|U|w|ぁ|ぇ|さ|し|じ|と|ょ|り|ァ|ゥ|ェ|タ|ッ|ヒ|メ|ヨ|リ|ヮ|ヵ|ヶ//g);
$count += 11 * ($str =~ s/@|C|G|O|Q|サ|ム|ヤ|ル|、|。|,|.|ゞ|0|1|2|3|4|5|6|7|8|9|A|E|P|V|う|ド|ノ|ミ| //g);# ←最後に全角スペースがあります
$count += 10 * ($str =~ s/&|A|B|D|H|K|N|P|R|S|U|V|X|w|ー|ア|ウ|エ|オ|キ|ケ|ス|セ|チ|ツ|テ|ナ|ニ|ネ|ハ|ヘ|ホ|マ|モ|ユ|F|J|L|T|X|Y|Z|b|d|h|k|n|o|p|q|u|ぅ|ィ|ト|ョ//g);
$count +=  9 * ($str =~ s/E|F|J|L|T|Y|Z|a|c|e|g|s|く|ヲ|イ|カ|ク|コ|シ|ソ|タ|ヌ|フ|ラ|レ|ロ|ワ|ン//g);
$count +=  8 * ($str =~ s/a|b|c|d|e|h|n|o|p|q|u|v|y|"|#|$|%|*|+|-|/|0|1|2|3|4|5|6|7|8|9|<|=|>|\|ァ|ゥ|ェ|ォ|ャ|ュ|ッ|ノ|ヒ|メ|ヨ|リ|・|:|;|゛|゜|´|`|¨|^|‐|‘|’|“|”|(|)|〔|〕|[|]|{|}|〈|〉|《|》|「|」|『|』|【|】|†|‡|¶|v|x|y|z//g);
$count +=  7 * ($str =~ s/?|^|`|g|k|s|x|z|~|「|」|・|ィ|ョ|ト|ミ|。|、//g);
$count +=  6 * ($str =~ s/r|t|r//g);
$count +=  5 * ($str =~ s/(|)|[|]|_|f|f|t| //g);# ←最後に半角スペースがあります
$count +=  4 * ($str =~ s/!|I|j|{|||}|゙|゚|I|i|j|l//g);
$count +=  3 * ($str =~ s/'|,|.|:|;|i|l//g);
$count += 16 * ($str =~ s/../g);
return $count;

文字とそのドット数(ピクセル数)の関連性は、「アスキーアート」で検索したページで、解説が見つかると思います。

使い方(EUC-JPの場合)

use HTML::AA;
my $aart = new HTML::AA;
#------------------- モジュールが処理をする文字コードを指定します。EUC-JPならuec、Shift_JISならsjis
$aart -> code('euc');
my $dot;
my $str = '整形したい文字列です。';
my @str = ('整形したい文字列です。','このような感じで整形することが出来ます。');
print  qq|Content-type: text/html; charset=EUC-JPnn|;
print  qq|<body>n|;
print  qq|HTML::AAのサンプルです。<br>n|;
#------------------- 文字列のドット数を求める
print  qq|<br>n文字列のドット数を求める<br>n|;
# 文字コードを引数で指定する場合
$dot = $aart -> calcu($str, 'euc');
printf qq|「%s」のドット数は、%dです。<br>n|, $str, $dot;
#------------------- 指定したドット数で整形する(undefではなく''空値を指定すること)
print  qq|<br>n指定したドット数で整形する<br>n|;
# $strと''の間に調整ドットを右寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust($str, '', 'R', 350);
# $strと''の間に調整ドットを左寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust($str, '', 'L', 350);
# ''と$strの間に調整ドットを右寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust('', $str, 'R', 350);
# ''と$strの間に調整ドットを左寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust('', $str, 'L', 350);
# $strと$strの間に調整ドットを右寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust($str, $str, 'R', 350);
# $strと$strの間に調整ドットを左寄せで整形
printf qq|│%s│<br>n|, $aart -> adjust($str, $str, 'L', 350);
#------------------- 配列内の文字列が揃う最小のドット数を求める
print  qq|<br>n配列内の文字列が揃う最小のドット数を求める<br>n|;
$dot = $aart -> shorter(@str);
printf qq|│%s│<br>n|, $aart -> adjust($_, '', 'R', $dot) foreach @str;
printf qq|│%s│<br>n|, $aart -> adjust($_, '', 'L', $dot) foreach @str;
printf qq|│%s│<br>n|, $aart -> adjust('', $_, 'R', $dot) foreach @str;
printf qq|│%s│<br>n|, $aart -> adjust('', $_, 'L', $dot) foreach @str;
print qq|</body>n|;

結果は次のとおりです。

HTML::AAのサンプルです。

文字列のドット数を求める
「整形したい文字列です。」のドット数は、162です。

指定したドット数で整形する

│整形したい文字列です。                   .│
│整形したい文字列です。.                   │
│                   .整形したい文字列です。│
│.                   整形したい文字列です。│
│整形したい文字列です。 .....整形したい文字列です。│
│整形したい文字列です。..... 整形したい文字列です。│

配列内の文字列が揃う最小のドット数を求める

│整形したい文字列です。             .│
│このような感じで整形することが出来ます。│
│整形したい文字列です。.             │
│このような感じで整形することが出来ます。│
│             .整形したい文字列です。│
│このような感じで整形することが出来ます。│
│.             整形したい文字列です。│
│このような感じで整形することが出来ます。│

動作サンプル

サンプル

補足

各バージョンごとに使い方が変わると思います。ご注意ください。
$aart -> code(‘euc’);で文字コードを指定しない場合は、初期値のEUC-JPで処理されます。
宣言は何度でも行えます。その宣言は、それより後の処理で使用される文字コードに反映されます。
個別にコードを指定する使用方法があります。興味のある方はソースを見てください。

インストール方法

プロンプトにて、「cpan install HTML::AA」とすることでインストールできます。
または、CPANよりダウンロードできます

おまけ(Excite翻訳にかける前の原文)

#-------------------------------------------------------------------------------
# モジュール宣言
#-------------------------------------------------------------------------------
sub new {}
#-------------------------------------------------------------------------------
# 文字コードを宣言します
#-------------------------------------------------------------------------------
my $code = 'euc';
#-------------------------------------------------------------------------------
# モジュールが処理する文字コードを宣言します
# 文字コードを指定しない呼び出しで有効です
# EUC-JPで処理したいならeuc
# $aart -> code('euc');
# Shift_JISで処理したいならsjis
# $aart -> code('sjis');
#-------------------------------------------------------------------------------
sub code {}
#-------------------------------------------------------------------------------
# ドット数を計算します
# $aart -> calcu($str);
#-------------------------------------------------------------------------------
sub calcu {}
# 文字コード宣言を無視してEUC-JPで処理したい時
# $aart -> calcu_euc($str);
sub calcu_sjis {}
# 文字コード宣言を無視してShift_JISで処理したい時
# $aart -> calcu_sjis($str);
sub calcu_sjis {}
#-------------------------------------------------------------------------------
# 文字列の変数を1文字の配列に分解します
# $aart -> divide($str);
#-------------------------------------------------------------------------------
sub divide {}
# 文字コード宣言を無視してEUC-JPで処理したい時
# $aart -> divide_euc($str);
sub divide_euc {}
# 文字コード宣言を無視してShift_JISで処理したい時
# $aart -> divide_sjis($str);
sub divide_sjis {}
#-------------------------------------------------------------------------------
# 調整ドットを加えた文字列を返します
# $aart -> adjust($str_l, $str_r, position, $size);
#-------------------------------------------------------------------------------
sub adjust {}
# 配置'R'と文字コード宣言を無視してEUC-JPで処理したい時
# $aart -> adjust_right_euc($str_l, $str_r, $size);
sub adjust_right_euc {}
# 配置'L'と文字コード宣言を無視してEUC-JPで処理したい時
# $aart -> adjust_left_euc($str_l, $str_r, $size);
sub adjust_left_euc {}
# 配置'R'と文字コード宣言を無視してShift_JISで処理したい時
# $aart -> adjust_right_sjis($str_l, $str_r, $size);
sub adjust_right_sjis {}
# 配置'L'と文字コード宣言を無視してShift_JISで処理したい時
# $aart -> adjust_left_sjis($str_l, $str_r, $size);
sub adjust_left_sjis {}
#-------------------------------------------------------------------------------
# 配列の文字列が揃う最小ドット数を返します
# $aart -> shorter(@array);
#-------------------------------------------------------------------------------
sub shorter {}
# 文字コード宣言を無視してEUC-JPで処理したい時
# $aart -> shorter_euc(@array);
sub shorter_euc {}
# 文字コード宣言を無視してShift_JISで処理したい時
# $aart -> shorter_sjis(@array);
sub shorter_sjis {}
#-------------------------------------------------------------------------------
# 配列の文字列が揃う指定された数の倍数に当たる最小ドット数を返します
# ($minimun, $magnification) = $aart -> shorter_multiple($width, @arrayL, @arrayR);
#-------------------------------------------------------------------------------
sub shorter_multiple {}
# 文字コード宣言を無視してEUC-JPで処理したい時
# ($minimun, $magnification) = $aart -> shorter_multiple_euc($width, @arrayL, @arrayR);
sub shorter_multiple_euc {}
# 文字コード宣言を無視してShift_JISで処理したい時
# ($minimun, $magnification) = $aart -> shorter_multiple_sjis($width, @arrayL, @arrayR);
sub shorter_multiple_sjis {}

更新履歴

2010-02-17
バグの指摘を掲載
2008-04-03
サイト移動に伴うHTMLの修正(旧URI:[廃止])
2006-10-10
WWW::AAというカテゴリがおかしいと判明したので、HTML::AAに変更 バージョンを0.10
2006-10-04
動作速度が向上するように変更 バージョン0.06
2006-10-09
エスケープシーケンスを1文字としていたのを除去(文字列から削除)に変更。Shift_JISに対応。バージョン0.05
2006-10-04
翻訳の見直しと共に、原文を掲載。ローカルのファイルでは文字列を1文字の配列にする機能を追加。
2006-09-29
WWW::AAサンプルを追加
2006-09-28
コメントをばっさり削除、エラーが出ないように補正、見た目の修正と、コメントの強化などで0.02にバージョンアップ
2006-09-27
プロトタイプとしてWWW:AA0.01をCPANに登録