NOBODY:PLACE

サンプル

ドキュメントが英語でしかも結構わかりづらいので最低限の設定だけしています。
グラフ上で右クリックすれば、これがFlashではないのがわかると思います。

ソース

基本的にはWeb上のサンプルと同梱のサンプルを参考にしています。
データは配列形式で記述。データ、設定共に別ファイルに分けて読み込むことが出来ます。

<div id="chartdiv" style="width:590px; height:240px;"></div>

<script type="text/javascript" src="http://static.nplll.com/js/lib/amcharts/amcharts.js"></script>
<script type="text/javascript" src="http://static.nplll.com/js/lib/amcharts/raphael.js"></script>
<script type="text/javascript">
var chartData = [
  {date:new Date('2011/4/14'), value:6231},
  {date:new Date('2011/4/15'), value:11056},
  {date:new Date('2011/4/16'), value:5171},
  {date:new Date('2011/4/17'), value:10924},
  {date:new Date('2011/4/18'), value:11283},
  {date:new Date('2011/4/19'), value:7542},
  {date:new Date('2011/4/20'), value:11054},
  {date:new Date('2011/4/21'), value:3770},
  {date:new Date('2011/4/22'), value:9994},
  {date:new Date('2011/4/23'), value:11011},
  {date:new Date('2011/4/24'), value:10169},
  {date:new Date('2011/4/25'), value:11401},
  {date:new Date('2011/4/26'), value:10600},
  {date:new Date('2011/4/27'), value:5388},
  {date:new Date('2011/4/28'), value:10907},
  {date:new Date('2011/4/29'), value:6622},
  {date:new Date('2011/4/30'), value:11085},
  {date:new Date('2011/5/1'), value:6003},
  {date:new Date('2011/5/2'), value:11383},
  {date:new Date('2011/5/3'), value:5817},
  {date:new Date('2011/5/4'), value:11201},
  {date:new Date('2011/5/5'), value:10388},
  {date:new Date('2011/5/6'), value:7668},
  {date:new Date('2011/5/7'), value:10907},
  {date:new Date('2011/5/8'), value:10403},
  {date:new Date('2011/5/9'), value:10018},
  {date:new Date('2011/5/10'), value:11016},
  {date:new Date('2011/5/11'), value:11055},
  {date:new Date('2011/5/12'), value:11054},
  {date:new Date('2011/5/13'), value:11099}
];

(function() {
  /* 基礎設定 */
  var chart = new AmCharts.AmSerialChart();
  chart.dataProvider      = chartData;    /* データ配列 */
  chart.pathToImages      = '/images/';   /* イメージフォルダ */
  chart.categoryField     = 'date';       /* X軸の要素名 */
  chart.marginTop         = 30;           /* グラフの上マージン */
  chart.marginRight       = 0;            /* グラフの右マージン */
  chart.marginBottom      = 20;           /* グラフの下マージン */
  chart.marginLeft        = 60;           /* グラフの左マージン */
  chart.panEventsEnabled  = true;
  /* X軸 */
  var catAxis             = chart.categoryAxis;
  catAxis.parseDates      = true;         /* X軸が日付かどうか */
  catAxis.minPeriod       = 'DD';         /* X軸の単位 */
  catAxis.inside          = false;        /* X軸のラベルをグラフの内部に描くかどうか */
  catAxis.gridAlpha       = 0.25;         /* 縦軸補助線の透過度 */
  catAxis.dashLength      = 5;            /* 縦軸補助線の点線のスタイル */
  catAxis.tickLength      = 0;
  /* Y軸 */
  var valueAxis           = new AmCharts.ValueAxis();
  valueAxis.dashLength    = 4;            /* 横軸補助線の透過度 */
  valueAxis.axisAlpha     = 0;            /* 横軸の透過度 */
  chart.addValueAxis(valueAxis);
  /* グラフ設定 */
  var graph               = new AmCharts.AmGraph();
  graph.valueField        = 'value';      /* 値の要素名 */
  graph.type              = 'line';       /* グラフの種類 */
  graph.lineColor         = '#ff0000';    /* グラフの線の色 */
  graph.lineThickness     = 3;            /* グラフの線の太さ */
  chart.addGraph(graph);

  var chartCursor = new AmCharts.ChartCursor();
  chart.addChartCursor(chartCursor);

  chart.write('chartdiv');
})();
</script>

ダウンロード/インストール

amChartsから「amCharts Flash & JavaScript bundle」をダウンロード。

amCharts: Download flash charts and graphs

ダウンロードしたら解凍して、ファイルを配置。
最低限「amcharts.js」「raphael.js」の2つを配置すればOK。

ブラウザ毎の動作状況

• Internet Explorer 8 → ○
• Firefox 4.01 → ○
• Google Chrome 11 → ○
• Safari 5.05 → ○
• Opera 11.01 → ○

サイトに書いてあるとおり、モダンブラウザなら問題なく動くようです。iPhoneでも確認できました。

Our JavaScript charts support all modern browsers including (but not limited to) modern versions of Firefox, Chrome, Safari, Opera and Internet Explorer. It also runs on mobile devices powered by iOS (iPad, iPhone, iPod Touch) and Android Honeycomb. It demonstrates stellar performance in hardware-accelerated Internet Explorer 9 which reaffirms it's bright future.

案外さくさく動きますね。

古いブラウザを考慮しなくて良い環境であれば、便利かも知れません。