Рендеринг нескольких элементов на карте google-map-реакции

Question

У меня проблема с рендерингом нескольких элементов с использованием google-map-реаги * .Я делаю все как в примере, с жестко закодированным элементом все в порядке, но с элементами, которые я хочу визуализировать, используя метод map, как я делаю это с обычными компонентами реакции, у меня возникают проблемы.Вот ссылка jsbin , где вы можете проверить это, на карте мы должны увидеть 3 точки, но теперь у нас есть только жестко закодированная.

Answer 1

В вашей функции карты вы должны вернуть свой AnyReactComponent.

, например:

{Scenes.map(scene => {

      let lat=scene.coordinates[0];
      let lng=scene.coordinates[1];
      let sceneName=scene.name;

      console.log(`Latitude - ${lat}\nLongitude - ${lng}\nSceneName - ${sceneName}`);

      return <AnyReactComponent 
          lat={lat} 
          lng={lng} 
          text={sceneName} 
      />
})}