React中使用高德地图组件React-amap

在项目中有一个需要在地图上显示物体定位以及分布热力图的需求，导师选择使用高德地图进行实现。对应的package为React-amap。
记录一下在项目中遇到的几个问题以及解决方案：

1. 自定义Markers外观，

// 标记杆塔的图片样式
  style = {
    position: 'relative',
    backgroundColor: 'white',
    color: '#fff',
    border: '0px solid #fff',
    background: `url(${circle})`,		// 通过import引入的本地图片
    // background: `url('http://icons.iconarchive.com/icons/paomedia/small-n-flat/1024/map-marker-icon.png')`,
    backgroundSize: 'contain',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'center',
    width: '7px',
    height: '7px',
    top: '28px',
    left: '7.25px',
  };

  renderMarkerLayout = (extData) =>{
    return (
      <div>
        <Tooltip title={extData.parent + extData.index + '号杆塔' }>
          <div style={this.style}> </div>
        </Tooltip>
      </div>
    )
  };

<Markers markers={}  render={ this.renderMarkerLayout } />

2. 地图缩放到一定的比例之后显示细节信息，这个问题现在还没有解决。本来想的是给地图添加events当缩放的时候改变state使组件重新渲染，但是最终发现改变state之后地图并不会刷新，可能是地图的性能优化机制导致的吧？？？