전단지, CartoDB의지도에 대한 3D 관점?


12

Leaflet과 같은 일반적인 평평한 맵을 웹에서 이와 같은 관점 맵으로 렌더링하는 JS 라이브러리가 있습니까?

여기에 이미지 설명을 입력하십시오

또한 CartoDB 데이터를 3D 표현으로 바꿀 수있는 것을 본 사람이 있습니까?


1
cartodb와의 통합에 대해서는 잘 모르겠지만 최근 에 three.js 라이브러리를 사용하여 QGIS에서 3D 맵을 만드는 방법에 대한 이 게시물을 보았습니다 . 당신은 그것을 볼 수 있습니다.
RyanKDalton



1
아마이 시각화가 유용하다는 것을 알 수 있습니다 : pluto.cartodb.com/viz/bf4dacd4-003c-11e3-aaf8-a9294e572fad/…
javisantana

답변:


7

아마도 당신은 Osmbuildings 사용할 수 있습니다 . OpenStreetMaps (또는 사용자 지정 GeoJSON) 건물 형상을 3D 관점으로 시각화하기위한 JavaScript 라이브러리입니다.

OSMbuildingJS

OpenStreetMaps 데이터를 직접 사용합니다. loadData () 메소드를 추가하십시오.

var map = new L.Map('map').setView([52.50440, 13.33522], 17);
var osmb = new OSMBuildings(map).loadData();
L.control.layers({}, { Buildings:osmb }).addTo(map); // add to layer switcher (optional)

또는 자신의 GeoJSON을로드 할 수 있습니다. loadData () 메소드를 setData (geojson)로 변경하십시오.

var osmb = new OSMBuildings(map).setData(geoJSON);

데이터에는 높이 속성이 있어야하며 벽과 지붕 색상을 동적으로 변경할 수 있습니다.

osmb.setStyle({ 
     wallColor:'rgba(100, 100, 250, 0.701961)', 
     roofColor:'rgb(220, 220, 50)', 
     shadows:true 
});

낮을 설정하여 그림자 원근도 변경하십시오.

osmb.setDate(new Date(2014, 3, 24, 13, 0));

현재 버전의 OSM 빌딩 (0.2.2b)은 setData방법을 지원하지 않지만 set작동합니다! tjus는 다음과 같습니다 :var osmb = new OSMBuildings(map).setData(geoJSON);
bradypus

4

데이터 계층이 아직 작동하지 않지만 ViziCities (OpenStreetMap 기반 브라우저의 3D 도시)의 주요 사용 사례 중 하나입니다. 아마도 미래에 고려해야 할 사항 : https://github.com/robhawkes/vizicities

면책 조항 : 저는 ViziCities의 개발자입니다


1
멋진 프로젝트! 또한 이것이 당신이 속한 프로젝트라는 것이 명백하지만, (오픈 소스라도) 좀 더 명확하게 만들고 싶을 것입니다.
blah238

고맙지 만 WebGL 이외의 솔루션을 찾고 있습니다.
knutole

1
걱정할 필요가 없습니다.
Robin Hawkes

이 버전에 도표 또는 개선 된 버전이 있습니까?
joker21

2

OSM2world를 사용하여 OpenStreetMap (map.osm)에서 3D 객체 (map.obj)로 2D 데이터를 전달한 다음 다른 변환기 ( convert_obj_three.py )를 사용 하여 3JS JSON 모델 (map.js)로 변환 한 다음 threejs 장면에서.

방법은 다음과 같습니다.

https://www.youtube.com/watch?v=S6LbKH6NnZU


고마워 그러나 이것은 WebGL이 필요합니다.
knutole

1
Threejs는 WebGL을 이용하는 자바 스크립트 라이브러리 / api입니다. 그러나 코드에는 three.js와 OrbitControls.js라는 두 개의 라이브러리 만 포함하면됩니다 (이것은 카메라 궤도를 관리하는 것입니다).
sigon

1
그렇습니다. threejs는 WebGL이 지원하는 브라우저에서만 작동합니다.
sigon


1

http://osm2world.org/ 는 WebGL없이 작동하지만 js 대신 Java를 사용합니다.

Openstreetmap 건물 데이터의 출력을 위해 설계되었으며 다른 3D 데이터에도 적용 할 수 있어야합니다.

결과는 전단지와 비슷한 미끄러운지도입니다 : http://maps.osm2world.org/


당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.