반응형
텍스트 주소를 사용한 Google 지도와 스트리트 뷰 지도
워드프레스 단일 포스트 페이지에 2개의 커스텀 필드에서 주소를 가져오는 구글 지도가 있습니다.정상적으로 동작하고 있습니다만, 스트리트 뷰 링크/옵션을 추가하려고 합니다.
내 페이지에는--
<iframe width="100%" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.google.com/maps/embed/v1/place?q=<?php echo $add; ?>,%20<?php $terms = wp_get_post_terms(get_the_ID(), 'city-type');
if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
foreach ( $terms as $term ) {
if ($term->parent == 0) //check for parent terms only
echo '' . $term->name . '';
}
} ?>&zoom=17&key=mytoken"></iframe>
그러면 다음과 같은 결과가 나옵니다.
<iframe width="100%" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.google.com/maps/embed/v1/place?q=100 las vegas ave,%20Las Vegas, NV&zoom=17&key=mytoken"></iframe>
좌표를 사용하지 않고 스트리트 뷰를 추가할 수 있는 방법이 있나요?
좌표를 얻으려고 했는데 약간 어긋나 있더군요
<?php
function getCoordinates($address){
$address = str_replace(" ", "+", $address); // replace all the white space with "+" sign to match with google search pattern
$url = "https://maps.google.com/maps/api/geocode/json?sensor=false&address=$address";
$response = file_get_contents($url);
$json = json_decode($response,TRUE); //generate array object from the response from the web
return ($json['results'][0]['geometry']['location']['lat'].",".$json['results'][0]['geometry']['location']['lng']);
}
$terms = wp_get_post_terms(get_the_ID(), 'city-type');
if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
foreach ( $terms as $term ) {
if ($term->parent == 0) //check for parent terms only
echo getCoordinates($add, $term->name, $property_pin);
}
} else {
echo getCoordinates($add, $term->name, $property_pin);
}
?>
이미 지리 코드를 이용해서 좌표를 미리 알아내고 있어요예를 들어 지오코드는 이러한 좌표를 제공합니다. 34.0229995,-118.4931421. 그러나 제가 찾고 있는 좌표는 34.050217,-118.259491입니다.
알았어, 내가 알아냈어.
질문의 코드를 이용해서 주소의 좌표를 알아냈어요
<?php
// FUNCTION TO CONVERT ADDRESSES INTO COORDINATES
function getCoordinates($address){
$address = str_replace(" ", "+", $address); // replace all the white space with "+" sign to match with google search pattern
$url = "https://maps.googleapis.com/maps/api/geocode/json?address=$address&key=YOUR_TOKEN_KEY";
$response = file_get_contents($url);
$json = json_decode($response,TRUE); //generate array object from the response from the web
return ($json['results'][0]['geometry']['location']['lat'].",".$json['results'][0]['geometry']['location']['lng']);
}
// THIS GETS MY TOP TERM FROM MY CUSTOM TAXONOMY I.E. NEW YORK, NY
$terms = wp_get_post_terms(get_the_ID(), 'city-type');
if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
foreach ( $terms as $term ) {
if ($term->parent == 0) //check for parent terms only
// $ADD IS FROM MY CUSTOM FIELD FOR THE ADDRESS I.E. 1460 BROADWAY
$the_address = getCoordinates($add, $term->name);
}
}; ?>
그리고 아래 구글 임베드 코드(토큰 키와 교환)를 사용했을 뿐입니다.---
<iframe width="100%" height="350" frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/streetview?location=<?php echo $the_address; ?>&heading=165&pitch=0&key=YOUR-TOKEN-KEY" allowfullscreen></iframe>
스트리트 뷰 맵을 추가하기 위해서입니다.그래서 지도마다 하나씩 두 개의 디바이를 만들고 클릭 기능을 사용하여 표시하거나 숨깁니다.
jQuery(document).ready(function(){
$("#sv-link").click(function(){
$("#rv-box").slideToggle("fast");
$("#sv-box").slideToggle();
});
$("#rv-link").click(function(){
$("#sv-box").slideToggle("fast");
$("#rv-box").slideToggle();
});
});
그것이 최선의 해결책은 아니라는 것을 알고 더 깊이 파고들 수 있다는 것을 알지만 내가 필요한 것은 이것뿐입니다.한 장소에 여러 이미지/전망이 있는 몇 개의 주소에 문제가 있었습니다.1460 브로드웨이 주소를 사용하는 타임스퀘어 풋 로커가 완벽한 예라고 생각하고 있습니다.
그것 말고도 잘 되는 것 같아요.
언급URL : https://stackoverflow.com/questions/47187171/street-view-map-with-google-maps-using-text-address
반응형
'programing' 카테고리의 다른 글
작은 따옴표를 큰 따옴표로 구분하는 방법 (0) | 2023.04.03 |
---|---|
리액트의 cdn/script 태그에서 javascript 패키지를 Import하려면 어떻게 해야 하나요? (0) | 2023.04.03 |
'관찰 가능' 유형에 'catch' 속성이 없습니다. (0) | 2023.04.03 |
검색되지 않은 유형 오류: 'in' 연산자를 사용하여 다음 위치에서 'length'를 검색할 수 없습니다. (0) | 2023.04.03 |
Respect.js: 기본값을 프로펠러로 설정 (0) | 2023.04.03 |