Flutter iframe，嵌入适用于 Android 和 ios 的谷歌地图

Question

我正在尝试使用谷歌地图中的以下嵌入链接进入我的应用程序屏幕的一部分。虽然使用

FlutterMap

和开放街道地图有效，但我正在尝试使用从共享选项获得的 Google 地图嵌入。

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3754.0582381234562!2d-74.04707532345965!3d40.689253439006976!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25090129c363d%3A0x40c6a5770d25022b!2sStatue%20of%20Liberty!5e1!3m2!1sen!2sbd!4v1731186943145!5m2!1sen!2sbd" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

以下是我通过阅读

flutter_html

包的文档所尝试的。

SizedBox(
   height: 450,
   child: Html(
     data: """
     <iframe
       src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3754.0582381234562!2d-74.04707532345965!3d40.689253439006976!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25090129c363d%3A0x40c6a5770d25022b!2sStatue%20of%20Liberty!5e1!3m2!1sen!2sbd!4v1731186943145!5m2!1sen!2sbd"
       width="100%"
       height="100%"
       style="border:0;"
       allowfullscreen=""
       loading="lazy"
       referrerpolicy="no-referrer-when-downgrade">
     </iframe>
     """
     ],
   ),
 ),

我也尝试过一些简单的事情，比如 HTML 部分中的 H1 标签，但到目前为止什么也没有。

Answer 1

如果你想将谷歌地图直接嵌入到 flutter 中，请使用

webview_flutter

包来嵌入它。

尝试使用替代解决方案

dependencies: webview_flutter: ^4.0.0 

你可以参考这个例子flutter例子