事前入力されたルート (一連の PHP フォーム送信から取得) を自動的にロードしたい Google マップがあります。
現在、PHP フォームは、Google マップを含むページで最高潮に達し、(以前の PHP フォーム送信から) 開始点と終了点が事前に入力されたいくつかのドロップダウン ボックスと、ドロップダウン メニューの onChange 関数を使用しています。ルートを計算します (onChange="calcRoute();"
以下の例では )。これは問題なく機能しますが、実際には、すべての最終的なフォームは、ルートのオプションが 1 つだけになります。したがって、ルートの始点と終点をユーザーに「選択」させることは無意味です。各ドロップダウン メニューにはオプションが 1 つしかないため、ページが表示されたときにそれらのオプションとそれらの間の計算されたルートを自動的にロードすることもできます。ロードします。
これを行う方法はありますか?
私のルート機能は次のようになります。
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<?PHP
$Start_latLng = $_POST["start-latitude"] . ", " . $_POST["start-longitude"];
$End_latLng = $_POST["end-latitude"] . ", " . $_POST["end-longitude"];
?>
<script>
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var mapOptions = {
zoom:7,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: new google.maps.LatLng(54.219218, -2.905669)
}
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
directionsDisplay.setMap(map);
}
function calcRoute() {
var start = document.getElementById('start').value;
var end = document.getElementById('end').value;
var request = {
origin:start,
destination:end,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
});
}
</script>
...そして私のドロップダウン メニューは、PHP の $_POST 関数の結果によって生成されます。
明らかに、ルートを計算する前にマップが読み込まれるのを待つ必要があるため、一時停止を挿入する必要があるかもしれません - 何かアイデアはありますか?