Q&A
「マッシュアップについて載ったサイトがない」というのはどうやって探されたのでしょうか。また、PHPはどれくらい勉強されていますか？
最近、googlemapapiを使い始め、応用としてgoogle map apiのマッシュアップを考えています。
※下記のhtmlは初歩的なものです。
例として、hotpepperapiとgooglemapapiのマッシュアップを考えています。その場合のhotpepperapiのlatとlngを使えば、マッシュアップができると思います。しかし、理屈ではわかりますがマッシュアップについて載ったサイトがないのでどうやったらマッシュアップができるか困っています。
わからない点
・phpファイルにjavascriptのコードを使うことは可能ですか？
・また、ホットペーパーapiにgoogle map apiを使用するには何をつけたせば表示されるようになるのですか？
php
1<?php 2$key='私のキー'; 3$count='10'; 4$large_area='〇〇'; 5$start ='1'; 6$lat='35.60472'; 7$lng='140.12333'; 8$format='xml'; 9$url='http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key='.$key.'&count='.$count.'&large_area='.$large_area.'&start='.$start.'&lat='.$lat.'&lng='.$lng.'&format='.$format; 10$xml=simplexml_load_file($url);
html
1<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 2<html> 3<head> 4 <title>Google Maps V3</title> 5 <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 6 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 7 <script type="text/javascript"> 8 google.maps.event.addDomListener(window, 'load', function() 9 { 10 var lng =35.60472; 11 var lat =140.12333; 12 13 var latlng = new google.maps.LatLng(lat, lng); 14 var mapOptions = { 15 zoom: 12, 16 center: latlng, 17 mapTypeId: google.maps.MapTypeId.ROADMAP, 18 scaleControl: true 19 }; 20 var mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions); 21 22 var marker = new google.maps.Marker({ 23 position: latlng, 24 map: mapObj 25 }); 26 }); 27 </script> 28</head> 29<body> 30 <div id="gmap" style="width: 500px; height: 370px; border: 1px solid Gray;"> 31 </div> 32</body> 33</html>
phpは二ヶ月勉強しました。
javascriptの方は全然です笑
サイトがないというのは、データが古いこと、googlemapapiの情報がサイトによって違うという意味です。
Google Maps APIはJavaScriptの知識が無いとマッシュアップ以前の問題なので、まずは勉強されてから、わからない部分について質問されたほうが良いです。PHPでデータを必要な形に整形することと、そのデータを受け取る方法、さらにGoogle Maps APIで表示する方法のそれぞれがある程度の知識と勉強を必要とします。
回答2件
2
ベストアンサー
先月作ったサンプルがあるので、マップの表示部分を書き足してみました。
質問者が作りたいものなのかはっきりしませんが、複数のマーカーをひとつのマップに表示したいのかな？
一つのマーカーを一つのマップに表示するのはいくらでもサンプル見つかるはずなので…
(XML版)ホットペッパーAPIからレストラン検索するサンプル
※コードはご自由に改変していただいて構いませんし、ご利用もご自由にどうぞ。
「情報の追加・修正の依頼をする」に
サイトがないというのは、データが古いこと、googlemapapiの情報がサイトによって違うという意味です。
との記述がありますが、本家のサイトにAPIのリファレンスやサンプルがありますので、ここを見るのが最も確実です。
ホットペッパーAPIが最近の流行りなんですかね…
投稿2016/09/14 20:26
編集2016/09/14 21:14
退会済みユーザー
総合スコア0
ホットペッパーAPIが最近の流行りなんですか笑
私はgooglemapapiに特にマッシュアップに興味があったので、質問したまでですが・・・
私はどちらかというとgooglemapapiが好きです！
どちらというと、一つのマーカーを一つのマップに表示する方法が知りたいです。
それならあなた自身が提示したサンプルソースでできることではありませんか。
ホットペーパーapiでlatなどを取得しなくても地図は表示できるのですか？
kosuke_shibuyaさんのコードを見ると、googlemapapiで緯度 , 経度を取得していますが、ホットペーパーapiでは取得していないみたいで
ホットペッパーAPIから緯度経度を取得し、tr タグ の属性にセットしています。
ああ、ここの部分ですね笑
data-lat="<?= h($rest->lat); ?>" data-lng="<?= h($rest->lng);
わかりました。
echo '<tr data-lat="<?= h($rest->lat); ?>" data-lng="<?= h($rest->lng); ?>">';
にすることはわかりましたが、
lat: parseFloat(shops[i]のshops[i]はなんですか？
なんですかと言われても…
shops は10件あるんがから、配列（正確には HTMLCollection）で、iはイテレータ。
そういう意味ですね。
一旦この質問は閉めさせていただきます。
いろいろ調べてからまた質問します。
本当にありがとうございます。
1
マッシュアップは置いといて
google maps api v3 サンプル
などで検索するとgoogle map apiのサンプルが出てきます。まずはこれを利用してgooglemapを使えるようにしましょう。
まあjavascript初心者だったら
javascript 参考書
などでjavscriptの基礎から学ぶのが先ですが
最近google map api にkeyが必須になったようなので、(既存サイトには今は問題ない)取得しておく
投稿2016/09/15 00:55
総合スコア1820
一つのマーカーを一つのマップに表示する方法が知りたいです。
あと、javascriptのコードをphpで実行する際に、
<?php
echo <<<EOM
<script type="text/javascript">
alert( "TEST" )
</script>
EOM;
?>
みたいに変換しなくてもいいのか？
疑問が多いです。
※他の人のコードを見ると、変換していないのもあるので・・・
あなたの回答
tips
プレビュー
