reactjs - React Deck.gl IconLayer 右键单击
问题描述
我一直在试图弄清楚如何右键单击以在 IconLayer 地图标记上工作。我已经尝试过建议的方式
例如。
onClick: (info, event) => console.log(event.rightcllick)
但这似乎对我不起作用。每当我右键单击时,都不会触发任何事件或从地图画布触发我的动作侦听器(我已经测试过删除地图侦听器,我得到相同的结果,没有事件)
请问有人有什么建议吗?
快速更新这个...
经过进一步搜索,我在文档中找到了这个。
https://deck.gl/docs/developer-guide/interactivity#calling-the-picking-engine-directly
但是,当我触发 onclick 时,我无法在地图上找到任何标记,并且pickInfo
返回为空。
我不得不稍微调整它的完成方式,因为这是一个基于类的组件,所以我无法使用钩子
...
deckRef = React.createRef()
deckClick = e => {
const pickInfo = this.deckRef.current.pickObject({
x: e.clientX,
y: e.clientY,
radius: 1,
layerIds: ['icon-layer-TEST'],
})
console.log(pickInfo)
console.log(e, e.clientX, e.clientY)
console.log(this.deckRef.current)
}
render() {
const { center, google, initialMapCenter, language, zoom } = this.props
return (
<Container
className={MAP_CONTAINER_CLASS_NAME}
id="map"
onContextMenu={this.deckClick}
>
<DeckGL ref={this.deckRef}>
<GoogleMap
...
解决方案
推荐阅读
- python - Python Tabulate 将字符格式化为单独的列
- exception - 没有缓存值时如何抛出 CacheException
- json - 删除反斜杠但在 json 字符串中保留 unicode
- microsoft-teams - Microsoft Teams:如何禁止用户删除 Planner 中的任务?
- oop - 枚举 switch-case 样式 dynamic_cast
- android - Apk 大小:Firebase MLKit 包含大型本机库,即使未使用也是如此
- javascript - 如何在 Django 中上传 AJAX 视频
- javascript - 删除对象数组 javascript/react-native 中的两个重复字段之一
- docker - 如何在 docker run 命令上将本地 GOOGLE_APPLICATION_CREDENTIALS 添加到 docker?
- powershell - Powershell 类中 try/catch 的输出