问题描述
我在React中使用mapbox-gl,特别是mapbox-gl-leaflet来创建地图:
import Leaflet from 'leaflet'
import 'mapbox-gl/dist/mapbox-gl.css'
import {} from 'mapbox-gl-leaflet'
import 'leaflet/dist/leaflet.css'
const Map = () => {
const map = useRef(null)
useEffect(() => {
Leaflet.mapboxGL({
accessToken: token,style: 'mapbox://styles/mapbox/outdoors-v11',}).addTo(map.current)
})
}
在测试中,当我尝试安装<Map />
并出现以下错误时,它已经失败了:
无法初始化WebGL。
还有另外两个错误消息:
错误:未实现:HTMLCanvasElement.prototype.getContext(未安装canvas npm包)...
此页面似乎缺少Mapbox GL JS的CSS声明,这可能导致地图显示不正确。请确保您的页面包含mapbox-gl.css,如https://www.mapbox.com/mapbox-gl-js/api/中所述。
但是您可以看到我导入了CSS文件。我认为问题在于Jest中没有可用的WebGL。我还安装了canvas
npm软件包,但似乎没有帮助。
是否可以模拟WebGL?我已经使用jest-canvas-mock进行过尝试。我将其导入测试文件:import {} from 'jest-canvas-mock'
。但是我仍然遇到Error: Not implemented: HTMLCanvasElement.prototype.getContext ...
错误。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)