IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Initial base for orthographic

Browse Source
This commit is contained in:
Zachary Tong 2013-04-09 15:54:07 -04:00
parent 9edfb210bf
commit 604fc0674c
2 changed files with 64 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
panels/map2/display/bullseye.js
View File

@ -1,12 +1,6 @@
function displayBullseye(scope, projection, path) {
var arc = d3.svg.arc()
.innerRadius(5)
.outerRadius(10)
.startAngle(0) //converting from degs to radians
.endAngle(2*Math.PI) //just radians
var coords = projection([parseFloat(scope.panel.display.bullseye.coord.lon), parseFloat(scope.panel.display.bullseye.coord.lat)]);
var degrees = 180 / Math.PI
var circle = d3.geo.circle();
@ -21,7 +15,7 @@ function displayBullseye(scope, projection, path) {
.datum(function(d) {
console.log(d);
return circle.origin([d.lon, d.lat]).angle(1)();
return circle.origin([d.lon, d.lat]).angle(1000 / 6371 * degrees)();
})
.attr("d", path)
.attr("class", "arc");

75
panels/map2/module.js
View File

@ -40,8 +40,10 @@ angular.module('kibana.map2', [])
coord: {
lat: 0,
lon: 0
},
}
},
map: {
type: "mercator"
}
},
displayTabs: ["Geopoints", "Binning", "Choropleth", "Bullseye", "Data"],
@ -257,9 +259,31 @@ angular.module('kibana.map2', [])
/**
* D3 and general config section
*/
var projection = d3.geo.mercator()
.translate([width/2, height/2])
.scale(scale);
var projection;
if (typeof scope.panel.display.map === 'undefined') {
scope.panel.display.map = {type: 'orthographic'};
}
if (scope.panel.display.map.type === 'mercator') {
projection = d3.geo.mercator()
.translate([width/2, height/2])
.scale(scale);
} else if (scope.panel.display.map.type === 'orthographic') {
projection = d3.geo.orthographic()
.scale(248)
.clipAngle(90);
var λ = d3.scale.linear()
.domain([0, width])
.range([-180, 180]);
var φ = d3.scale.linear()
.domain([0, height])
.range([90, -90]);
}
var zoom = d3.behavior.zoom()
.scaleExtent([1, 8])
@ -301,6 +325,16 @@ angular.module('kibana.map2', [])
* D3 SVG Setup
*/
var ctrlKey = false;
//set up listener for ctrl key
d3.select("body")
.on("keydown", function() {
ctrlKey = d3.event.ctrlKey;
})
.on("keyup", function() {
ctrlKey = d3.event.ctrlKey;
});
//remove our old svg...is there a better way to update than remove/append?
d3.select(elem[0]).select("svg").remove();
@ -342,6 +376,18 @@ angular.module('kibana.map2', [])
if (scope.panel.display.map.type === 'orthographic') {
scope.svg.style("cursor", "move")
.call(d3.behavior.drag()
.origin(function() { var rotate = projection.rotate(); return {x: 2 * rotate[0], y: -2 * rotate[1]}; })
.on("drag", function() {
if (ctrlKey) {
projection.rotate([d3.event.x / 2, -d3.event.y / 2, projection.rotate()[2]]);
scope.svg.selectAll("path").attr("d", path);
}
}));
}
/**
* Display Options
*/
@ -373,15 +419,18 @@ angular.module('kibana.map2', [])
}
function move() {
var t = d3.event.translate,
s = d3.event.scale;
t[0] = Math.min(width / 2 * (s - 1), Math.max(width / 2 * (1 - s), t[0]));
t[1] = Math.min(height / 2 * (s - 1) + 230 * s, Math.max(height / 2 * (1 - s) - 230 * s, t[1]));
zoom.translate(t);
scope.panel.display.translate = t;
scope.panel.display.scale = s;
scope.g.style("stroke-width", 1 / s).attr("transform", "translate(" + t + ")scale(" + s + ")");
if (!ctrlKey) {
var t = d3.event.translate,
s = d3.event.scale;
t[0] = Math.min(width / 2 * (s - 1), Math.max(width / 2 * (1 - s), t[0]));
t[1] = Math.min(height / 2 * (s - 1) + 230 * s, Math.max(height / 2 * (1 - s) - 230 * s, t[1]));
zoom.translate(t);
scope.panel.display.translate = t;
scope.panel.display.scale = s;
scope.g.style("stroke-width", 1 / s).attr("transform", "translate(" + t + ") scale(" + s + ")");
}
}