~ubuntu-branches/ubuntu/precise/whoopsie-daisy/precise-proposed

« back to all changes in this revision

Viewing changes to backend/stats/static/js/d3/examples/zoom-pan/zoom-pan.html

  • Committer: Package Import Robot
  • Author(s): Evan Dandrea
  • Date: 2012-04-10 14:28:58 UTC
  • Revision ID: package-import@ubuntu.com-20120410142858-nk453o1z7t7py3bs
Tags: 0.1.26
* Take ownership of the NetworkManager state variant on setup and
  unref it, plugging a memory leak.
* Log the reason the server rejected the submitted crash report.
* Send the Whoopsie version with each crash submission.
* Delete both .upload and .uploaded files after 14 days. Thanks
  Marc Deslauriers (LP: #973687).

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
<!DOCTYPE html>
 
2
<meta charset="utf-8">
 
3
<title>Zoom + Pan</title>
 
4
<script src="../../d3.v2.js"></script>
 
5
<style>
 
6
 
 
7
svg {
 
8
  font: 10px sans-serif;
 
9
  shape-rendering: crispEdges;
 
10
}
 
11
 
 
12
rect {
 
13
  fill: #ddd;
 
14
}
 
15
 
 
16
.axis path, .axis line {
 
17
  fill: none;
 
18
  stroke: #fff;
 
19
}
 
20
 
 
21
</style>
 
22
<body>
 
23
<script>
 
24
 
 
25
var margin = {top: 0, right: 0, bottom: 12, left: 24},
 
26
    width = 960 - margin.left - margin.right,
 
27
    height = 500 - margin.top - margin.bottom;
 
28
 
 
29
var x = d3.scale.linear()
 
30
    .domain([-width / 2, width / 2])
 
31
    .range([0, width]);
 
32
 
 
33
var y = d3.scale.linear()
 
34
    .domain([-height / 2, height / 2])
 
35
    .range([height, 0]);
 
36
 
 
37
var xAxis = d3.svg.axis()
 
38
    .scale(x)
 
39
    .orient("bottom")
 
40
    .tickSize(-height);
 
41
 
 
42
var yAxis = d3.svg.axis()
 
43
    .scale(y)
 
44
    .orient("left")
 
45
    .ticks(5)
 
46
    .tickSize(-width);
 
47
 
 
48
var svg = d3.select("body").append("svg")
 
49
    .attr("width", width + margin.left + margin.right)
 
50
    .attr("height", height + margin.top + margin.bottom)
 
51
  .append("g")
 
52
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")")
 
53
    .call(d3.behavior.zoom().x(x).y(y).scaleExtent([1, 8]).on("zoom", zoom));
 
54
 
 
55
svg.append("rect")
 
56
    .attr("width", width)
 
57
    .attr("height", height);
 
58
 
 
59
svg.append("g")
 
60
    .attr("class", "x axis")
 
61
    .attr("transform", "translate(0," + height + ")")
 
62
    .call(xAxis);
 
63
 
 
64
svg.append("g")
 
65
    .attr("class", "y axis")
 
66
    .call(yAxis);
 
67
 
 
68
function zoom() {
 
69
  svg.select(".x.axis").call(xAxis);
 
70
  svg.select(".y.axis").call(yAxis);
 
71
}
 
72
 
 
73
</script>