|
17
|
1 <script type="text/ecmascript">
|
|
|
2 <![CDATA[
|
|
|
3 addEventListener('DOMMouseScroll', wheel, false);
|
|
|
4 onmousewheel = wheel;
|
|
|
5 var svgEl = document.getElementById("topsvg");
|
|
|
6 var startx=0;
|
|
|
7 var starty=0;
|
|
|
8 function wheel(evt){
|
|
|
9 evt = evt ? evt : window.event;
|
|
|
10 var normal = evt.detail ? evt.detail * -1 : evt.wheelDelta / 40;
|
|
|
11 var vb = new Array(4);
|
|
|
12 var vbtext = svgEl.getAttributeNS(null,"viewBox");
|
|
|
13 vb = vbtext.split(" ");
|
|
|
14 var zoom = (normal<0)? 1.41 : 0.71;
|
|
|
15 //var dwidth = parseFloat(Math.max(vb[2],vb[3])) * (1-zoom);
|
|
|
16 vb[0] = parseFloat(vb[0]) + parseFloat(vb[2])*(1-zoom) * evt.clientX/innerWidth;
|
|
|
17 vb[1] = parseFloat(vb[1]) + parseFloat(vb[3])*(1-zoom) * evt.clientY/innerHeight;
|
|
|
18 vb[2] = parseFloat(vb[2]) * zoom;
|
|
|
19 vb[3] = parseFloat(vb[3]) * zoom;
|
|
|
20 svgEl.setAttributeNS(null, "viewBox", vb.join(" "));
|
|
|
21 if (evt.preventDefault)
|
|
|
22 evt.preventDefault(); // Don't scroll the page when zooming
|
|
|
23 }
|
|
|
24 onmousedown = function(evt) {
|
|
|
25 startx = evt.clientX;
|
|
|
26 starty = evt.clientY;
|
|
|
27 }
|
|
|
28 onmousemove=function(evt) {
|
|
|
29 if(startx!=0 && starty!=0
|
|
|
30 && ((evt.clientX - startx)*(evt.clientX - startx)+(evt.clientY - starty)*(evt.clientY - starty)>100))
|
|
|
31 {
|
|
|
32 var vbtext = svgEl.getAttributeNS(null,"viewBox");
|
|
|
33 vb = vbtext.split(" ");
|
|
|
34 var maxwh = Math.max(parseFloat(vb[2]),parseFloat(vb[3]));
|
|
|
35 vb[0] = parseFloat(vb[0]) - (evt.clientX - startx)*maxwh/innerWidth;
|
|
|
36 vb[1] = parseFloat(vb[1]) - (evt.clientY - starty)*maxwh/innerHeight;
|
|
|
37 svgEl.setAttributeNS(null, "viewBox", vb.join(" "));
|
|
|
38 startx = evt.clientX;
|
|
|
39 starty = evt.clientY;
|
|
|
40 }
|
|
|
41 }
|
|
|
42 onmouseup=function() {
|
|
|
43 startx=0;
|
|
|
44 starty=0;
|
|
|
45 }
|
|
|
46 ondblclick=function() {
|
|
|
47 location.reload();
|
|
|
48 }
|
|
|
49 ]]>
|
|
|
50 </script>
|
