我的 wordpress 单个帖子页面上有一个谷歌地图,它从 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);
}
}; ?>
然后我简单地使用了下面的谷歌嵌入代码(用你自己的替换 token key )---
<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>
那是为了添加街景 map ,虽然我想要两者,所以我所做的是创建两个 div,每个 map 一个,然后只使用点击功能来显示/隐藏它们 --
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 broadway 的时代广场储物柜就是一个完美的例子。
除此之外,它似乎工作正常。
关于javascript - 使用文本地址的谷歌地图街景 map ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47187171/