ReactJS：Google Map（给出无效值错误）

Question

我目前正在my reference (ReactJS Google Map)上工作。我在ReactJS和laravel中创建了这个项目。

我不明白为什么tomchentw API Json Data在我的Google地图上起作用，但是我自己的API Json Data给了我错误

  

Hc {消息：“不是LatLng或LatLngLiteral：不是对象”，名称：“ InvalidValueError”，堆栈：“在新Hc处出现错误↵（https://maps.googleapis.com/m…实在

     

InvalidValueError：setPosition：不是LatLng或LatLngLiteral：在   属性纬度：不是数字

tomchentw：API数据 https://gist.githubusercontent.com/farrrr/dfda7dd7fccfec5474d3/raw/758852bbc1979f6c4522ab4e92d1c92cba8fb0dc/data.json

我自己的：API数据

我的代码：

{props.markers.map(marker => (

    <Marker
      key={marker.id}
      position={{ lat: marker.store_lat, lng: marker.store_long }}
    />
  ))}



 componentDidMount() {

        axios.get('/api/googlemapstore')
        .then(response => {
          this.setState({
              markers: response.data
          })
        })

    }

Tomchentw代码：

{props.markers.map(marker => (

    <Marker
      key={marker.photo_id}
      position={{ lat: marker.latitude, lng: marker.longitude }}
    />
  ))}


 fetch('https://gist.githubusercontent.com/farrrr/dfda7dd7fccfec5474d3/raw/758852bbc1979f6c4522ab4e92d1c92cba8fb0dc/data.json')
      .then(res => res.json())
      .then(data => {
        this.setState({ markers: data.photos });
      });

Answer 1

这是因为数据中的值是字符串，而不是数字。

您有：

'store_lat': '53.628301'

应该是：

'store_lat': 53.628301