在 Google 地图 V3 中使用图标字体作为标记

2024-06-21

我想知道是否可以使用图标字体图标(例如 Font Awesome)作为 Google 地图 V3 中的标记来替换默认标记。要在 HTML 或 PHP 文档中显示/插入它们,标记的代码为:

<i class="icon-map-marker"></i>

我刚刚遇到了同样的问题 - 决定进行快速而肮脏的转换并在 github 上托管。

https://github.com/nathan-muir/fontawesome-markers https://github.com/nathan-muir/fontawesome-markers

您可以手动包含 JS 文件,或使用npm install fontawesome-markers or bower install fontawesome-markers.

只需包含 javascript 文件fontawesome-markers.min.js你可以像这样使用它们:

new google.maps.Marker({
    map: map,
    icon: {
        path: fontawesome.markers.EXCLAMATION,
        scale: 0.5,
        strokeWeight: 0.2,
        strokeColor: 'black',
        strokeOpacity: 1,
        fillColor: '#f8ae5f',
        fillOpacity: 0.7
    },
    clickable: false,
    position: new google.maps.LatLng(lat, lng)
});

编辑(2016 年 4 月):现在有 v4.2 -> v4.6.1 的软件包

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Google 地图 V3 中使用图标字体作为标记 的相关文章

  • 计算多边形的面积

    我需要获取地图中多边形的面积 我找了一个例子new google maps geometry spherical computeArea 但我无法让它发挥作用 我也不知道为什么 function dibuV area var i var a
  • Google 地图 api javascript 标签未验证

    正在寻找当前网站 正在使用 W3C 进行完全 HTML5 验证 这是无法验证的 Google 地图 API Javascript 标记 这是W3C的回应 没有开始字符引用 可能应该被转义为 它不喜欢 定义传感器是真还是假时 我尝试过以下方法
  • 带有方向的谷歌静态地图

    我的项目列表中有带有迷你地图的生成地点 地图上应该有 2 个点以及这两点之间的彩色道路方向 它应该看起来像这样 这应该是静态图片 因为页面上会有很多这样的不同方向的图片 但正如我所见 谷歌静态地图不允许绘制这样的图像 两点之间只能有直线 如
  • 如何更改信息窗口背景颜色

    我面临的问题是 我的谷歌地图 API 显示默认信息窗口 背景颜色为白色 我想将白色更改为黑色 参考代码 google maps event addListener marker mouseover function infoWindow s
  • Google Maps API v3:在 Firefox 中未触发自定义标记的点击事件

    创建了一个地图 我试图使其具有类似于 我的地图 的功能 我的右侧有两个下拉列表 根据这些 ddl 中的选择 您可以添加自定义标记 图标 您选择标记类型 然后单击地图右上角的 按钮 然后单击要添加标记的位置 我的问题是 这在 IE Safar
  • 是否可以使 Font Awesome 图标大于“fa-5x”?

    我正在使用这个 HTML 代码 div class col lg 4 div class panel div class panel heading div class row div class col xs 3 i class fa f
  • 在 GeoJson 数据接收到的 Google 地图多边形上放置标签

    我想将带有信息的标签 或带有标签的 div 放在由下面的代码片段绘制的多边形上 样式属性已成功应用于要素 多边形类型 有谁知道如何向该特征添加文本并将其显示在多边形的中心 function handleGeoJson data map da
  • 如何在 jQuery 中禁用 Font-Awesome 按钮?

    如何禁用 jQuery 中的 font awesome 按钮 a class btn btn primary btn sm href i class fa fa upload i OK a 当我尝试以下操作时 jQuery 并未禁用此按钮
  • Google Maps API V3:捕捉到另一个多边形的节点

    我正在绘制相邻且共享边界的多边形 看下面的示例图片 如果我要为蒙大拿州绘制一个多边形 我希望能够单击爱达荷州多边形的节点以获得相同的边界部分 以确保边界不会重叠或有孔 但是 节点不允许直接单击它们 如果我使节点不可见 那么准确性会恶化 并且
  • 谷歌地图及其标记

    我有一个标记位置的 JSON 数组被拉入 Google 地图 这工作正常 我还将 infoWindows 链接到每个标记 这些也工作得很好 但是 当我单击标记 在任何浏览器中 时 信息窗口仅出现在最后添加的标记上方 这是一个小提琴 http
  • 从 Google 地图导出 geoJSON 数据

    是否有内置支持或任何可导出的库geoJSON数据来自google maps Data层或google maps Data Feature or google maps Data Geometry甚至使用Marker Polyline and
  • Google 地图 api V3 - 从查询结果动态添加多个标记

    我正在尝试在页面上设置一个地图 并在其下方设置几个链接 单击这些链接时 将动态查询我的数据库并在地图上输出结果集 我花了很多时间在谷歌上搜索这个 但找不到我想要的东西 我已经使用 AJAX 返回纬度和经度坐标了 但是当尝试在地图上创建标记时
  • Font Awesome 图标作为 Google Maps API V3 中的标记

    我想使用一个很棒的字体图标作为 Google 地图标记 这是我的代码 function addMarker marker marker1 new google maps Marker position new google maps Lat
  • 谷歌地图返回空指针异常

    当我尝试在片段上显示地图时 它返回空指针异常 我已将所有内容添加到清单中的每个权限中 我正在附加片段文件 XML 文件和日志目录 Chatffragment java public class ChatFragment extends Fr
  • 谷歌地图 API 的替代品 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 Locked 这个问题及其答案是locked help locked posts因为这个问题是题外话 但却具有历史意义 目前不接受新的答案
  • Google 地图自动完成 - 最多 3 个字符类型

    我已经实现了带有搜索框的谷歌地图 它允许用户通过搜索来选择地址 在该搜索框中 即使我输入 1 个字符 它也会进行搜索 我希望用户至少输入 3 个字符 否则它不应该进行搜索 My JS Fiddle is http jsfiddle net
  • 点击加载谷歌地图

    我想在单击链接后显示 Google 地图 我已经尝试过以下方法 当点击链接时 然后 Insert div与 id 链接后map 使用 jQuery 方法 getScript 加载 Google Maps API 添加谷歌地图到div带身份证
  • 如何更改 Google Maps v3 API for Directions 中的开始和结束标记图像

    我使用 DirectionsRender 绘制了一条路线 但我不知道如何用我自己的标记替换通用的 Google 标记 我知道并在正常的谷歌地图情况下使用它 但发现很难用开始和结束的方向标记来做到这一点 如果这是一个愚蠢的问题 感谢您的任何建
  • Google Street View JS 让我看到房子的侧面而不是正面

    使用 Google 示例中的示例和 Stack Overflow 上找到的其他代码 我组合了一些 JS 它获取街道地址并显示俯视图和街景视图 在大多数情况下 这些装置工作得很好 但当房子位于拐角处时 它们就会损坏 当房子位于拐角处时 它有时
  • 从 google 地图 api 隐藏本地列表

    当使用谷歌地图 API 显示某些内容时 谷歌已开始将当地餐馆 酒店添加到地图中 我怎样才能隐藏它们不出现 我在使用地图的网站 例如 yelp 上检查了相同的位置 他们成功地隐藏了当地的酒店 餐厅 我一直在寻找图层 叠加层 但无法弄清楚如何删

随机推荐

  • UIWebView:在 Safari 中打开一些链接,一些在视图中打开

    我的应用程序具有在 UIWebView 中呈现的内容 出于文本格式原因 内容中有一些链接 其中一些链接应在移动 Safari 中打开其目标 而其他链接则应在内容中导航 到目前为止 我已经使用 UIWebView 委托捕获了链接请求 在我的实
  • 更改操作栏标题文本颜色

    我正在尝试更改 ActionBar 中标题文本的颜色 但我似乎无法让它工作 这是我尝试使用的风格 在我的应用程序主题中我使用titleTextStyle
  • 有哪些好方法可以控制 GridBagConstraints?

    我对 Swing 编程有点陌生 我发现尽管我很喜欢 GridBagLayout 的强大功能 但如果您有很多组件 那么就会有很多代码行只是设置布局的约束 除了使用可视化编辑器之外 还有哪些好方法可以控制这种情况 请记住 当您添加GridBag
  • 条件数据注释

    有没有办法使数据注释成为有条件的 我有一张桌子Party我存储组织和个人的地方 如果我要添加一个组织 我不需要该字段surname是必需的 但前提是我要添加一个人 public class Party Required ErrorMessa
  • Android 构建 gradle 在特定设备上失败

    我面临一个奇怪的问题 当我编译我的应用程序以在 Android 7 0 的设备上运行它时 它可以工作 但是当我尝试为 Android 4 2 1 的设备进行编译时 它会失败并出现以下错误 错误 任务 app transformClasses
  • C# 是否包含 IParsable 或 ItryParsable

    显然 为您自己的解决方案实现以下接口将相当简单 public interface IParsable
  • SWT - 灰显并禁用当前 shell

    当我在后台运行一个操作时 我将光标设置为忙碌 直到该过程完成 有没有办法也灰显并禁用当前的显示 对话框 外壳 直到该过程完成 我想以视觉方式让用户知道某些东西正在运行 他们必须等待 EDIT plotButton addListener S
  • BlackBerry - Ant 脚本将 JAR 包含在项目中,无需外部依赖项

    这是以下内容的后续内容 BlackBerry 在自己的项目中使用自己的 JAR 文件 https stackoverflow com questions 9976940 blackberry use own jar file in own
  • scipy distance_transform_edt 函数如何工作?

    https docs scipy org doc scipy 0 14 0 reference generated scipy ndimage morphology distance transform edt html https doc
  • 为什么Python在函数中增加变量时会抱怨赋值前的引用?

    为什么Python会抱怨chrome在分配之前被引用 它不会抱怨字典 如果Python 2 5 有所不同的话 那就是这样 def f google browser chrome chrome 1 google dict chrome 1 f
  • Bootstrap 表单助手未选择完整的国家/地区名称

    我添加了引导表单助手来列出国家及其州 最初 它根本没有选择国家名称 但我设法用 jQuery 检索国家 地区名称 但它没有显示完整名称 这是表单的完整代码 div class signup form div class container
  • .py 文件和 .ipy 文件有什么区别?

    我尝试过以两种方式保存 并运行 脚本 并使用两种方式运行它ipython and python 但我没有看到任何区别 这些文件扩展名是多余的吗 Edit python 和 ipython 之间的区别 https stackoverflow
  • 从数据表中删除列

    我有一个包含 20 列的数据表 但我不需要当前处理的所有列 除了 5 列 所以我执行了以下操作来删除列 List
  • VB 脚本 Documents.Open 抛出 424 错误

    所以我有一个vbs脚本 Function test2open sSourceFile sPDFFile Dim wApp As Word Application Dim wDoc As Word Document logStream wri
  • JQuery:如何仅在完成调整大小后调用 RESIZE 事件?

    浏览器窗口大小调整完毕后 如何调用函数 我正在尝试这样做 但遇到了问题 我正在使用 JQuery Resize 事件函数 window resize function how to call only once the browser ha
  • 在 JS 中动态创建函数

    我正在为 JS 游戏创建 AI 引擎 它是由有限状态机组成的 我正在从 XML 加载状态数及其变量值 我还想加载该行为 并且由于我没有时间创建脚本语言 所以我认为在外部文件 XML 节点内 上 插入 JS 代码并在要求 类似的东西
  • 在 PHP 应用程序中实现插件的设计模式

    对于如何在 PHP 应用程序中实现插件有共识吗 我已经调查过观察者模式 http devzone zend com 1732 implementing the observer pattern with splobserver and sp
  • 滑块下的 jQuery UI 滑块标签

    我仅限于使用 jQuery 1 4 2 和 jQuery ui 1 8 5 这不是我的选择 请不要要求我升级到最新版本 我创建了一个滑块 显示滑动条上方的当前值 但我现在需要的是一种在滑动条下方填充图例的方法 其距离与滑块相同 即 如果滑块
  • 如何使用 tqdm 实现 JSON 文件加载进度条?

    我正在编写一个用于 JSON 文件处理的 Python 脚本 它基本上分为三个过程 加载 编码和打印 虽然我已经使用 tqdm 轻松创建了用于编码和打印的进度条 但我不知道如何进行加载 我已经彻底阅读了 tqdm 文档 甚至在这里进行了搜索
  • 在 Google 地图 V3 中使用图标字体作为标记

    我想知道是否可以使用图标字体图标 例如 Font Awesome 作为 Google 地图 V3 中的标记来替换默认标记 要在 HTML 或 PHP 文档中显示 插入它们 标记的代码为 i class icon map marker i 我