react-baidu-map icon indicating copy to clipboard operation
react-baidu-map copied to clipboard

【MapTypeControl 地图类型控件】三维地图展示失败。

Open brightzoe opened this issue 4 years ago • 6 comments

我自己的项目三维地图请求失败500, 查看文档,文档中的切换为三维地图也挂了,报错500. 文档链接:link lbs baidumap的三维地图可以正常显示的。link

引用项目的报错: image

brightzoe avatar Feb 24 '21 08:02 brightzoe

@brightzoe 看你报错信息,你应该申请 akey 然后需要什么权限? 我看都是百度资源报错。

jaywcjlove avatar Feb 25 '21 01:02 jaywcjlove

@jaywcjlove

@brightzoe 看你报错信息,你应该申请 akey 然后需要什么权限? 我看都是百度资源报错。

文档中也是报错的。(https://uiwjs.github.io/react-baidu-map/#/map-type-control) image

我的akey地图&&卫星都是正常的,和文档情况一致。未发现需要什么另外的权限。

brightzoe avatar Feb 25 '21 02:02 brightzoe

@brightzoe 看 了一下 3d 是属于老的空间新的不是这样的

image

jaywcjlove avatar Feb 25 '21 03:02 jaywcjlove

@brightzoe

⚠️ 这个类型空间是属于来的地图空间,加载新的 3D地图控件实例,需要设置参数 type=webgl&v=1.0 并且需要自己实现。

// <script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=您的密钥"></script>
// GL版命名空间为BMapGL
// 按住鼠标右键,修改倾斜角和角度
var map = new BMapGL.Map("allmap");    // 创建Map实例
map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 11);  // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
var navi3DCtrl = new BMapGL.NavigationControl3D();  // 添加3D控件
map.addControl(navi3DCtrl);

jaywcjlove avatar Feb 25 '21 03:02 jaywcjlove

在组件上传递参数 type="webgl",此时 window.BMap 对象为 undefined,在组件中做了自动处理 window.BMap = window.BMapGL

<APILoader akay="GTrnXa5hwXGwgQnTBG28SHBubErMKm3f" type="webgl" version="1.0">
  <Example />
</APILoader>

jaywcjlove avatar Feb 25 '21 03:02 jaywcjlove

Upgrade + @uiw/[email protected]

jaywcjlove avatar Feb 25 '21 03:02 jaywcjlove