Commit 1dcf9d65 by Zachary Tong

Cleaning up, commenting

parent 88609fbe
/**
* Hexagonal binning
* Rendered as normally projected svg paths, which mean they *do not*
* clip on spheres appropriately. To fix this, we would need to translate
* the svg path into a geo-path
*/
function displayBinning(scope, dimensions) {
function displayBinning(scope, dimensions, projection, path) {
/**
* Hexbin-specific setup
*/
var hexbin = d3.hexbin() var hexbin = d3.hexbin()
.size(dimensions) .size(dimensions)
.radius(scope.panel.display.binning.hexagonSize); .radius(scope.panel.display.binning.hexagonSize);
...@@ -16,10 +17,13 @@ function displayBinning(scope, dimensions, projection, path) { ...@@ -16,10 +17,13 @@ function displayBinning(scope, dimensions, projection, path) {
if (scope.panel.display.binning.enabled) { if (scope.panel.display.binning.enabled) {
//primary field is just binning raw counts /**
//secondary field is binning some metric like mean/median/total. Hexbins doesn't support that, * primary field is just binning raw counts
//so we cheat a little and just add more points to compensate. *
//However, we don't want to add a million points, so normalize against the largest value * Secondary field is binning some metric like mean/median/total. Hexbins doesn't support that,
* so we cheat a little and just add more points to compensate.
* However, we don't want to add a million points, so normalize against the largest value
*/
if (scope.panel.display.binning.areaEncodingField === 'secondary') { if (scope.panel.display.binning.areaEncodingField === 'secondary') {
var max = Math.max.apply(Math, _.map(scope.data, function(k,v){return k;})), var max = Math.max.apply(Math, _.map(scope.data, function(k,v){return k;})),
scale = 50/max; scale = 50/max;
...@@ -27,12 +31,11 @@ function displayBinning(scope, dimensions, projection, path) { ...@@ -27,12 +31,11 @@ function displayBinning(scope, dimensions, projection, path) {
_.map(scope.data, function (k, v) { _.map(scope.data, function (k, v) {
var decoded = geohash.decode(v); var decoded = geohash.decode(v);
return _.map(_.range(0, k*scale), function(a,b) { return _.map(_.range(0, k*scale), function(a,b) {
binPoints.push(projection([decoded.longitude, decoded.latitude])); binPoints.push(scope.projection([decoded.longitude, decoded.latitude]));
}) })
}); });
} else { } else {
binPoints = scope.projectedPoints; binPoints = scope.projectedPoints;
} }
...@@ -43,6 +46,8 @@ function displayBinning(scope, dimensions, projection, path) { ...@@ -43,6 +46,8 @@ function displayBinning(scope, dimensions, projection, path) {
//clean up some memory //clean up some memory
binPoints = []; binPoints = [];
} else { } else {
//not enabled, so just set an empty array. D3.exit will take care of the rest
binnedPoints = []; binnedPoints = [];
binRange = 0; binRange = 0;
} }
...@@ -59,10 +64,6 @@ function displayBinning(scope, dimensions, projection, path) { ...@@ -59,10 +64,6 @@ function displayBinning(scope, dimensions, projection, path) {
.interpolate(d3.interpolateLab); .interpolate(d3.interpolateLab);
/**
* D3 Drawing
*/
var hex = scope.g.selectAll(".hexagon") var hex = scope.g.selectAll(".hexagon")
.data(binnedPoints); .data(binnedPoints);
......
function displayBullseye(scope, projection, path) { /**
* Renders bullseyes as geo-json poly gon entities
* Allows for them to clip on spheres correctly
*/
function displayBullseye(scope, path) {
var degrees = 180 / Math.PI var degrees = 180 / Math.PI
var circle = d3.geo.circle(); var circle = d3.geo.circle();
var data = []; var data = [];
if (scope.panel.display.bullseye.enabled) { if (scope.panel.display.bullseye.enabled) {
...@@ -13,11 +14,9 @@ function displayBullseye(scope, projection, path) { ...@@ -13,11 +14,9 @@ function displayBullseye(scope, projection, path) {
]; ];
} }
var arcs = scope.g.selectAll(".arc") var arcs = scope.g.selectAll(".arc")
.data(data); .data(data);
arcs.enter().append("path") arcs.enter().append("path")
.datum(function(d) { .datum(function(d) {
return circle.origin([d.lon, d.lat]).angle(1000 / 6371 * degrees)(); return circle.origin([d.lon, d.lat]).angle(1000 / 6371 * degrees)();
......
/**
* Renders geopoints as geo-json poly gon entities
* Allows for them to clip on spheres correctly
*/
function displayGeopoints(scope, path) { function displayGeopoints(scope, path) {
/* var points = [];
var points = {}; var circle = d3.geo.circle();
var circle = d3.geo.circle(); var degrees = 180 / Math.PI
var degrees = 180 / Math.PI;
if (scope.panel.display.geopoints.enabled) {
//points = scope.points;
var features = _.map(scope.points, function(coords) {
return {
feature: circle.origin(scope.projection([coords[0], coords[1]]))
.angle(scope.panel.display.geopoints.pointSize / 6371 * degrees)()
};
});
console.log("features", features);
points = {
type: "FeatureCollection",
features: features
};
console.log("points", points);
}
console.log("points2", points);
scope.svg.append("path")
.datum(points)
.attr("d", d3.geo.path());
*/
var points = []
if (scope.panel.display.geopoints.enabled) { if (scope.panel.display.geopoints.enabled) {
points = scope.points; points = scope.points;
} }
var circle = d3.geo.circle();
var degrees = 180 / Math.PI
var geopoints = scope.g.selectAll(".geopoint") var geopoints = scope.g.selectAll(".geopoint")
.data(points); .data(points);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment