Google지도의 지점에 CSV에서 풍력 데이터를 표시합니다.

Question

풍속, 풍속, 방향, 온도와 같은 CSV 형식의 바람 데이터가 있습니다.이 데이터를 Google지도의 뒷 배경에 표시하고 싶습니다. 마치지도의 특정 지점을 클릭하면 바람 속도, 방향 등의 데이터를 팝업해야합니다. 이미지의 예제 링크를 제공 할 수 있습니다. 실제로 어떻게 보이는지, 제발 도와주세요, 나는 모든 바람 데이터를 가지고 있습니다. NASA에서이 데이터를 생성

당신은 JS 객체에 CSV에서 수집 된 데이터를 변환해야합니다

http://wpcore.wpe.s3.amazonaws.com/wp-content/uploads/2012/03/wind-navigator.png

Answer 1

(JSON 정확한 수) ... 그것은 1 년이 걸렸지 만 나는이 작업을 완료 할 수 없습니다입니다. 그렇게하면 코드에서 직접 입력으로 사용할 수 있습니다.

var WindCollection=[ 
    {name: 'Place 1', lat: 37.55, lng:-90 , wind_speed:50, direction:'NW', temperature:'60'}, 
    {name: 'Place 2', lat: 36.15, lng:-94 , wind_speed:45, direction:'N', temperature:'62'}, 
    {name: 'Place 3', lat: 36.12, lng:-89 , wind_speed:55, direction:'SE', temperature:'59'} 
    ]; 

다음, 해당 객체를 반복하고 각 루프

WindCollection.forEach(function(windplace) { 
    var marker=new google.maps.Marker({position:{lat:windplace.lat, lng:windplace.lng}, clickable:true, map:map, animation:google.maps.Animation.DROP }); 
}); 

에 마커를 그릴 수 (드롭 애니메이션 극적인 입학 단지가있다).

이제 각 데이터 포인트 (또는 윈드 포인트)에 하나의 마커가 표시됩니다.

google.maps.event.addListener(marker,'click',function() { 
    var infowindow = new google.maps.InfoWindow(); 
    var infolist=jQuery('<ul></ul>'); 
    for (attribute in windplace) { 
     infolist.append('<li><b>'+attribute+'</b>: '+windplace[attribute]+'</li>'); 
    } 
    infowindow.setContent('<div class="infowindow">'+infolist.html()+'</div>'); 
    infowindow.open(map, marker); 
}); 

이것은 당신이 마커를 그릴 같은 루프에서 수행해야 함을 유의하시기 바랍니다

을 클릭하면

마지막으로, 당신은 정보창을 엽니 다 마커에 수신기를 부착 할 수있는 "windplace"변수 때문에 동일한 반복 안에서만 감각을가집니다. 그 정보를 나중에 사용해야 할 경우, 마커가 윈드 플레이스 콘텐츠를 상속해야 마커가 항상 원래 정보를 전달합니다.

marker.windplace = windplace; 

예를 들어 marker.windplace.wind_speed의 값을 얻을 수 있습니다.

하자 모두 함께

http://bl.ocks.org/amenadiel/a4bd1e692e2db3e1dfe0

를 넣어