📜  如何将半径添加到 iframe (1)

📅  最后修改于: 2023-12-03 15:24:44.486000             🧑  作者: Mango

将半径添加到 iframe 中

为了将半径添加到 iframe 中,我们需要在 HTML 中嵌入一个带有半径参数的 iframe 标签。在下面的例子中,我们将半径设置为 500 米:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3337.558121640762!2d-117.92036354823053!3d33.85074408063157!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80dcdd291d96e073%3A0x4d170bffb65f8a7a!2sDisneyland!5e0!3m2!1sen!2sus!4v1474247007083&amp;radius=500" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

如上所示,我们在 URL 的末尾添加了 &radius=500,这样就能够在 iframe 的嵌入式 Google 地图中添加半径。

此外,您还可以将 iframe 的 src 属性设置为 JavaScript 函数,以便在运行时动态设置半径。例如:

<iframe id="mapFrame" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

<script>
  var radius = 500;
  var frame = document.getElementById("mapFrame");
  var url = "https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3337.558121640762!2d-117.92036354823053!3d33.85074408063157!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80dcdd291d96e073%3A0x4d170bffb65f8a7a!2sDisneyland!5e0!3m2!1sen!2sus!4v1474247007083&amp;radius=" + radius;
  frame.src = url;
</script>

如上所示,我们通过 JavaScript 动态设置了 iframe 的 src 属性,将半径设置为 500 米。这样,我们就可以根据需要在运行时更改半径值。

以上就是如何将半径添加到 iframe 中的介绍,希望对你有所帮助。