6
私はthis exampleに似た視覚化に取り組んでいます。これは、dc.jsライブラリのサンプルのホームページにリンクされています。このページにはいくつかのサンプルコードがありますが、地図上にバブルチャートを描くことに関しては特に質問があります。マップ上にBubbleChartオーバーレイを使用してDCダッシュボードを構築する - より良い例？
上記の例では、作成者が手動でカナダの州の図形を表示するパスを割り当てているようです。コードは、caChartという変数にbubbleOverlayグラフを割り当てます。この変数には、カナダのマップ上の特定の座標に描画されたバブルが含まれます。しかし、更なるダウンそれはコードのようなコードでは、手動で（コメントを参照）（x、y）は代わりにプログラムによってその位置を割り当てるので描画すべき各バブルのためのウェブページ上の座標割り当て：
caChart.width(600)
.height(450)
.dimension(cities)
.group(totalCrimeRateByCity)
.radiusValueAccessor(function(p) {
return p.value.avgTotalCrimeRate;
})
.r(d3.scale.linear().domain([0, 200000]))
.colors(["#ff7373","#ff4040","#ff0000","#bf3030","#a60000"])
.colorDomain([13, 30])
.colorAccessor(function(p) {
return p.value.violentCrimeRatio;
})
.title(function(d) {
return "City: " + d.key
+ "\nTotal crime per 100k population: " + numberFormat(d.value.avgTotalCrimeRate)
+ "\nViolent crime per 100k population: " + numberFormat(d.value.avgViolentCrimeRate)
+ "\nViolent/Total crime ratio: " + numberFormat(d.value.violentCrimeRatio) + "%";
})
// These points appear to be assigned manually
.point("Toronto", 364, 400)
.point("Ottawa", 395.5, 383)
.point("Vancouver", 40.5, 316)
.point("Montreal", 417, 370)
.point("Edmonton", 120, 299)
.point("Saskatoon", 163, 322)
.point("Winnipeg", 229, 345)
.point("Calgary", 119, 329)
.point("Quebec", 431, 351)
.point("Halifax", 496, 367)
.point("St. John's", 553, 323)
.point("Yukon", 44, 176)
.point("Northwest Territories", 125, 195)
.point("Nunavut", 273, 188);
Iが持っています私が似たような米国の地図上にプロットしたい緯度経度座標のタイムスタンプ付きデータです。データは、おおよそ次のようになり：
device_id, timestamp, lat, lon
1, 2014-7-21, 40.7127837, -74.00594130000002
2, 2014-7-22, 40.8516701, -93.2599318
crossfilter寸法にしてこれらの座標を読み、プログラムによって手動で割り当てなくても同様の基本的な地図画像の上にこれらの座標をプロットする方法はありますか？ここでの援助（実例への指針を含む）は高く評価されます。
はい、バブルオーバーレイチャートは、特に発展途上であります。あなたが使用したい地図イメージを持っていますか？もしそうなら、あなたは投影を把握できますか？もしそうでなければ、リンクされたリーフレット・チャートは機能しますか？ – Gordon
@Gordon：小冊子図が使えるかもしれません。米国の基礎となるイメージは、このD3の例（http://bost.ocks.org/mike/bubble-map/）から借用されています.Albersの米国の予測を使用して予測されています。私が考えていたもう1つの選択肢は、D3を使ってUSチャートを作成し、このチャートにクロスフィルターのディメンションとグループをフィードすることでした。しかし、私はそれについてどうやって行くのかは分かりません。読んでくれてありがとう。 – kylerthecreator
そのマップを直接使用している場合は、投射が 'd3.geo.albersUsa（指定されている）であることを[指定する]（https://gist.github.com/mbostock/9943478#file-makefile-L22-L24） ）.scale（1280）.translate（[幅/ 2、高さ/ 2]） ' - 何かを動作させる最も速い方法は、それをあなたのポイントに適用することです。気泡オーバーレイチャートが投影をサポートしていればいいですが、非マップでも使うことができると思います。 – Gordon