mixiグラフ

マイミクをSpringGraphを使って表示してみました。SpringGraphを使っているのでうにうに動きます。
実際の動作はこちら
IDにはプロフィールを表示したときに出るものを使用。
http://moeten.info/flex/20080510_mixiGraph/bin-release/main.html
マイミクのマイミクが表示できたらいいんだけど、どうやらＡＰＩにはその機能がないっぽい。

動作ムービーはこちら

マイミク情報取得はPHPのPEARのservice_mixiapiを使用
http://d.hatena.ne.jp/shimooka/20080318
表示部分はFlexのSpringGraphコンポーネントを使用してます。
http://mark-shepherd.com/SpringGraph/RoamerDemo/bin/RoamerDemo.html
PHPの部分
サービスmixiapiをインストール

$ sudo pear install -af http://www.doyouphp.jp/pear/Services_MixiAPI-0.1.1.tgz
$ sudo pear upgrade http://www.doyouphp.jp/pear/Services_MixiAPI-0.1.1.tgz

mixiの情報を表示するプログラム。Flex用にXMLで出力してます。

<?php
ini_set("include_path", dirname(__FILE__)."/src/" . PATH_SEPARATOR . ini_get("include_path"));
require_once "Services/MixiAPI/Factory.php";
function h($str){
    if(is_array($str)){
        return array_map( "h",$str );
    }else{
        return htmlspecialchars($str,ENT_QUOTES);
    }
}
$user = $_GET['user'];
$pass = $_GET['pass'];
$id   = $_GET['id'];
$type = $_GET['type'] ? $_GET['type']:"mymixi";
$items = array();
$i = 0;
if( $type == "footprint" ){
    //足跡
    $service = Services_MixiAPI_Factory::getInstance(
                                                     Services_MixiAPI_Factory::API_MODE_FOOTPRINT,
                                                     $user, $pass, $id);
    $service->execute();
    $xml = new SimpleXMLElement($service->get());
    foreach ($xml->entry as $entry) {
        $updated_iso8601 = $entry->updated;
        $updated = date('Y/m/d H:i:s', mktime(substr($updated_iso8601, 11, 2),
                                              substr($updated_iso8601, 14, 2),
                                              substr($updated_iso8601, 17, 2),
                                              substr($updated_iso8601, 5, 2),
                                              substr($updated_iso8601, 8, 2),
                                              substr($updated_iso8601, 0, 4)
                                              ));
        $items[$i]["name"]     = $entry->author->name;
        $items[$i]["link"]     = $entry->link['href'];
        $items[$i]["updated"]  = $updated;
        $i++;
    }
 }elseif( $type == "mymixi" ){
     //マイミク一覧
     $service = Services_MixiAPI_Factory::getInstance(
                                                      Services_MixiAPI_Factory::API_MODE_MYMIXI,
                                                      $user, $pass, $id);
     $service->execute();
     $xml = new SimpleXMLElement($service->get());
     foreach ($xml->entry as $entry) {
         //tag:mixi.jp,2007:friends-240317-18195583
         $id = $entry->id;
         $id_arr = explode( "-" , $id );
         $id_arr[1];
         $id_arr[2];
         $items[$i]["id"]       = $id_arr[2];
         $items[$i]["name"]     = $entry->title;
         $items[$i]["category"] = $entry->category['label'];
         $items[$i]["link"]     = $entry->link[0]['href'];
         $items[$i]["icon"]     = $entry->icon;
         $i++;
     }
  }elseif( $type  == "whatsnew" ){
      //マイミク日記、コミュニティなど最新更新一覧
      $service = Services_MixiAPI_Factory::getInstance(
                                                       Services_MixiAPI_Factory::API_MODE_WHATSNEW,
                                                       $user, $pass, $id);
      $service->execute();
      $xml = new SimpleXMLElement($service->get());
      foreach ($xml->entry as $entry) {
          switch ($entry->category['term']) {
          case 'diary':
              $updated_iso8601 = $entry->updated;
              $updated = date('Y/m/d H:i:s', mktime(substr($updated_iso8601, 11, 2),
                                                    substr($updated_iso8601, 14, 2),
                                                    substr($updated_iso8601, 17, 2),
                                                    substr($updated_iso8601, 5, 2),
                                                    substr($updated_iso8601, 8, 2),
                                                    substr($updated_iso8601, 0, 4)
                                                    ));
              $items[$i]["name"]     = $entry->author->name;
              $items[$i]["content"]  = h($entry->content);
              $items[$i]["updated"]  = $updated;
              $items[$i]["category"] = "diary";
              $i++;
              break;
          case 'comment':
          case 'album':
          case 'video':
              $items[$i]["name"]     = $entry->author->name;
              $items[$i]["title"]    = h($entry->title);
              $items[$i]["updated"]  = $updated;
              $items[$i]["content"]  = h($entry->content);
              $items[$i]["link"]     = h($entry->link['href']);
              $items[$i]["category"] = "video";
              $i++;
              break;
          case 'bbs':
              break;
          default:
          }
      }
   }
$XML = <<<EOD
<result>
EOD;
foreach( $items as $key => $val ){
    $XML .= <<<EOD
<items>
EOD;
    foreach( $val as $mykey => $myval ){
        $XML .= <<<EOD
 <{$mykey}>{$myval}</{$mykey}>
EOD;
    }
    $XML .= <<<EOD
</items>
EOD;
}
$XML .= <<<EOD
</result>
EOD;
header ("Content-Type: text/xml; charset=UTF-8");
echo $XML;
exit;
?>

Flexの部分です。

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication  xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientAlphas="[0.8, 0.8]"
     showStatusBar="false"
    backgroundAlpha="0.8"
    verticalScrollPolicy="off" horizontalScrollPolicy="off"
    creationComplete="init()"
    xmlns:fc="http://www.adobe.com/2006/fc"
     verticalAlign="middle" horizontalAlign="center" width="1202" height="800"
     borderStyle="solid" borderThickness="0" backgroundGradientColors="[#FFFFFF, #FFFFFF]">
    <mx:Style>
DataGrid {
   backgroundAlpha: 1;
   backgroundColor: #ff8d24;
   alternatingItemColors: #ffab11, #eff1f2;
   horizontalGridLines: true;
   horizontalGridLineColor: #ffa92a;
   verticalGridLines: true;
   borderThickness: 0;
   textIndent: 0;
   dropShadowEnabled: true;
   headerStyleName: "mydataGridHeaderStyle";
}
.mydataGridHeaderStyle {
   color: #f3882f;
}
</mx:Style>
<mx:Script>
<![CDATA[
import mx.effects.easing.*;
//初期化関数
private function init():void{
    myForm.visible = true;
}
//mixi問い合わせ
private function onSend():void{
    mixiServiceM.send({
        "user":accountText.text,
        "pass":passwordText.text,
        "id"  :idText.text
    });
    mixiServiceF.send({
        "user":accountText.text,
        "pass":passwordText.text,
        "id"  :idText.text
    });
    mixiServiceW.send({
        "user":accountText.text,
        "pass":passwordText.text,
        "id"  :idText.text
    });
}
//mixi問い合わせ完了
private function onResultM():void{
    myCanvas.visible = true;
    myForm.visible = false;
    s.visible      = true;
    //親アイテム作成
    makeParent();
    //子アイテム作成
    for( var cnt:int = 0 ; cnt < mixiServiceM.lastResult.items.length() ; cnt ++ ){
        //アイテムの作成
        var item:AmazonItem = new AmazonItem( mixiServiceM.lastResult.items[cnt].id , mixiServiceM.lastResult.items[cnt].name );
        item.imageUrl = mixiServiceM.lastResult.items[cnt].icon;
        item.url      = mixiServiceM.lastResult.items[cnt].link;
        g.add(item);
        //リンク
        if(prevItem != null){
            g.link(item, prevItem );
        }
        s.dataProvider = g;
    }
}
//親アイテム作成
private function makeParent():void{
    var item:AmazonItem = new AmazonItem( idText.text , "parent"  );
    prevItem = item;
    g.add(item);
}
import com.adobe.flex.extras.controls.springgraph.Item;
import com.adobe.flex.extras.controls.springgraph.Graph;
private var g: Graph = new Graph();
private var prevItem: Item;
private var itemCount: int = 0;
public function onClick( url:String ):void{
    myCanvasHtml.visible = true;
    myHtml.location = url;
}
]]>
</mx:Script>
<!--##################### エフェクト #####################-->
<mx:Sequence id="formShow">
    <mx:Move yFrom="100" yTo="300" easingFunction="Back.easeOut"/>
</mx:Sequence>
<mx:Sequence id="formHide">
    <mx:Move yTo="-300" easingFunction="Back.easeIn"/>
</mx:Sequence>
<mx:Sequence id="sShow">
    <mx:Zoom zoomHeightFrom="0.5" zoomHeightTo="1.0" zoomWidthFrom="0.5" zoomWidthTo="1.0"/>
</mx:Sequence>
<mx:Sequence id="sHide">
    <mx:Zoom zoomHeightFrom="1.0" zoomHeightTo="0.5" zoomWidthFrom="1.0" zoomWidthTo="0.5"/>
    <mx:Fade alphaFrom="1.0" alphaTo="0"/>
</mx:Sequence>
<mx:Sequence id="canvasShow">
    <mx:Move xFrom="-300" xTo="10"/>
</mx:Sequence>
<mx:Sequence id="canvasHide">
    <mx:Move xFrom="10" xTo="-300"/>
</mx:Sequence>
<mx:Sequence id="canvasHtmlShow">
    <mx:Move yFrom="{this.height}" yTo="0"/>
</mx:Sequence>
<mx:Sequence id="canvasHtmlHide">
    <mx:Move yTo="{this.height}"/>
</mx:Sequence>
<!--##################### HTTPサービス #####################-->
<mx:HTTPService id="mixiServiceM"  url="http://localhost/tmp/mixi/mixi.php?type=mymixi"    method="GET" useProxy="false" resultFormat="e4x" result="onResultM()"/>
<mx:HTTPService id="mixiServiceF"  url="http://localhost/tmp/mixi/mixi.php?type=footprint" method="GET" useProxy="false" resultFormat="e4x"/>
<mx:HTTPService id="mixiServiceW"  url="http://localhost/tmp/mixi/mixi.php?type=whatsnew"  method="GET" useProxy="false" resultFormat="e4x"/>
<!--##################### コンポーネント #####################-->
<!--スプリンググラフ-->
<fc:SpringGraph id="s" backgroundColor="#FFB724"  showEffect="sShow" hideEffect="sHide" width="945" height="767" visible="true" backgroundAlpha="0"
    lineColor="#6666ff" repulsionFactor="0.5" x="196" y="10">
    <fc:itemRenderer>
        <mx:Component>
            <mx:VBox backgroundAlpha="1" backgroundColor="0x444444" paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5"
                cornerRadius="10" borderStyle="solid" borderThickness="1" borderColor="#FFBE58" verticalGap="2" horizontalGap="2"
                width="60" textAlign="center"  verticalScrollPolicy="off" horizontalScrollPolicy="off"
                doubleClickEnabled="true" doubleClick="{outerDocument.onClick(data.url)}">
                <mx:Label text="{data.id}" fontSize="10" color="0xffffff"    textAlign="center" />
                <mx:Label text="{data.name}" fontSize="10" color="0xffffff"    textAlign="center"/>
                <mx:Image source="{data.imageUrl}" width="30" height="30"/>
            </mx:VBox>
            </mx:Component>
    </fc:itemRenderer>
</fc:SpringGraph>
<!--ID Passwd入力フォーム-->
<mx:Form id="myForm" backgroundColor="#FFFFFF" backgroundAlpha="1" borderStyle="solid" visible="false"
     mouseDown="this.nativeWindow.startMove()"
    showEffect="formShow" hideEffect="formHide"
    borderColor="#FFB359" alpha="1.0" cornerRadius="20" themeColor="#4BA5DE" borderThickness="6" dropShadowEnabled="true" dropShadowColor="#852F00" x="415" y="822">
    <mx:FormItem label="account">
        <mx:TextInput id="accountText"/>
    </mx:FormItem>
    <mx:FormItem label="passwowrd">
        <mx:TextInput displayAsPassword="true" id="passwordText"/>
    </mx:FormItem>
    <mx:FormItem label="id">
        <mx:TextInput id="idText"/>
    </mx:FormItem>
    <mx:FormItem label="送信">
        <mx:Button label="送信" click="onSend()"/>
    </mx:FormItem>
</mx:Form>
<!--mixiデータ一覧-->
    <mx:VBox id="myCanvas" x="10" y="10" width="178" height="754" visible="false" showEffect="canvasShow" hideEffect="canvasHide" backgroundAlpha="0.8" backgroundColor="0xffffff">
        <mx:Label x="10" y="10" text="マイミク"/>
        <mx:DataGrid x="0" y="36" dataProvider="{mixiServiceM.lastResult.items}" height="200" width="100%">
            <mx:columns>
                <mx:DataGridColumn headerText="列 1" dataField="id" visible="false"/>
                <mx:DataGridColumn headerText="列 2" dataField="name"/>
                <mx:DataGridColumn headerText="列 3" dataField="category" visible="false"/>
                <mx:DataGridColumn headerText="列 3" dataField="link" visible="false"/>
                <mx:DataGridColumn>
                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:Image source="{data.icon}" width="40" height="40" />
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
        <mx:Label x="10" y="345" text="足跡"/>
        <mx:DataGrid x="0" y="371" dataProvider="{mixiServiceF.lastResult.items}" width="100%" height="201">
            <mx:columns>
                <mx:DataGridColumn headerText="列 2" dataField="name"/>
                <mx:DataGridColumn headerText="列 3" dataField="link" visible="false"/>
                <mx:DataGridColumn headerText="列 3" dataField="updated"/>
            </mx:columns>
        </mx:DataGrid>
        <mx:Label x="10" y="643" text="最新情報"/>
        <mx:DataGrid x="0" y="669" dataProvider="{mixiServiceW.lastResult.items}" width="100%" height="260">
            <mx:columns>
                <mx:DataGridColumn headerText="列 1" dataField="name"/>
                <mx:DataGridColumn headerText="列 1" dataField="title" visible="false"/>
                <mx:DataGridColumn headerText="列 1" dataField="updated"/>
                <mx:DataGridColumn headerText="列 1" dataField="content" visible="false"/>
                <mx:DataGridColumn headerText="列 1" dataField="link"/>
                <mx:DataGridColumn headerText="列 1" dataField="category"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:VBox>
<!--HTMLで表示-->
<mx:VBox id="myCanvasHtml" x="196" y="0" width="994" height="770" showEffect="canvasHtmlShow" hideEffect="canvasHtmlHide" visible="false"  horizontalAlign="right">
    <mx:Button x="858" y="0" label="閉じる" click="{myCanvasHtml.visible=false}"/>
    <mx:HTML x="10" y="30" width="100%" height="100%" id="myHtml" backgroundAlpha="0.7"/>
</mx:VBox>
</mx:WindowedApplication>

SpringGraph Flex Component