StatApiMagic.js のサンプルコード

StatApiMagic　サンプルコード１【 jsonp版　基本の使い方】

<html>
<head>
<meta charset="UTF-8">
<title>StatApiMagic.js　サンプルHTML（jsonp版　基本の使い方）</title>

<script type="text/javascript" src="statapimagic-1.5.js"></script>

<script type="text/javascript">
function OnButtonClick(){

  //変数「req」にAPIのリクエストURLを代入
  var req = 'https://api.e-stat.go.jp/rest/2.1/app/jsonp/getStatsData?';  
      //各種パラメータを付加
      req += 'statsDataId=0003111423&cdArea=26100&startPosition=1&callback=callback&appId=';
      //統計APIのアプリケーションIDを付加
      req += document.getElementById('appid').value ; 

  // 新しいscript要素の生成
  var apiScript = document.createElement("script");
  // src属性にリクエストＵＲＬ追加
  apiScript.src = req; 
  // 要素の最後尾に追加;
  document.body.appendChild(apiScript);
}

function callback(jsonp){

  ///////////  option について  //////////////////
  //  1　：シンプルjson
  //  2　：シンプルjsonコード番号付
  //  3　：統計表情報付シンプルjson
  //  4　：統計表情報付シンプルjsonコード番号付
  //  5　：シンプルcsv
  //  6　：シンプルcsvコード番号付
  //  7　：統計表情報付シンプルcsv
  //  8　：統計表情報付シンプルcsvコード番号付
  //  0　：元のjson
  ////////////////////////////////////////////////

  var option = 3;  //オプション番号を入れます（0～8）
  var simpleString = StatApiMagic(jsonp,option); //こんな感じで使ってください。

  //あとは、シンプル加工されたjson文字列を、再度パースするなりして自由にご活用ください。
  //var jsonParse = JSON.parse(simpleString);

  //とりあえず文字列を画面に表示させてみました。
  document.getElementById('outputArea').innerText = simpleString;
}
</script>

</head>

<body>
<h1>StatApiMagic.js　サンプルHTML（jsonp　基本の使い方）</h1>
<input type="text" id="appid" style="width:400px;" placeholder="取得したアプリケーションIDを入力">
<input type="button" value="APIデータ取得" onclick="OnButtonClick()">
<p id="outputArea" style="font-size:14px;"></p>
</body>
</html>

StatApiMagic サンプルコード１ 【 jsonp版 基本の使い方 】

StatApiMagic　サンプルコード１【 jsonp版　基本の使い方】