markerwithlabel没有显示在meteorjs的谷歌地图上答案

【问题标题】：markerwithlabel didnt display on google map on meteorjsmarkerwithlabel没有显示在meteorjs的谷歌地图上
【发布时间】：2016-06-27 15:39:21
【问题描述】：

markerwithlabel 没有显示在meteorjs 上的谷歌地图上。我正在使用 dburles:google-maps 和 markerwithlabel v1.1.9。我似乎无法与 dburles:google-maps 集成，我将 markerwithlabel.js 放在公共文件夹中

我有这个错误

未捕获的类型错误：google.maps.MarkerWithLabel 不是函数

GoogleMap.jsx

Map = React.createClass({

  propTypes: {
    name: React.PropTypes.string.isRequired,
    options: React.PropTypes.object.isRequired
  },

  componentDidMount() {

    GoogleMaps.create({
      name: this.props.name,
      element: React.findDOMNode(this),
      options: this.props.options
    })

    GoogleMaps.ready(this.props.name, function(map) {
      var marker = new google.maps.MarkerWithLabel({ <-----------ERROR
        position: map.options.center,
        map: map.instance,
        zoom: 8
      })
    })
  },

  componentWillUnmount() {
    if (GoogleMaps.maps[this.props.name]) {
      google.maps.event.clearInstanceListeners(GoogleMaps.maps[this.props.name].instance);
      delete GoogleMaps.maps[this.props.name];
    } 
  },

  render() {
    return <div className="map-container"></div>;
  }
})

Home.jsx

Home = React.createClass({

  mixins: [ReactMeteorData],

  componentDidMount() {
    GoogleMaps.load({key: "AIzaSyAIoRRWbFOLmP4iLXrRmgDmNw0STlKMXqU"})
  },

  getMeteorData() {
    return {
      loaded: GoogleMaps.loaded(),
      mapOptions: GoogleMaps.loaded() && this._mapOptions()
    }
  },

  _mapOptions() {
    return {
      center: new google.maps.LatLng(1.3, 103.8),
      zoom: 8
    }
  },

  render() {
    if (!this.data.loaded) {
        return <div>Loading map...</div>
    }

    const script = document.createElement('script')
    script.type = 'text/javascript'
    script.src = '/markerwithlabel.js'
    document.body.appendChild(script)

    return <Map name="mymap" options={this.data.mapOptions}/>
  }
})

【问题讨论】：

标签： javascript google-maps meteor google-maps-api-3 reactjs

【解决方案1】：

终于明白了。只是使用 MarkerWithLabel 而不是 google.map.MarkerWithLabel 有点愚蠢，因为 api 不是来自 google maps api

GoogleMaps.ready(this.props.name, function(map) {
      var marker = new MarkerWithLabel({
        position: map.options.center,
        map: map.instance,
        zoom: 8,
        labelContent: "$425K",
      })
    })

【讨论】：