fetch weather-info-all.json

tattii · tattii · commit c3cc0a52b485 · 2019-01-26T19:26:07.000+09:00
diff --git a/public/index.html b/public/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
-    <title>Relief map</title>
+    <title>Weather info map</title>
 	<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/semantic-ui@2.4.1/dist/semantic.min.css" />
     <style>
         body { margin: 0; padding: 0; }
diff --git a/src/WeatherInfoLayer.js b/src/WeatherInfoLayer.js
@@ -2,6 +2,10 @@ import React, { Component } from 'react';
 import mapboxgl from 'mapbox-gl';
 
 export default class Map extends Component {
+  componentDidMount() {
+    this.loadWeatherInfo();
+  }
+
   onload(map) {
     this.map = map;
 
@@ -21,6 +25,25 @@ export default class Map extends Component {
         "line-color": "rgba(123, 124, 125, 0.7)"
       }
     });
+
+    this.renderWeatherInfo();
+  }
+
+  loadWeatherInfo() {
+    const timestamp = new Date().getTime();
+    fetch('https://storage.googleapis.com/weather-info/weather-info-all.json?' + timestamp, {mode: 'cors'})
+      .then(res => res.json())
+      .then(data => {
+        console.log(data);
+        this.weatherInfo = data;
+        this.renderWeatherInfo();
+      });
+  }
+
+  renderWeatherInfo() {
+    if (!this.map || this.weatherInfo) return;
+
+
   }
 
   render() {
