検索完了時の動作

広告
facebookボタン
googleplusボタン
twitterボタン
ダミーボタン
bloggerボタン
このページに記載されている内容はGoogle Maps API V2用のものであり、最新バージョンのものとは違います。ご注意下さい。

Google検索コントロールで検索が終わった時の動作について2つのプロパティを使って設定を行います。

まず1つ目がsuppressInitialResultSelectionプロパティです。 

suppressInitialResultSelectionプロパティ

このプロパティは、GoogleBar での検索完了時に、最初の検索結果が、それ自体
の 情報ウィンドウ内に表示されないようにします。

値：
  Boolean

suppressInitialResultSelectionプロパティにfalseを設定すると、検索が完了した時点で最初の項目の情報ウィンドウを自動的に表示します。これがデフォルトの動作です。trueを設定すると情報ウィンドウは表示されません。

2つ目がsuppressZoomToBoundsプロパティです。 

suppressZoomToBoundsプロパティ

このプロパティは、GoogleBar での検索完了時に一連の検索結果に自動的にパ
ン/ズームしないようにします。

値：
  Boolean

suppressZoomToBoundsプロパティにfalseを設定すると、検索項目に合わせてズームレベルを調整することがあります。これがデフォルトの動作です。trueを設定するとズームレベルを調整しません。

具体的には次のように記述します。 

var goption = {suppressInitialResultSelection:true,
               suppressZoomToBounds:true};
var option = {googleBarOptions:goption};
var map = new GMap2(document.getElementById("map"), option);

サンプル

では試してみます。

code5_1.js 

function initialize() {
  if (GBrowserIsCompatible()) {
    var gopts = {showOnLoad:true, suppressInitialResultSelection:false};
    var opts = {googleBarOptions:gopts};
    var map = new GMap2(document.getElementById("map_canvas"), opts);
    map.setCenter(new GLatLng(35.698249,139.773152), 15);

    map.enableGoogleBar();
  }
}

map5_1.html 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>サンプル：検索完了時の動作</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=(key)&sensor=false"
            type="text/javascript" charset="utf-8"></script>
    <script src="./js/code5_1.js" type="text/javascript"></script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 400px; height: 400px"></div>
  </body>
</html>

ではブラウザで上記のURLを見てみます。

p5-1

GsuppressInitialResultSelectionプロパティにfalseを指定していますので、検索を行うと最初の項目について自動的に情報ウィンドウが表示されます。これがデフォルトの動作です。

p5-2

次にGsuppressInitialResultSelectionプロパティにtrueを指定したものを試してみます。

code5_2.js 

function initialize() {
  if (GBrowserIsCompatible()) {
    var gopts = {showOnLoad:true, suppressInitialResultSelection:true};
    var opts = {googleBarOptions:gopts};
    var map = new GMap2(document.getElementById("map_canvas"), opts);
    map.setCenter(new GLatLng(35.698249,139.773152), 15);

    map.enableGoogleBar();
  }
}

map5_2.html 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>サンプル：検索完了時の動作</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=(key)&sensor=false"
            type="text/javascript" charset="utf-8"></script>
    <script src="./js/code5_2.js" type="text/javascript"></script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 400px; height: 400px"></div>
  </body>
</html>

今度の場合、GsuppressInitialResultSelectionプロパティにtrueを指定していますので、検索を行っても情報ウィンドウは表示されません。

p5-3

サンプル

次はsuppressZoomToBoundsプロパティのサンプルを試してみます。

code5_3.js 

function initialize() {
  if (GBrowserIsCompatible()) {
    var gopts = {showOnLoad:true, suppressZoomToBounds:false};
    var opts = {googleBarOptions:gopts};
    var map = new GMap2(document.getElementById("map_canvas"), opts);
    map.setCenter(new GLatLng(35.698249,139.773152), 15);

    map.enableGoogleBar();
  }
}

map5_3.html 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>サンプル：検索完了時の動作</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=(key)&sensor=false"
            type="text/javascript" charset="utf-8"></script>
    <script src="./js/code5_3.js" type="text/javascript"></script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 400px; height: 400px"></div>
  </body>
</html>

ではブラウザで上記のURLを見てみます。

p5-4

suppressZoomToBoundsプロパティにfalseを指定していますので、検索を行うと必要に応じてズームレベルの調整を行います。これがデフォルトの動作です。

p5-5

次にsuppressZoomToBoundsプロパティにtrueを指定したものを試してみます。

code5_4.js 

function initialize() {
  if (GBrowserIsCompatible()) {
    var gopts = {showOnLoad:true, suppressZoomToBoundselection:true};
    var opts = {googleBarOptions:gopts};
    var map = new GMap2(document.getElementById("map_canvas"), opts);
    map.setCenter(new GLatLng(35.698249,139.773152), 15);

    map.enableGoogleBar();
  }
}

map5_4.html 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>サンプル：検索完了時の動作</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=(key)&sensor=false"
            type="text/javascript" charset="utf-8"></script>
    <script src="./js/code5_4.js" type="text/javascript"></script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 400px; height: 400px"></div>
  </body>
</html>

今度の場合、suppressZoomToBoundsプロパティにtrueを指定していますので、ズームレベルの調整は行われず検索前のズームレベルのままとなります。。

p5-6

( Written by T.buzz.Ikura+ )

Social Button
Facebook Page