Skip to content

html5_tutorial_Tools

EkispertWebService edited this page Jan 17, 2017 · 3 revisions

WebAPI Document - チュートリアル

  • 拡張ツールパーツ

探索結果のJSONとXMLを相互変換します

''インクルード''

	<script type="text/javascript" src="expGuiTools.js?key=keycode" charset="UTF-8"></script>

''利用例''

	<html>
	  <head>
	    <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
	    <title>
	    Webサービスサンプル
	    </title>
	    <link class="css" rel="stylesheet" type="text/css" href="expCss/expGuiCourse.css">
	    <script type="text/javascript" src="expGuiTools.js?key=keycode">
	    </script>
	    <script type="text/javascript" src="expGuiCourse/expGuiCourse.js?key=keycode">
	    </script>
	    <script type="text/javascript">
	      <!--
	var resultApp;
	var expTools;
	/*
	 * パーツを初期化
	 */
	function init(){
	  // ツール
	  expTools = new expGuiTools();
	  // 経路探索
	  resultApp = new expGuiCourse(document.getElementById("result"));
	}
	/*
	 * 探索ボタンの動作
	 */
	function search(){
	    var searchWord = "";
	    // 発着地リストを作成
	    var viaList="高円寺:東京";
	    searchWord +="viaList="+viaList;
	    searchWord += '&searchType=plain';
	    // 探索結果数
	    searchWord += '&answerCount=5';
	    // 探索を実行
	    resultApp.search(searchWord,resultApp.PRICE_ONEWAY,result);
	}
	/*
	 * 探索実行時のコールバック関する
	 */
	function result(isSuccess){
	  if(!isSuccess){
	    alert("探索結果が取得できませんでした");
	  }else{
	    // JSONのセット
	    var json = resultApp.getResultString();
	    // 文字列のセット
	    document.getElementById("resultJson").value = json;
	    document.getElementById("resultXml").value = expTools.json2xml(json);
	  }
	}
	// -->
	    </script>
	  </head>
	  <body onLoad="Javascript:init();">
	    <table>
	      <tr>
	        <td>
	          <input type="button" value="経路を取得" onClick="Javascript:search();">
	          <br>
	        </td>
	      </tr>
	      <tr>
	        <td>
	          探索結果:変換前のJSONデータ
	        </td>
	      </tr>
	      <tr>
	        <td>
	          <textarea id="resultJson" cols="120" rows="10">
	          </textarea>
	        </td>
	      </tr>
	      <tr>
	        <td>
	          探索結果:変換後のXMLデータ
	        </td>
	      </tr>
	      <tr>
	        <td>
	          <textarea id="resultXml" cols="120" rows="10">
	          </textarea>
	        </td>
	      </tr>
	    </table>
	    <!-- 経路表示パーツ -->
	    <table>
	      <tr>
	        <td>
	          <div id="result">
	          </div>
	        </td>
	      </tr>
	    </table>
	  </body>
	</html>
Clone this wiki locally