店舗ページをGoogleMapへ掲載したい

[a_ya]

すみません、CMSデザイナーを触り始めたばかりの
初心者です。一つ質問させてください。

内容ができるかできないかさえ良く分かっておらず
へんな質問でしたら申し訳ないです。

例えばファミレスなどのように店舗がどんどん増えていく
店舗のグループサイトを作りたいと思っています。

各店舗の詳細ページをCMSデザイナーで自動的に
作成できるようにし、スキーマ項目の中に緯度・経度枠も
作成してエリア毎にグーグルマップでそのお店の位置を
表示させたいです。

GoogleMapへの表示も自動的にされるようにできたら
いいなと思っています。
http://www.careco.jp/stationsearch/area/
↑こんな感じ

そうするには各店舗の緯度と経度をxmlで出す必要があるように
思うのですが、そもそもこのようなことはできるのでしょうか？

マニュアルにxml形式での出力ができるとあったので
…そもそもxmlとFlashやAjaxとの連携をよくわかっていないので
ものすごい勘違いをしているかもしれませんが。

CMSデザイナーを使わない場合は以下のようなソースで
いつもは上記内容を実現させています。

■地図を表示させるhtmlに入れるGoogleMapを読みだすソース
------------------------------------------------------------------------------------------------------------------------------------------------------
<script src="http://maps.google.com/maps?file=api&v= ... E5UbJXAqFw" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[.

//マップの中央座標を設定
//map.setCenter(new GLatLng(lat=緯度, lng=経度), 表示領域);
//map.setCenter(new GLatLng(32.565333, 130.924072), 11);


//GDownloadUrlを使って、xmlファイルをダウンロードする
function addMarker(map1) {
GDownloadUrl("./map.xml",function(data, responseCode) {
var xmlDoc = GXml.parse(data);
var markers = xmlDoc.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var mpoint = new GLatLng(
markers.getAttribute("lat"),
markers.getAttribute("lng")
);
var marker = createMarker(mpoint, markers.getAttribute("html"));
map1.addOverlay(marker);

}
});
}

//マーカーを作る
function createMarker(mpoint, txt) {
var icon = new GIcon();
icon.image = "./map/map_icon.png";
icon.iconSize = new GSize(41, 39);
icon.iconAnchor = new GPoint(10, 34);
icon.infoWindowAnchor = new GPoint(45, 15);


var marker = new GMarker(mpoint,icon);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindow(txt);
});
return marker;
}
function load(){
var map1 = new GMap2( document.getElementById("google_map"));
map1.setCenter( new GLatLng(34.340424,134.01166), 15 );

//小さいコントロ?ルを表示
ctrlObj = new GSmallMapControl();
map1.addControl(ctrlObj);

addMarker(map1); //マーカーをマッピング
}

//ページがロードされたら、load 関数を実行して、地図を表示する
window.onload = load;

//ページを抜けるとき、メモリ開放
window.onunload = GUnload;
//]]>
//]]>
</script>

<div>
<div id="google_map" class="txaL" style="width:870px; height:350px;"></div>
------------------------------------------------------------------------------------------------------------------------------------------------------
読み込んでいるmap.xmlのソース
<?xml version="1.0" encoding="utf-8"?>
<markers>
<marker lat="34.339843" lng="134.012506" html="<a href='http://?'>店舗名店</a><br>高松市鶴市町などの住所" />
<marker lat="36.339843" lng="137.012506" html="<a href='http://?'>店舗名店</a><br>高松市鶴市町などの住所" />
・
・
・
</markers>
------------------------------------------------------------------------------------------------------------------------------------------------------

そこで、今回は読み込むmap.xmlをmap.phpにして
中身を
<?php require_once( "cmsdesigner/include/view.php.inc" ); // encoding="euc-jp" ?>
<cmsd:entrylist name="diary" design="idokeido" output="xml" />
<?php cmsd_end_template(); ?>

デザインの方を

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html" encoding="EUC-JP" omit-xml-declaration="yes" />

<markers>
<xsl:template match="/entrylist">
<xsl:for-each select="entry">
<marker lat="<xsl:value-of select="ido" disable-output-escaping="yes" />" lng="<xsl:value-of select="keido" disable-output-escaping="yes" />" html="<a href='nikki.php?eid={@id}' target='_blank'>店舗名</a><br>住所をここにいれる" />
</xsl:for-each>
</markers>
</xsl:template>
</xsl:stylesheet>

のような感じに書いてみたのですが、
うまくいきませんでした。

そもそもこのような感じでのxmlの出力はできないのでしょうか？
お手数をおかけいたしますがお返事おまちしております。

[webmaster]

a_yaさん、CMS Designerのご利用、ありがとうございます。

ご要望どおりのことが実現できるかと思います。この機会に、CMS Designerで入力した位置情報をGoogleMapsを使って表示する方法について少しまとめたいと思いますので、少しお時間を頂けますでしょうか。なるべく簡単に扱えるようにしたいと思います。

明日、時間が取れ次第、回答させて頂く予定です。m(__)m

[a_ya]

本当ですか！
ありがとうございます、とっても助かります！

楽しみにご回答お待ちしております。

[webmaster]

webmasterです。a_yaさん、ごめんなさい、今日は時間をとることができませんでした…。期待させておいて申し訳ありません。m(__;)m

先ほど、a_yaさんのご質問内容を再度よく拝見させて頂いたのですが、考え方としては非常に合理的で、問題ないかと思います。
特に、map.xml を map.php に置き換える、という発想が素晴らしいと思います。デザイン定義の構成にも問題ありませんでした。

デザイン定義の記述方法に一部間違いがあり、そこで引っかかっているようです。CMS Designerで用いている技術「XSLT」では、属性値の中にデータを入れる場合には、<xsl:value-of>ではなく、直接項目名を {項目名} の形で記載します。具体的には次のようにしてみてください。

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html" encoding="EUC-JP" omit-xml-declaration="yes" />

<markers>
<xsl:template match="/entrylist">
<xsl:for-each select="entry">
<marker lat="{ido} lng="{keido}" html="<a href='nikki.php?eid={@id}' target='_blank'>店舗名</a><br>住所をここにいれる" />
</xsl:for-each>
</markers>
</xsl:template>
</xsl:stylesheet>

ちょっと、market要素の中のhtml属性の中身が複雑で、どういう状態なのかよくわからなかったのですが、恐らくこれでうまくいくかと思います。一度、お試しください。

今回は時間が無かったのでご紹介することができなかったのですが、CMS Designerには「geolocation項目」というのがあり、CMS Designerの管理画面の中で直接地図を開いて位置情報を入力することが可能です。

そうすると、今回のように「ido」「keido」といった項目を自分で作って「数値」として管理せずとも、クリックすると地図が開く項目を作ることができ、デザイン定義側からも「項目名/@lat」や「項目名/@lng」のような形でデータを取得できるようになります。

詳しくは、公式サイトのダウンロードページからダウンロードできる「Google Maps APIを使った地図表示サンプル（Maps API v3対応版）」をご覧ください。（※a_yaさんが今回提示してくださったJavaScriptのサンプルは、Maps API v2のものです。このv2は、将来サポートされなくなることが決定しておりますので、この機会にv3へ切り替えてみてください）

ご不明な点、うまくいかない点などありましたら、なんなりとご質問頂ければ幸いです。m(__)m

[a_ya]

お忙しいところ、丁寧なお返事
ありがとうございました。

教えて頂いた内容で作成してみたのですが、
地図は表示されるのですが、中にマーカーが表示されませんでした。

何がだめなのか…map.phpがうまくよみこまれていないのでしょうか？

<marker>タグの中は緯度経度の位置情報とマップアイコンをクリックすると店舗の店名と住所が表示されて
そこをクリックすると店舗のURLへとぶような感じにしたいと記載しています。
<marker lat="34.339843" lng="134.012506" html="<a href='/005780001/shop.aspx'>Dコンビニ鶴市店</a></br>高松市鶴市町994-1" />
↓　xml内だと　<　や　> がうまくよまれないので、下のようにしています
<marker lat="34.339843" lng="134.012506" html="<a href='/005780001/shop.aspx'>Dコンビニ鶴市店</a><br>高松市鶴市町994-1" />

いつもはこれでできているのですが…

ちなみにgoogleマップの新しいバージョンを使いたいのですが、
IE6未対応という点と、いろいろ調べてはみたのですが、
私の力不足でソースの書き方がよくわからず(xmlファイルを読み込ませる書き方)、
対応できていない状態です。
いつになるか分かりませんが、なるべく早く変更したいなと思っております。

[webmaster]

a_yaさん、お返事ありがとうございます。うまくいかず申し訳ありません…。

状況をシンプルにする為、一度、html属性の中身を空っぽにして試して頂いてもよろしいでしょうか？ また、2行目の「xml:output method="html"」の部分を「xml」に変えてみてください。

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="xml" encoding="EUC-JP" omit-xml-declaration="yes" />
<markers>
<xsl:template match="/entrylist">
<xsl:for-each select="entry">
<marker lat="{ido} lng="{keido}" html="" />
</xsl:for-each>
</markers>
</xsl:template>
</xsl:stylesheet>

これでうまくいかない場合、一度ブラウザからxml.phpへアクセスしてどのような出力になっているのかを確認してみると、何か原因究明の手がかりが得られるかもしれません。
（差し支えなければ、その出力結果を教えて頂けると参考なりそうです）

[a_ya]

お返事ありがとうございます。

教えて頂いた方法で書きなおしたのですが、
やはり地図だけが表示されるのみでうまくいかなかったので
map.php（xmlデータ出力用ファイル）だけ表示してみたのですが、
真っ白な画面しかでてきませんでした。

そもそもxml表示ができていないということですよね。
こちらで何か書き方がいけないのだとは思いますが、
見直してみてもよくわからず…すみません。

[webmaster]

a_yaさん、お返事ありがとうございます。webmasterです。

xml.phpの出力結果ですが、ブラウザ自体には何も表示されないという点をお伝えするのを失念しておりました。出力はHTMLではないので、ブラウザは何も表示しないかと思います。
xml.phpを表示した真っ白い画面上で、「ソースを表示」させることはできるでしょうか？ この結果も真っ白…というかソースが無い状態でしたら、実際に何も出力されていないことになります。

もしその場合、大変お手数ですが、

xml.php
スキーマ
デザイン定義

を、cms(atmark)al-design.jp までお送り頂くことは可能でしょうか…？
原因を探ってみたいと思います。

[a_ya]

WEB MASTER様

本当にいろいろとありがとうございます。
お手数をおかけして申し訳ありません。

ためしたのですが、ソースも真っ白でした。

内容をそちらへお送りしたいのですが、
どのようにお送りすればよいのでしょうか？

どこかに書いてあるとしたら見落としていて申し訳ないのですが、
この掲示板からデータ添付等できるのでしょうか？

先ほど教えて頂いたものはメールアドレスでは
ないですものね…。

[webmaster]

webmasterです。

ごめんなさい、cms(atmark)al-design.jp が、メールアドレスのつもりでした。(atmark)の部分を、@に置き換えてお読みください…。
メールアドレス収集のbotなどにアドレスを検知されるのを防ぐ目的でした。m(__)m

[a_ya]

あ！冷静に考えると＠に置き換えればいいですよね、
気付かなくてすみません。
さっそくメールを送らせて頂きますm(_ _)m

ありがとうございます。

[a_ya]

WEB MASTER様

メールにてありがとうございました。
ご指摘頂いた修正できちんと表示できるようになりましたので、
他の方も情報を共有できるようにあげておきますね。

html=""内はシンプルに解析するためブランクにしてありますが、
中に何かをいれてもきちんと表示されます。


修正後：marker要素の位置は、xsl:templateの中になります。
----------------------------------------------------------
<xsl:template match="/entrylist">
<markers>
<xsl:for-each select="entry">
<marker lat="{ido}" lng="{keido}" html="" />
</xsl:for-each>
</markers>
</xsl:template>
----------------------------------------------------------

[a_ya]

WEB MASTER様

すいません、追加で質問させて頂いてもよろしいでしょうか？

先日お答え頂いた形でmapを読み込むことはできたのですが、
吹き出しの中に自動で各店舗の店舗名、住所を表示させ
店舗詳細はこちらというリンクを貼りたいのですが、うまくいきません。
（このURLのページのような感じで　http://www.careco.jp/stationsearch/area/）

以下のように記載したのですが、何がおかしいかわかりますでしょうか？
もしくはxmlで呼び出す際にhtml=""の中に店舗などを読みだすタグは
入れられないのでしょうか？
----------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="xml" encoding="EUC-JP" omit-xml-declaration="yes" />
<xsl:template match="/entrylist">

<markers>
<xsl:for-each select="entry">
<marker lat="{ido}" lng="{keido}" html="<xsl:value-of select="title" disable-output-escaping="yes" /><br>
<xsl:value-of select="address" disable-output-escaping="yes" /><br>
<xsl:value-of select="access" disable-output-escaping="yes" /><br>
<a href="miyosi.php?eid={@id}" target="_blank">ステーション詳細ページへ</a>" />
</xsl:for-each>
</markers>

</xsl:template>
</xsl:stylesheet>
----------------------------------------------------------------------------------------------

html=""の中で < と > はいれられないので(かっこが2重になってしまうため)
< <
> >
に変換しています。↓
----------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="xml" encoding="EUC-JP" omit-xml-declaration="yes" />
<xsl:template match="/entrylist">

<markers>
<xsl:for-each select="entry">
<marker lat="{ido}" lng="{keido}" html="<xsl:value-of select="title" disable-output-escaping="yes" /><br>
<xsl:value-of select="address" disable-output-escaping="yes" /><br>
<xsl:value-of select="access" disable-output-escaping="yes" /><br>
<a href="miyosi.php?eid={@id}" target="_blank">ステーション詳細ページへ</a>" />
</xsl:for-each>
</markers>

</xsl:template>
</xsl:stylesheet>
----------------------------------------------------------------------------------------------

参考まで今作成中のページURLをお送りします
http://lotas-rs.com/puchi/store/area-miyosi.php

何度もお手数をおかけいたしますが
ご確認よろしくお願いいたします。

[webmaster]

a_yaさん、お返事が遅れまして申し訳ありません。webmasterです。

CMS Designerで用いている技術「XSLT」では、属性値の中にタグ（xsl:value-ofなど）を入れることができなくなっております。
属性値の中にデータを入れる場合には、<xsl:value-of>ではなく、直接項目名を {項目名} の形で記載します。例えば、lat="<xsl:value-of select="ido" />" ではなく、lat="{ido}"とします。

今回のhtml属性ですと、html="{title}" としてみてください。

もしうまくいかない場合、何度も申し訳ありませんが、再度ソース付でご連絡頂ければ幸いです。m(__)m

[a_ya]

WEB MASTER様

お世話になっております。
何度もすみません、ありがとうございます。
ご指摘頂いたようになおしてみました。

すごくおしい感じにはなったのですが、
文字コードがおかしいのか文字化けして表示されてしまいます。

文字コードが合うようにいろいろな箇所のエンコーディングを
変えてみたのですがうまく表示されません。

ものすごく初歩的なミスかもしれず申し訳ないのですが、
見て頂いてもよろしいでしょうか？
http://lotas-rs.com/puchi/store/area-miyosi.php
↑
URL内のマップのアイコンをクリックして頂くと吹き出し内に
おかしな文字列が表示されてしまいます。

記載したxslソースは以下になります。
-------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="xml" encoding="EUC-JP" omit-xml-declaration="yes" />
<xsl:template match="/entrylist">

<markers>
<xsl:for-each select="entry">
<marker lat="{ido}" lng="{keido}" html="{title}<br>{address}<br>{access}<br>
<a href='miyosi.php?eid={@id}' target='_blank' >ステーション詳細ページへ</a >" />
</xsl:for-each>
</markers>

</xsl:template>
</xsl:stylesheet>
-------------------------------------------------------------------------------

xmlとしてよみだすphpのソースは以下になります。
-------------------------------------------------------------------------------
<?php require_once( "cms/include/view.php.inc" ); // encoding="euc-jp" ?>
<cmsd:entrylist name="miyosi" design="idokeido" output="xml" />
<?php cmsd_end_template(); ?>
-------------------------------------------------------------------------------

お忙しいところ申し訳ないですが、
アドバイス頂けると幸いです。

よろしくお願いいたします。