最近在学习微信小程序，遇到一个问题，就是需求map上需要添加其他布局，但是map是由客户端创建的原生组件，层级是最高的，研究了好久，发现在map中可以使用cover-view组件，然后进行布局，有关cover-view的具体使用，详见https://developers.weixin.qq.com/miniprogram/dev/component/cover-view.html，这里简单说明一下使用
wxml文件
<
map
id
=
"map4select"
longitude
=
"{{longitude}}"
latitude
=
"{{latitude}}"
markers
=
"{{markers}}"
scale
=
'18'
style
=
"width:{{map_width}}px;height:{{map_height}}px"
bindregionchange
=
"regionchange"
controls
=
"{{controls}}"
circles
=
'{{circlesData}}'
>
<
cover-view
class
=
'topinfobg'>
<
cover-view
class
=
'topinfocolumn'>
<
cover-view
class
=
'topinfotext'>
{{markers[0].name}}
</
cover-view
>
<
cover-view
class
=
'topinfotext'>
距离您{{distance}}米
</
cover-view
>
</
cover-view
>
<
cover-view
class
=
'lineone'></
cover-view
>
<
cover-view
class
=
'topinfocolumn'>
<
cover-view
class
=
'topinfotext'>
今日
</
cover-view
>
<
cover-view
class
=
'topinfotext'>
{{timecard}}
</
cover-view
>
</
cover-view
>
</
cover-view
>
</
map
>
具体使用可以在程序中运行一下看看实体效果，
效果图大概如下所示，底部为半透明布局，显示一下信息可以：