Google地圖嵌入：將iFrame轉變爲iOS/Android中的鏈接

Question

在我的網站上，我有一張嵌入式Google地圖，顯示我的業務位置。當有人瀏覽我的網站上的iOS/Android設備上我希望他們能夠點擊地圖，並在本機谷歌地圖應用，打開使用URL模式

comgooglemaps://

我的計劃是把iFrame到這些設備上的鏈接，但我沒有運氣。

任何人都有任何想法如何做到這一點或有一個更好的想法如何實現這一功能。

Answer 1

我決定試試我的方法，當瀏覽器低於certian大小時，我使用jQuery來隱藏iFrame並將其替換爲靜態圖像。那時我很簡單。

Answer 2

我有JSON

「GoogleMap的」： 「\ u003ciframe SRC = \」 https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d434549.40374533384!2d74.24349628287739!3d31.690830957117996!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sPakistan+Lahore!5e0!3m2!1sen!2s!4v1395138949280 \」寬度= \ 「600 \」 高度= \ 「450 \」 FRAMEBORDER = \ 「0 \」 風格= \ 「邊界：0 \」 \ u003e \ u003c/iframe中\ u003e 「

當解析它來字符串，....結果

字符串IFRAME =」 https://www.google。 COM /地圖/嵌入？PB =！1m16！1m12！1立方米！1d434549.40374533384！2d74.24349628287739！3d31.690830957117996！2立方米！1F0！2f0的！3f0！3平方米！1i1024！2i768！4f13.1！2M1！1sPakistan +拉合爾！ 5e0！3m2！1sen！2s！4v1395138949280 width = 600 height = 450 frameborder = 0 style = border：0「;

佈局：activity_main

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/LinearLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    tools:context=".MainActivity" > 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="40dp" 
     android:background="#00FF00" > 

     <TextView 
      android:id="@+id/header_textView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_centerHorizontal="true" 
      android:layout_centerVertical="true" 
      android:text="Google Map" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:textStyle="bold" /> 
    </RelativeLayout> 

    <WebView 
     android:id="@+id/googlemap_webView" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_margin="10dp" /> 

</LinearLayout> 

的Java類：MainActivity

public class MainActivity extends Activity { 

    private WebView googleMapWebView; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 
     initializeUI(); 
    } 

    /** 
    * This method is used to Initialize UI components 
    */ 
    private void initializeUI() { 

      String iframe = "<iframe src=https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d434549.40374533384!2d74.24349628287739!3d31.690830957117996!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sPakistan+Lahore!5e0!3m2!1sen!2s!4v1395138949280 width=600 height=450 frameborder=0 style=border:0</iframe>"; 
      googleMapWebView = (WebView) findViewById(R.id.googlemap_webView); 
      googleMapWebView.getSettings().setJavaScriptEnabled(true); 
      googleMapWebView.loadData(iframe, "text/html", "utf-8"); 
    } 

} 

AndroidManifest.xml中

1. <uses-permission android:name="android.permission.INTERNET"/>

而且赤WIFI許可等。

Answer 3

WebView webview = (WebView) contact.findViewById(R.id.webView); 
    webview.getSettings().setJavaScriptEnabled(true); 
    webview.loadData("<iframe src=\"https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d59155.3066742403!2d82.165487!3d22.079923!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x41830cd45c4743bd!2sJD+Civil+Services+Academy!5e0!3m2!1sen!2sin!4v1497879962473\" width=\"600\" height=\"450\" frameborder=\"0\" style=\"border:0\" allowfullscreen></iframe>", "text/html", "utf-8"); 
    WebSettings webViewSettings = webview.getSettings(); 
    webViewSettings.setJavaScriptCanOpenWindowsAutomatically(true); 
    webViewSettings.setJavaScriptEnabled(true); 
    webViewSettings.setBuiltInZoomControls(true); 
    webViewSettings.setPluginState(WebSettings.PluginState.ON);