センサについて２

以下は、「秋月電子」、「千石電商」、「共立エレショップ」、「Sparkfun（米国）」の各サイトにおけるセンサの分類です。目的や機能ごとに分かれているので、センサを選ぶ際の参考にして下さい（各店舗の各センサのページへリンクしています）。

「秋月電子」 ・センサ一般 ・湿度/温度 ・光 ・赤外線センサ ・リモコン受光部 ・紫外線関連 ・音 ・ペーハー（pH） ・アルコール/ガス　 ・方位

「千石電商」 ・ホール素子／ホールセンサ　 ・温度センサー ・角速度（ジャイロ） ・加速度 ・距離 ・圧力 ・衝撃 ・曲げ ・焦電 ・サーミスタ

「共立エレショップ」 ・感圧 ・ひずみ／曲げ ・温度 ・湿度 ・光 ・赤外線 ・紫外線 ・カラー ・超音波 ・磁気 ・電流 ・位置 ・位置（アクセサリ）　 ・動き

「Sparkfun（米国）」 ・Accelerometer（加速度） ・Biometrics（生物測定） ・Capacitive（静電容量） ・Current（電流） ・Flex/Force（曲げ／力） ・ID（証明／認証） ・IMU/Gyros（慣性力／角速度）　 ・Infrared（赤外線） ・Light/Imaging（光／画像） ・Magneto（磁力） ・Proximity（距離） ・Temperature（温度） ・Weather（天候）

その他のショップやセンサについては、このブログページ右側の「ショップリスト」にも記載してあるので参考にして下さい。

センサ活用ハンドブック―色/明るさから距離/圧力まで14のターゲットを検出 (トランジスタ技術SPECIAL)

posted with amazlet at 09.04.01

CQ出版
売り上げランキング: 109202

Amazon.co.jp で詳細を見る

Arduino書籍：「Making Things Talk」日本語版

『Making Things Talk--Arduinoで作る「会話」するモノたち』（日本語版）が発売されるそうです。

Making Things Talk -Arduinoで作る「会話」するモノたち

posted with amazlet at 09.03.30

Tom Igoe
オライリージャパン
売り上げランキング: 16017

Amazon.co.jp で詳細を見る

Processing ドラッグした図形の動きを記録/保存/再生する

Processing画面上の図形をマウスでドラッグし、その動きを記録する方法、記録した内容をテキストデータとして外部に保存する方法、さらにそのテキストデータを読み取って動きを再生させるサンプルです。

まずは、ドラッグする図形を円とした場合のプログラムから始めます。今回はmouseDragged()は使わず、startDragというフラグを用意し、mousePressed()でドラッグ開始（startDrag=true）、mouseReleased()でドラッグ終了（startDrag=false）とみなす方法を用います。
円の中心座標から少しずれた位置にマウスを合わせてそのままドラッグできるように、円の中心座標とマウス座標の差分を計算しておき、その差分を足した値を最終的に円の座標に反映されるようにします。
また、dist()を使って円の中心座標からマウス座標までの距離を計算し、その距離が円の半径以内であれば円の上にマウスがあることとみなしてドラッグ可能にします。dist()は、dist(x1,y1,x2,y2)のように(x1,y1)と(x2,y2)の二点間の距離を計算します。


「円をドラッグする」：

　[プログラムを表示]

//円のXY座標の変数を用意する
int x,y;
//円の座標とマウス座標の差分（ずれ）の変数
int dx,dy;
//ドラッグ開始終了のフラグを用意
boolean startDrag;
//円の半径
int r=30;

void setup(){
  size(600,600);//画面サイズ設定
  smooth();//滑らかな描画にする
  stroke(255);//線色を白
  fill(0);//塗り色を黒
  x=width/2;//円を画面中心に配置しておく
  y=height/2;
}

void draw(){
  background(0);//背景色（黒）
  
  //ドラッグ中の場合
  if(startDrag==true){
    //マウス座標に差分を加えた値を円の座標に代入
    x=mouseX+dx;
    y=mouseY+dy;
  }

  //円を描画する
  ellipse(x,y,r*2,r*2);
}

void mousePressed(){
  //円中心座標とマウス座標の距離が円半径以内の場合
  if(dist(x,y,mouseX,mouseY)<=r){
    //ドラッグ用フラグをtrue（ドラッグ中）にする
    startDrag=true;
    //円の座標とマウス座標の差分を求めておく
    dx=x-mouseX;
    dy=y-mouseY;
  }
}

void mouseReleased(){
  //ドラッグ用フラグをfalse（ドラッグなし）にする
  startDrag=false;
}

「円をドラッグ＋記録機能」：
上記プログラムに、ドラッグした円の動き（連続する座標値）を記録する機能を付け加えます（以下のプログラム）。「r」キーを押すことで記録開始にします。再度「r」キーを押すと記録停止するようにし、記録中は円の塗色を赤に変化させます。プログラム的には、recordStartというフラグを用意し、記録開始／停止を判別できるようにします。xPosとyPosという座標を記録するための配列を用意しておき、記録中はそれらの配列に座標値を付け加えていきます。
赤文字の部分が付け足したプログラムです。

　[プログラムを表示]

//円のXY座標の変数を用意する
int x,y;
//円の座標とマウス座標の差分（ずれ）の変数
int dx,dy;
//ドラッグ開始終了のフラグ
boolean startDrag;
//円の半径
int r=30;

//記録中／記録停止のフラグ
boolean startRecord;
//座標記録用の配列を用意し、内容を空にしておく。
int[] xPos={};
int[] yPos={};

void setup(){
  size(600,600);//画面サイズ設定
  smooth();//滑らかな描画にする
  stroke(255);//線色を白
  fill(0);//塗り色を黒
  x=width/2;//円を画面中心に配置しておく
  y=height/2;
}

void draw(){
  background(0);//背景色（黒）

  //ドラッグ中の場合
  if(startDrag==true){
    //マウス座標に差分を加えた値を円の座標に代入
    x=mouseX+dx;
    y=mouseY+dy;
  }

  //記録中の場合
  if(startRecord==true){
    xPos=append(xPos,x);//座標値を配列に付け加えていく
    yPos=append(yPos,y);
  }

  //円を描画する 
  ellipse(x,y,r*2,r*2);
}

void mousePressed(){
  //円中心座標とマウス座標の距離が円半径以内の場合
  if(dist(x,y,mouseX,mouseY)<=r){
    //ドラッグ用フラグをtrue（ドラッグ中）にする
    startDrag=true;
    //円の座標とマウス座標の差分を求めておく
    dx=x-mouseX;
    dy=y-mouseY;
  }
}

void mouseReleased(){
  //ドラッグ用フラグをfalse（ドラッグなし）にする
  startDrag=false;
}

void keyPressed(){
  if(key=='r'){//「r」キーを押した場合
    if(startRecord==true){//記録中の場合
      startRecord=false;//記録なしに戻す
      fill(0,0,0);//円の塗色を黒に戻す
    }else{//記録なしの場合
      startRecord=true;//記録中にする
      fill(255,0,0);//円の塗色を赤にする
    }
  }
}

xPos={}というように空の配列をはじめに用意しておき、append()を使って変化する座標値を配列xPosに付け加えていきます。よって、配列xPosに含まれる要素は、記録されるごとに増えていきます。xPos.lengthを用いれば、記録された配列内の座標の個数を調べることができます。
記録停止しているときに「r」キーが押されればstartRecord=trueにし、逆に記録停止しているときに押されれば、startRecord=falseに切り替えられるように、フラグstartRecordを使い分けます。


「円をドラッグ＋記録機能＋保存機能」：
さらに以下では、記録された内容をテキストファイルとして外部保存する機能と記録した座標値を消去する機能を付け足します（赤い文字部分）。「r」キーで記録、「s」キーでファイル保存、「c」キーで記録内容を消去することにします。

　[プログラムを表示]

//円のXY座標の変数を用意する
int x,y;
//円の座標とマウス座標の差分（ずれ）の変数
int dx,dy;
//ドラッグ開始終了のフラグ
boolean startDrag;
//円の半径
int r=30;

//記録中／記録停止のフラグ
boolean startRecord;
//座標記録用の配列を用意し、内容を空にしておく
int[] xPos={};
int[] yPos={};

//消去用に空の配列を用意しておく
int[] clearArray={};

void setup(){
  size(600,600);//画面サイズ設定
  smooth();//滑らかな描画にする
  stroke(255);//線色を白
  fill(0);//塗り色を黒
  x=width/2;//円を画面中心に配置しておく
  y=height/2;
}

void draw(){
  background(0);//背景色（黒）

  //ドラッグ中の場合
  if(startDrag==true){
    //マウス座標に差分を加えた値を円の座標に代入
    x=mouseX+dx;
    y=mouseY+dy;
  }

  //記録中の場合
  if(startRecord==true){
    xPos=append(xPos,x);//座標値を配列に付け加えていく
    yPos=append(yPos,y);
  }

  //円を描画する 
  ellipse(x,y,r*2,r*2);
}

void mousePressed(){
  //円中心座標とマウス座標の距離が円半径以内の場合
  if(dist(x,y,mouseX,mouseY)<=r){
    //ドラッグ用フラグをtrue（ドラッグ中）にする
    startDrag=true;
    //円の座標とマウス座標の差分を求めておく
    dx=x-mouseX;
    dy=y-mouseY;
  }
}

void mouseReleased(){
  //ドラッグ用フラグをfalse（ドラッグなし）にする
  startDrag=false;
}

void keyPressed(){
  //記録用の処理
  if(key=='r'){//「r」キーを押した場合
    if(startRecord==true){//記録中の場合
      startRecord=false;//記録なしに戻す
      fill(0,0,0);//円の塗色を黒に戻す
    }else{//記録なしの場合
      startRecord=true;//記録中にする
      fill(255,0,0);//円の塗色を赤にする
    }
  }

  //保存用の処理  
  if(key=='s'){//「s」キーを押した場合
    //ファイル選択画面で保存先を決める
    String savePath = selectOutput();
    //保存先のパスが空ではないとき
    if (savePath != null) {
      //保存用のインスタンスを用意する
      PrintWriter output;
      //保存先にファイルを生成
      output=createWriter(savePath);
      //配列に含まれる値を出力する
      for(int i=0;i<xPos.length;i++){
        output.println(xPos[i]+","+yPos[i]);//X座標+コンマ+Y座標+改行
      }
      output.flush();//データ保存
    }
  }

  //記録内容を消去する処理
  if(key=='c'){//「c」キーを押した場合
    xPos=clearArray;//X座標の配列に空の配列を代入し、内容を消去
    yPos=clearArray;//Y座標の配列に空の配列を代入し、内容を消去
  }
}

上記プログラムでは、printWriterを使って外部ファイルとして座標値データを保存しています。「s」キーを押すとselectOutput()によってダイアローグ画面が現れるので、保存名と保存先を指定します。「positions.txt」のように、「.txt」の拡張子をつけて任意の場所（デスクトップなど）に保存します。再度上書き保存する場合は、ダイアローグ画面上で、同じファイルを選択し保存ボタンを押します（上書き保存の確認メッセージが現れます）。


「円をドラッグ＋記録機能＋保存機能＋再生機能」：
次に、記録された内容や保存された内容のデータを読み取り、そのデータに基づいて動きを再生するプログラムをします。再生中は円の塗色が緑に変化し、再生終了すれば黒に戻ります。
まず、「r」キーを押して記録開始し、マウスで円をドラッグします（ドラッグ記録中）。
次に再度「r」キーを押して記録を停止します。
記録された内容を再生するために、「p」キーを押します。動きが再生されている間は円が緑色になります。
「s」キーを押すことで、記録内容を外部ファイルとしてデスクトップなどの任意の場所にファイル名（拡張子「.txt」）をつけて保存します。
「s」キーで保存されたファイルを読み込むには、「l」（小文字のエル）キーを押してファイル選択画面の中でファイル選択します。読み込んだファイルのデータは配列xPosとyPosに記憶されます。「p」キーを押せば、読み込んだ記録を再生します。
「c」キーによって、配列内のデータを空にしないかぎり、「r」キーによる記録した座標値は追加されていきます。

「各キーの機能割当」：
r：記録開始（record）／記録停止
c：記録消去（clear）
s：保存（save）
l：ファイル読み込み（load）
p：再生（play）

赤文字部分がさらに追加した再生機能の内容です。

　[プログラムを表示]

//円のXY座標の変数を用意する
int x,y;
//円の座標とマウス座標の差分（ずれ）の変数
int dx,dy;
//ドラッグ開始終了のフラグ
boolean startDrag;
//円の半径
int r=30;

//記録中／記録停止のフラグ
boolean startRecord;
//座標記録用の配列を用意し、内容を空にしておく。
int[] xPos={};
int[] yPos={};

//消去用に空の配列を用意しておく
int[] clearArray={};

boolean startPlay;//再生用フラグ
int count;//再生用カウンタ変数

void setup(){
  size(600,600);//画面サイズ設定
  smooth();//滑らかな描画にする
  stroke(255);//線色を白
  fill(0);//塗り色を黒
  x=width/2;//円を画面中心に配置しておく
  y=height/2;
}

void draw(){
  background(0);//背景色（黒）

  //ドラッグ中の場合
  if(startDrag==true){
    //マウス座標に差分を加えた値を円の座標に代入
    x=mouseX+dx;
    y=mouseY+dy;
  }

  //記録中の場合
  if(startRecord==true){
    xPos=append(xPos,x);//座標値を配列に付け加えていく
    yPos=append(yPos,y);
  }

  //再生中の場合
  if(startPlay==true){
    //カウンタ変数に合わせてXY座標の配列の値を円の座標に代入していく
    x=xPos[count];
    y=yPos[count];
    fill(0,255,0);//塗色を緑にする
    count++;//カウンタ変数を増加させる
    if(count>xPos.length-1){//カウント数が配列データの個数以上になったら
      startPlay=false;//再生停止にする
      count=0;//カウンタ変数をゼロに戻す
      println("Finish Playing");//再生終了の出力
      fill(0);//塗色を黒に戻す
    }
  }

  //円を描画する 
  ellipse(x,y,r*2,r*2);
}

void mousePressed(){
  //円中心座標とマウス座標の距離が円半径以内の場合
  if(dist(x,y,mouseX,mouseY)<=r){
    //ドラッグ用フラグをtrue（ドラッグ中）にする
    startDrag=true;
    //円の座標とマウス座標の差分を求めておく
    dx=x-mouseX;
    dy=y-mouseY;
  }
}

void mouseReleased(){
  //ドラッグ用フラグをfalse（ドラッグなし）にする
  startDrag=false;
}

void keyPressed(){
  //記録用の処理
  if(key=='r'){//「r」キーを押した場合
    if(startRecord==true){//記録中の場合
      startRecord=false;//記録なしに戻す
      fill(0,0,0);//円の塗色を黒に戻す
    }else{//記録なしの場合
      startRecord=true;//記録中にする
      fill(255,0,0);//円の塗色を赤にする
    }
  }

  //保存用の処理  
  if(key=='s'){//「s」キーを押した場合
    //ファイル選択画面で保存先を決める
    String savePath = selectOutput();
    //保存先のパスが空ではないとき
    if (savePath != null) {
      //保存用のインスタンスを用意する
      PrintWriter output;
      //保存先にファイルを生成
      output=createWriter(savePath);
      //配列に含まれる値を出力する
      for(int i=0;i<xPos.length;i++){
        output.println(xPos[i]+","+yPos[i]);//X座標+コンマ+Y座標+改行
      }
      output.flush();//データ保存
    }
  }

  //記録内容を消去する処理
  if(key=='c'){//「c」キーを押した場合
    xPos=clearArray;//X座標の配列に空の配列を代入し、内容を消去
    yPos=clearArray;//Y座標の配列に空の配列を代入し、内容を消去
  }

  //再生用の処理
  if(key=='p'){
    //記録されているデータがある場合
    if(xPos.length>0){
      startPlay=true;//再生中にする
    }
  }

  //ファイルデータ読み込みの処理
  if(key=='l'){//「l」キーを押した場合
    //読み込みファイルパスの指定
    String loadPath = selectInput();
    //パスが空ではないとき
    if (loadPath != null){
      //座標用配列に空の配列を代入し、内容を消去しておく
      xPos=clearArray;
      yPos=clearArray;
      //文字列の配列を用意し、データを行ごとに配列に代入する（読み込む）
      String[] lines=loadStrings(loadPath);
      //各行ごとに、文字列データをXとYの座標の数値に変換する
      for (int i=0; i<lines.length; i++) {//行数の分だけ繰り返し処理する
        //コンマ記号を境目に文字列データを分割し、数値用の配列に代入
        int[] data=int(split(lines[i],','));
        //数値用配列のはじめの値をX座標用配列に追加していく
        xPos=append(xPos,data[0]);
        //数値用配列のつぎの値をY座標配列に追加していく
        yPos=append(yPos,data[1]);
      }
    }
  }
}

「p」キーを押すことで、再生用フラグstartPlayがtrueになり、ループ内で再生用の処理が行われます。変数countを用意しループするごとにcountを+1ずつ増加させ、配列内の座標データをひとつずつ円の座標に代入していきます。配列内のデータ数をxPos.lengthで調べ、最後のデータまで読み込んだら再生用フラグstartPlayをfalseにし再生停止させます。
「l」キーを押し、selectInput()によってファイル選択画面が現れ、保存したファイルを選択します。選択したファイル内のデータをloadStrings()によって、「X座標値＋コンマ＋Y座標値」という一行ずつの文字列をsplit()でコンマ記号を境目として二つのデータに分けて、同時にそれら文字列をint()で整数化し、append()によって座標用の配列xPosとyPosに追加していきます（代入する前にxPosとyPosを空の配列にしておきます）。

誤作動が起こらないように、再生中はキー入力を禁止したり、読み込まれるファイルが相応しくない場合の例外処理などが実際には必要になりますが、今回のプログラムでは省略しています。

FILCO ポータブルタッチパッド スマートトラックライト ATP-400UB

posted with amazlet at 09.03.30

ダイヤテック (2008-06-26)
売り上げランキング: 19889

Amazon.co.jp で詳細を見る

Processing サウンド/Sonia JSynプラグイン

Processingのサウンドライブラリの「Sonia」を、MacOSX（Intel）で使用する場合、新たにJSynプラグインをインストールする必要があります。現ライブラリフォルダにはMacOSX（PowerPC版）のJSyncプラグインしか含まれていないようです。
ここをクリックすると、インストール画面に移動します。移動先のページ上の「Click Here to Install JSyn Plugin」のボタンを押して新しいバージョンのJSyncプラグインをインストールしてください。

関連：
「Processing　サウンド４／スクラッチ」--Soniaライブラリを使って曲をスクラッチ演奏する
「Processing　サウンド３／テンポ」--Soniaライブラリで音源再生のテンポ変換をする
「Processing　サウンド２／逆再生」--Soniaライブラリで逆再生の音源をつくる
「Processing　サウンド１／Sonia」--Soniaライブラリで音源の再生／停止／ポーズする

Arduino Ethernet Shield

今回は、Arduino Ethernet Shield（スイッチサイエンス／ストロベリーリナックスにて販売）を使って、Arduinoをサーバとして機能させ、Webブラウザ（IE、Safari、FireFoxなど）から閲覧可能なページの表示実験を行いたいと思います。
そのために、Arduino開発環境の最新版「Arduino 0012」に含まれている「Ethernetライブラリ」を使います。
＊Arduino MegaとEthernet Shieldを重ねて使う場合の説明はこちら。


（Arduino Ethernet Shield）


Arduinoのサイトによれば、デジタルI/Oピンの11、12、13番ピンはSPI通信に使われているようなので、それらのピンにはセンサなどを接続しないことにします。


今回は、Arduino 0012に含まれている「Web Server」というサンプル（File>Sketchbook>Examples>Library-Ethernet>Web Server）を参考にブラウザで閲覧可能なWebベージを表示させます。元々のサンプルでは、アナログ入力値をWebページに表示させていますが、ブラウザのタイトルバーの表示文字、リンクさせた画像の表示など多少変更した内容にしてみます。
基本的な入力情報として、

・MACアドレス
・サーバのIPアドレス
・ポート番号

が必要となります。尚、ローカルネットワーク内から閲覧できる設定にします。

Arduinoのプログラム（サーバ）：

//イーサネットライブラリを取り入れる
#include <Ethernet.h>

//MAC ID（各シールドに記載）
byte mac[] = { 0x00, 0x50, 0xC2, 0x97, 0x20, 0x11 };
//サーバ用IPアドレスの設定
byte ip[] = { 192, 168, 3, 100 };
//ポート設定（80：HTTPプロトコル）
Server server(80);

void setup(){
  //イーサネット通信開始
  Ethernet.begin(mac, ip);
  //サーバ開始
  server.begin();
}

void loop(){
  //クライアントからのデータ受信
  Client client = server.available();
  //クライアントからの受信がある場合
  if (client) {
    //ブラウザからのHTTPリクエストの空白行の有無のフラグ
    boolean current_line_is_blank = true;

    //クライアントとの接続中の処理
    while (client.connected()) {
      //クライアントから受信データがあるとき
      if (client.available()) {
        //HTTPリクエスト（受信データ）を一つずつ読み込む
        char c = client.read();
        //HTTPリクエストにラインフィード（改行）があり、
        //現在空白行である場合
        if (c == '\n' && current_line_is_blank) {
          //HTTPレスポンス（返信）
          server.println("HTTP/1.1 200 OK");//リクエスト成功
          server.println("Content-Type: text/html");//HTML文書形式
          server.println();//空白行を入れる

          //タイトルバー表示
          server.println("<title>KOUSAKU WEB SITE</title>");        
          server.print("ANALOG INPUT: ");//文字表示
          server.print(analogRead(0));//アナログ入力値
          server.println("<br/>");//改行
          //リンク画像表示
          server.println("<img src=\"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaheaHbQ3daidUYbowV86kuQZ_KEFKepS8OSdQpKmfQTKJPJObPSP6EhPBS-tk-zBwZ1lTEDlUhcfi9d7DxbaO0nzj3W2qkHQFgbsXgLiIGrxNnX3IR50H_YSkfuYKezThpK_vU7TPe4Y2/s400/ethernet.png\">");
          server.println("<br/>");//改行
          //このブログへのリンク
          server.println("<a href=\"http://kousaku-kousaku.blogspot.com\">GO TO: KOUSAKU BLOG PAGE<a>");
          break;
        }
        if (c == '\n') {//読み込んだ文字がラインフィードの場合
          //現在の行を空白行とみなす
          current_line_is_blank = true;
        } else if (c != '\r') {//読み込んだ文字がキャリッジリターン以外の場合
          //現在の行を空白行としない
          current_line_is_blank = false;
        }
      }
    }
    delay(1);
    client.stop();
  }
}

Arduino基板のアナログ入力０番端子に可変抵抗器をひとつ接続し、その読み取り値もページに表示されます。Arduinoのプログラム上では、MACアドレス、IPアドレス、ポート番号をそれぞれ設定しておき（説明以下）、クライアントのブラウザからの「HTTPリクエスト」（説明以下）を受け、「HTTPリクエスト」内の空白行を確認したら、「HTTPレスポンス」（説明以下）を返します。そのとき同時にHTML形式のページ表示内容データも送信されます。送信されたら、client.stop()で、クライアントとの接続を一旦停止します。再度、クライアントから「HTTPリクエスト」があれば、同様に処理されます。

「MACアドレス」：
MACアドレスは、Ethernet Shield固有のアドレスであり（ハードウェアごとに異なる）、スイッチサイエンスから購入したものであれば、Ethernet Shield裏面に貼られたシールに記載されている「00-50-C2-97-20-11」のような１６進数の６つの数値です。これらの数値を１６進数表記であたまに「0x」を付け加え記入しておきます。
もし、MACアドレスが不明の場合は、MacOSXなら「アプリケーション>ユーティリティ」内にある「ターミナル」を起動し、「ping -c 3 192.168.3.100」（IPアドレスは設定したものを入力してください）というように入力しリターンキーを押してください。その後、「arp -a」を入力しリターンキーを押すと、入力したIPアドレスの右横にMACアドレスが表示されます。
Windowsの場合、アクセサリ内の「コマンドプロンプト」を起動して、「ping 192.168.3.100」（「ping」の後に半角スペースを入れ、設定したEthernet ShieldのIPアドレスを入力）を入力しリターンキーを押すと、返答として「reply from...」などと数行表示されます。その後、すぐに「arp -a」を入力しリターンキーを押せば、Ethernet ShieldのIPアドレスの右横にMACアドレス（Physical Address）が表示されるはずです。

「IPアドレス」：
IPアドレスを設定するには、Ethernet Shieldに接続するイーサネットケーブルをコンピュータに接続し、まずイーサネット経由でのコンピュータのIPアドレスを調べてみます。IPアドレスが「192.168.3.xxx」であれば、最後の桁に任意の数値（他のIPアドレスと重ならないような数値）を入力すれば、大丈夫なはずです（今回の場合は「100」にしました）。同時に、ルータ（gateway）のIPアドレスも調べておくといいでしょう。この場合「192.168.3.1」（最後の桁が「1」）になっているはずです。
「ターミナル（MacOSX）」や「コマンドプロンプト（Windows）」で、MACアドレスを調べると（前述）、ルータのIPアドレスやMACアドレスも表示されるはずです。
尚、「Processing　HTTPサーバ/Webページ表示」の冒頭でも、IPアドレスの調べ方について記載しているので参照して下さい。

「ポート」：
ポートは、通常のインターネットで使用している「80」に設定されています（プロトコル：HTTP用）。例えば任意のポート「12345」に設定する場合、ブラウザ上でIPアドレスを入力する際に「http://196.168.3.100:12345」というように「:12345」をIPアドレスの後ろに付け加えます。

「HTTPリクエスト」：
通常、ブラウザからURLを入力しページを表示させる場合、「GET / HTTP/1.1」（HTTPリクエスト）というサーバへの要求内容が送信されます。「GET /index.html HTTP/1.1」にすれば、サーバ上の「index.html」を指定して表示要求することもできます。
実際のブラウザ「Fire Fox 3.0.3」からサーバへ送信されるHTTPリクエストは、以下のような内容になっていました。

GET / HTTP/1.1　（リクエスト行）
Host: 192.168.3.100:12345　（メッセージヘッダ：以下の空白行手前まで）
User-Agent: Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10.4; ja-JP-mac; rv:1.9.0.3) Gecko/2008092414 Firefox/3.0.3
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-us;q=0.7,en;q=0.3
Accept-Encoding: gzip,deflate
Accept-Charset: Shift_JIS,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Cache-Control: max-age=0
（空白行）
（メッセージボディ：今回は特に何も送るデータは含まれていない）

「リクエスト行」では、サーバへの要求内容が書かれています。
「メッセージヘッダ」では、サポートされるデータ形式や言語などの様々な情報が記載されています。
「空白行」を挿入することで、要求内容の終わり部分を知らせます。
「メッセージボディ」は、サーバに入力情報などを送る際に使われます。
各行末には「\r\n」（CR+LFの改行コード）がついていました。


「HTTPレスポンス」：
サーバはブラウザからのHTTPリクエストを受け取って、「HTTP/1.1 200 OK」という受信確認した返事を返してきます。「200」はHTTPステータスコードと呼ばれ、「Not Found」（ページが見当たらない）の場合は「404」を返します。
「content-type:text/html」は、内容がHTML文書であるという形式について返答しています。
その後で、println()で空白行を送信します（CR+LF／キャリッジリターン+ラインフィードを送信）。
次に、HTMLなどのコンテンツを送ります。
つまり、以下のような内容になります。

HTTP/1.1 200 OK　　　　（ステータス行）
content-type:text/html （メッセージヘッダー）
　　　　　　　　　　　 （空白行:CR+LF）
<html>　　　　　 　　　（メッセージボディ）
<head>...</head>
<body>...</body>
</html>

コンテンツはHTML形式で、println()の括弧内に記述します。基本的に<>（タグ）で囲い、ブラウザのタイトルバーを表示させるために「<title>KOUSAKU WEB SITE</title>」としています。ひとつ問題になることは、println()の括弧内に「"..."」ダブルクオーテーションマークで文字列をくくらなければならないのですが、画像リンクやURLリンク先を記入する場合に「"」を文字列として扱いたい時、そのまま入力するとエラーになってしまうので、「"」を「\"」に置き換えて入力します（エスケープシーケンス）。そのため、「println("<img src="リンク先URL">")」（二重に「"」で括られてしまう）を「println("<img src=\"リンク先URL\">")」という表記にします。<br/>は、ブラウザ表示される際の改行です。

「ブラウザ上での閲覧」：
ポートを「80」に設定している場合、「http://192.168.3.100」（設定したIPアドレス）を入力しリターンキーを押せば、Arduino Ethernet Shieldからデータが送られ、ブラウザにコンテンツが表示されるはずです。
ポートを「12345」などの任意の番号にしている場合、「http://192.168.3.100:12345」というように、アドレスの最後に「:12345」（コロンとポート番号）をつけてアクセスして下さい。

「ローカルネットワーク外からのアクセス」：
外部からインターネットによってアクセスする場合は、グローバルIPアドレス、ルータ、ポートマッピングなどの設定が必要になります（「Processing-Arduino　ネットワーク制御」の後半に、ポートマッピングなどの設定方法が書いてあるので参照してください）。
尚、LAN内の別のコンピュータからグローバルIPアドレスを使ってアクセスはできないので、実際にLAN外部からアクセスして見てください。

Arduinoイーサネット・シールド

posted with amazlet at 10.03.31

スイッチサイエンス
売り上げランキング: 15483

Amazon.co.jp で詳細を見る

PLANEX 手のひらサイズ 無線LANポケットルータ (ルータ/AP/コンバータ) GW-MF54G2

posted with amazlet at 09.03.30

プラネックス (2008-01-11)
売り上げランキング: 43

Amazon.co.jp で詳細を見る