カーセンサーラボから取得できるXMLデータ内には色別の台数情報も含まれています。ここでは、指定したキーワードで検索した結果を色別で表示させてみます。
中古車を検索するには以下のURLにアクセスします。これは前回と同様のアドレスです。
http://www.carsensorlab.net/webapi/V1/usedCarSearch/
この時に「日産」や「トヨタ」などのキーワードを指定すると、該当する中古車の情報を返します。複合条件の場合には半角空白で区切って入力します。サンプルではトヨタになっていますが、キーワードを指定すれば、どのメーカーの情報でも取得できます。
中古車情報のXMLデータの中に含まれる色別台数はsummary_colorタグ内にあります。このタグの中にあるcolorタグの数が車の色に対応しています。colorタグ内にはvalueとcountタグがあります。valueタグの最初のノードの値が色の名前になります。countタグの最初のノードの値が、valueタグで示された色の車の台数を示しています。colorタグの個数だけ繰り返し処理を行えば色別台数を表示させることができます。（実際の
サンプルを実行する）
＊非常に反応が悪いことがあります。30秒以上何も表示されないことがありますが、表示されない場合120秒くらいは待ってみてください。
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>カーセンサーラボ Ajaxサンプル</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript"><!--
function getUsedCar()
{
$("result").innerHTML = "検索中です...";
var query = encodeURIComponent($F("searchWord"));
var reqURL = "http://www.carsensorlab.net/webapi/V1/usedCarSearch/?word=";
new Ajax.Request("getXML.rb?"+reqURL+query, { method: "get", onComplete: displayData });
}
function displayData(httpObj)
{
var xmlObj = httpObj.responseXML;
total = xmlObj.getElementsByTagName("response_total_count");
n = total[0].firstChild.nodeValue;
txt = n+"件の中古車が見つかりました<br><br>";
sumYear = xmlObj.getElementsByTagName("summary_color");
year = sumYear[0].getElementsByTagName("color");
for (var i=0; i<year.length; i++)
{
y = year[i].getElementsByTagName("value")[0].firstChild.nodeValue
cnt = year[i].getElementsByTagName("count")[0].firstChild.nodeValue;
txt += y + "色は"+cnt+"台あります<br>";
}
$("result").innerHTML = txt;
}
// --></script>
</head>
<body>
<h1>カーセンサーラボ Ajaxサンプル (中古車検索：カラー別)</h1>
<form onsubmit="returen false">
<input type="text" value="トヨタ" id="searchWord"><br>
<input type="button" value="中古車検索" onClick="getUsedCar()">
</form>
<div id="result"></div>
</body>
</html>
[
目次へ]
(2006.6.10)