地図のD3 ---どの段階でデータをジオに取り込むか?


12

世界のコロプレスをD3で表示するためにマップしたいです。

ISO-alpha-3キーにキー設定された表示したいデータセットがあります。そう...

danger.csv
iso,level
AFG,100
ALB,0
DZA,12

topojsonの指示に従って、私ができることを知っています...

wget "http://www.naturalearthdata.com/http//www.naturalearthdata.com/download/50m/cultural/ne_50m_admin_0_countries.zip"
unzip ne_50m_admin_0_countries.zip
ogr2ogr -f "GeoJSON" output_features.json ne_50m_admin_0_countries.shp -select iso_a3
topojson -o topo.json output_features.json --id-property iso_a3

ISO3によってIDが指定されたワールドマップJSONを作成します。

私の質問は、ワークフローのどの時点で、danger.csvのデータを地理データにマージする必要があるかということです。以前はGUIとしてqGISを使用していましたが、どこで/ should /をマージする必要がありますか?.shpで?ogr2ogrの後?topojsonが縮小した後、ブラウザーで動的に(ここhttp://bl.ocks.org/mbostock/4060606 http://bl.ocks.org/mbostock/3306362のように)?

私はpythonにはかなり長けていますが、javascriptにはかなり慣れていないので、実際に生成コーダーである以上にBostockの例をコピーして貼り付けています。

(関連がありますが、Stackoverflowのより詳細なフォローアップもありますので、ここで移行する必要があります:https : //stackoverflow.com/questions/18604877/how-to-do-time-data-in-d3-maps


私はちょうど1特にアドレスがあることを@ mbostockの例を見て、のこぎりたGeoJoins、または「; TopoJSONから抽出されたCSVやTSVファイルで、外部のプロパティを持つにGeoJSONファイルを結合するための簡単なスクリプト」
RyanKDalton

回答:


11

2つの質問を自問してください。

  1. 複数のデータセットで地理を再利用しますか?

    同じ地理を複数のデータセットで使用する場合は、地理とデータを分離してクライアントで結合するのが理にかなっています。私の例の多くには、この理由で個別のCSV(またはTSV)ファイルがあります。このように、すべての例で個別のTopoJSONを作成する代わりに、米国の州および郡、または同様に世界の国々の TopoJSONを再利用できます。

    一方、この地理を一度だけ使用する場合は、コードを単純化するためだけに、データをプロパティとして地理に「焼き付ける」必要があります。単一のファイルをロードするだけで(したがってqueue.jsは不要)、データは各機能のプロパティとして格納されるため、このアプローチはより簡単ですクライアントでデータを結合する必要はありません(d3は不要です)。マップ)。

    サイドノート:TSVとCSVは、多くの場合、GeoJSONとTopoJSONよりもプロパティを格納するのにはるかに効率的です。なぜなら、後者はすべてのオブジェクトでプロパティ名を繰り返す必要があるからです。ファイルサイズは、データを別のファイルに保存してクライアントで結合するもう1つの理由です。

  2. データはすでに地理にバインドされていますか(シェープファイルのプロパティなど)。

    最初の質問に「いいえ」と答え、データを(クライアントで行うのではなく)地理に焼き付けたいと仮定した場合、これを行う方法はデータの形式によって異なります。

    データが既にシェープファイルのプロパティである場合topojson -p、生成されたTopoJSONファイルに保存するプロパティを制御するために使用します。また、これを使用してプロパティの名前を変更し、プロパティを数値に強制することもできます。参照レッツ・メイク地図の例のために。

    データが別のCSVファイルまたはTSVファイルにある場合は、topojson -e(に加えて-p)を使用して、地理的特徴に結合できる外部プロパティファイルを指定します。次のようなTSVファイルがある場合は、Wikiから例を引用します。

    FIPS    rate
    1001    .097
    1003    .091
    1005    .134
    1007    .121
    1009    .099
    1011    .164
    1013    .167
    1015    .108
    1017    .186
    1019    .118
    1021    .099

    を使用して-e、これらを「失業」という名前の数値出力プロパティにマッピングできます。

    topojson \
      -o output.json \
      -e unemployment.tsv \
      --id-property=+FIPS \
      -p unemployment=+rate \
      -- input.shp

    このアプローチの例は、ケンタッキー州の人口コロプレスbl.ocks.org/5144735です。


2
そして、ここで私はgis.stackexchangeの代わりにstackoverflowでハードD3マッピングの質問をしていました。なぜなら、そこにもっと専門知識があると思ったからです-そして、マスター自身がここで私の質問に答えます。=)それで、今日学んだことは2つあります。ありがとう!
ミトンチョップ

3

良い質問。あなたが提供した例の1つは、このトリックを行うように見えますが、従うのは困難です。

この例には、2つの外部データファイル、us.jsonunemployement.tsvがあることに注意しください。un雇用.tsvは、danger.csvのように考えることができます。us.jsonは、danger.csvのパラメーターを関連付ける地理的特徴です。後者のunempstation.tsvには、us.json と同じフィールドがidありrateます。idid

少なくともこの例でデータと機能をマージする必要があるのはD3のクライアントです。それはクライアントに失業率は、この例では、使用して、郡の特徴に接合されd3.map()関数。これは初期化される場所です。

var rateById = d3.map();

そして、これはにrateマッピングされる場所idです:

queue()
    .defer(d3.json, "/mbostock/raw/4090846/us.json")
    .defer(d3.tsv, "unemployment.tsv", function(d) { rateById.set(d.id, +d.rate); })
    .await(ready);

queue()が目的なのかわからないが、この議論にとって重要ではないことを認めなければならない。何に注意することが重要であることはということである各郡の機能のフィールドは、失業によって置き換えられますこれは共有識別子によってアクセス可能になりました(編集:@ blord-castilloが指摘するように、これは実際ににマッピングされる新しい連想配列、またはキーハッシュの生成です)。これは、シンボルの目的でが呼び出される場所です(ここでは、各変位値に対して事前定義されたCSSクラスが利用可能です)。idraterateidrateidrate

...
.enter().append("path")
  .attr("class", function(d) { return quantize(rateById.get(d.id)); })
  .attr("d", path);

どこquantize()機能はスタイルに使用するCSSクラスの名前を返すようになりました機能の中で定義されたその失業率、に基づく特徴(郡)idフィールドが。



キューは、シリアルロードの代わりにデータソースの非同期パラレルロードを許可します。
blord-castillo

1
その例で行われているのは、rateByIdがキーハッシュであることです。国の機能は変更されておらず、us.jsonデータは変更されていません。代わりに、unemployee.tsvは「rateById」と呼ばれるキーハッシュに変換されます。rateById.set()がunempstation.tsvでループされるため、unempstation.tsvの各idにキーが挿入され(us.jsonにはない)、そのキーの値がunempstation.tsvのそのidのrateフィールドに設定されます。 。後で、rateById.get()が呼び出され、ハッシュを使用してidで失業率を検索します。その値はus.json機能のスタイルを設定するために使用され、その後破棄されます。
blord-castillo

他の場所に属性として添付するのではなく、なぜこの/ replace / IDをレートで指定するのですか?これにより、後で選択するのが難しくなります。
ミトンチョップ

1
idをrateに置き換えません。idからrateへのルックアップハッシュを作成します。
blord-castillo

2

まず、csvの最初の行は、このメソッドを使用するための列名のコンマ区切りリストでなければなりません。これが不可能な場合は、これに関するコメントを追加すると、のd3.csv.parseRows代わりに使用方法を見つけることができるかどうかがわかりd3.csv.parseます。d3.csv.parseは、の評価者関数によって呼び出され.defer(function, url, assessor)ます。

私はあなたのファイルが次のようになっていると仮定します。

danger.csv
iso,level
AFG,100
ALB,0
DZA,12
...

これを使用して、ISO3から危険レベルまでのルックアップハッシュを作成できます。

var dangerByISO3 = d3.map();
queue()
    .defer(d3.json, "url to topo.json")
    .defer(d3.csv, "url to danger.csv", function(d) {dangerByISO3.set(d.iso, +d.level);})
    .await(ready);
function ready(error, world) {
    //You now have world as your available topojson
    //And you have dangerByISO3 as your danger level hash
    //You can lookup a danger level by dangerByISO3.get(ISO3 code)
}

コードウォークスルー

var dangerByISO3 = d3.map();

まず、キーハッシュとして機能するd3.map()オブジェクトを作成し、これを変数dangerByISO3に格納します。

queue()

並列ロードにキューを使用します。

.defer(d3.json, "url to topo.json")

(エラーの後)await関数に渡される最初の引数としてtopojsonをロードします。ここで、これが上の連鎖関数でqueue()あるが、別の行にリストされているスタイルに注意してください(終了セミコロンはありませんqueue())。

.defer(d3.csv, "url to danger.csv", function(d) {dangerByISO3.set(d.iso, +d.level);})

ここで2つのことが起こっています。最初に、await関数に渡される2番目の引数としてdanger.csvをロードしています。以下に示すように、この引数は実際には使用されません。代わりに、評価関数の引数が読み込み関数d3.csvに提供されます。この評価者は、csvの各行を処理します。この場合、dangerByISO3でset関数を呼び出して、isoキーの各組み合わせに対して、そのキーに対応levelする値としてを設定します。+d.level表記は単項使用+数にD.LEVELの値を強制します。

.await(ready);

両方のデータソースがロードされると、それらは2つの別個の引数として関数に渡されますready()。コールバックの最初の引数は、常に最初に発生したエラーです。エラーが発生しなかった場合、最初の引数としてnullが渡されます。2番目の引数は最初のデータソース(最初のタスクの結果)で、3番目の引数は2番目のデータソース(2番目のタスクの結果)です。

function ready(error, world) {...}

これはコールバック関数ready()です。最初にerror、2つの読み込みタスクが正常に完了した場合はnullである引数を使用します(エラーをキャッチして処理するために実際に言語を追加する必要があります)。次に、topojsonデータをオブジェクトとして取得しますcountries。このデータは、のような関数を使用して関数の本体で処理する必要があります.data(topojson.feature(world,world.objects.countries).features)。以来ready()三番目の引数を取りません、2番目のタスク、私たちのCSVの結果は、単に破棄されます。キーハッシュの作成にのみ使用し、その後は必要ありませんでした。


ええ、あなたは正しいです、私のcsvは実際に私が投稿した不注意なデモの代わりに整形式のcsvのように見えます。=)申し訳ありませんが、更新します。
ミトンチョップ
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.