2014-04-27 132 views
1

我想繪製一張d3.js的地圖,其中包含城市地圖偏移量的一部分,並繪製在不同的位置(地圖插圖)。有使用d3.js這個工作的例子嗎?如果沒有,我會只使用一個不同的.json文件,創建一個DOM元素,正常加載主地圖並在加載插入的二級數據之後?d3.js地圖插圖(縮放)

最好是一個工作示例會有幫助,但如果什麼都不存在,我會嘗試編輯我所知道的內容。

回答

0

我在看一個類似的任務,但還沒有完成。我最初的想法是定義一個複合投影,如albersUsa描述here。你可以從implementation看到它是如何工作的 - 它基本上定義了(lon,lat)=>(x,y)的三個不同的投影,然後根據源點的緯度/經度選擇要使用的投影。

但是我不確定這可以用於插頁,因爲不同的投影會重疊 - 例如,從一些遙遠的地方進入您的插圖城市的道路將上升到未放大的城市,然後在放大視圖的邊緣再次重新開始。因此,您需要自定義裁剪,以便基本投影在放大的插圖邊界的邊緣(在屏幕座標系中)而不是在(lon,lat)座標系中的插入邊界的邊緣處裁剪。實際上,地圖的某個區域並未呈現,因爲它被擴展的插圖隱藏。

+0

下面是一個簡單的方法示例,它使用一個新的投影重繪每個插圖的地圖,並將其剪裁成任意大小:http://bl.ocks.org/patricksurry/40e8e58359dfc852ee19 – patricksurry