Smartyを経由しPHP5.2.17で作成した配列をJavaScriptへ渡す質問です。

以下コードstationsの部分を動的に変化させたいのですが、SmartyテンプレートでPHP配列を受け取るにはどのように書けばいいでしょうか?
あと、地図のセンターを決める時複数マーカーの場合平均を取る方法はないのですか?
例では、固定値しか見つけられませんでした。

◆例えばPHP側
$stations(
[0] => ( [station] => 曙橋 [lat] => 35.692415 [lng] => 139.722900)
[1] => ( [station] => 新宿三丁目 [lat] => 35.690637 [lng] => 139.706281)
.....
)
$smarty->assign('stations', $stations);

◆テンプレート側
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{$head_title}&nbsp;-&nbsp;{$sub_title}</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
{literal}
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/googlemap.js"></script>
<script type="text/javascript">
$(function(){
var stations = [
['曙橋', 35.692415, 139.722900]
['新宿三丁目', 35.690637, 139.706281]
];
$('#googleMap').gmap(stations);
</script>
{/literal}
</head>

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2012/03/23 15:23:27
  • 終了:2012/03/26 01:44:11

ベストアンサー

id:rouge_2008 No.1

rouge_2008回答回数593ベストアンサー獲得回数3502012/03/24 12:54:40

ポイント100pt

・PHP側

// javascript内で使用するため、デリミタを変更しています。
$smarty->left_delimiter = '<!--{';
$smarty->right_delimiter = '}-->';

$stations = array(
	0 => array('station' => '曙橋', 'lat' => 35.692415, 'lng' => 139.722900),
	1 => array('station' => '新宿三丁目', 'lat' => 35.690637, 'lng' => 139.706281)
);
$smarty->assign('stations', $stations);


http://www.smarty.net/docsv2/ja/language.escaping.tpl
※デリミタの変更など共通する設定は、すべてのファイルに記述するのは面倒ですから、セットアップファイルに記述すると便利です。
http://www.smarty.net/docsv2/ja/installing.smarty.extended.tpl


・テンプレート側

<script type="text/javascript">
var stations = [];
<!--{foreach from=$stations key=key item=item}-->
stations[<!--{$key}-->] = ['<!--{$item['station']}-->', <!--{$item['lat']}-->, <!--{$item['lng']}-->]
<!--{/foreach}-->
// alert(stations); // 確認
$(function(){
	$('#googleMap').gmap(stations);
});
</script>


http://www.smarty.net/docsv2/ja/language.function.foreach.tpl

{literal}タグが展開されず、そのまま表示されますので使用しません。(代わりにデリミタを変更して対処しています。)
http://www.smarty.net/docsv2/ja/language.function.literal.tpl

{literal} タグに囲まれたデータのブロックは、 リテラルとして認識されます。これは一般的に、Javascript やスタイルシートなどで 中括弧がテンプレートの デリミタ として解釈されるとまずい場合に使用します。 {literal}{/literal} タブの内部は解釈されず、 そのままで表示されます。{literal} ブロック内にテンプレートタグを含める必要がある場合は、代わりに {ldelim}{rdelim} で個々のデリミタをエスケープしてください。



・複数マーカーの場合平均は、javascriptで計算した数値をcenterに渡すようにすれば大丈夫です。

	var num = station.length;
	var lat = 0;
	var lng = 0;
	for (i in station) {
		lat += station[i][1];
		lng += station[i][2];
	}
	lat = lat / num;
	lng = lng / num;


※上記で算出されたlatおよびlngの値を「center: new google.maps.LatLng(lat, lng)」のように、centerに渡します。
※「station」は、「$('#googleMap').gmap(stations);」で実行している関数の引数です。

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません