playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

move mouse wheel zoom from sample file to c3ext.js code

pull/310/head
danelkhen 11 years ago
parent
57bfb97561
commit
785eb25456
2 changed files with 76 additions and 39 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 61
      c3ext.js
  2. 54
      htdocs/js/samples/zoom2.js

61
c3ext.js
Unescape View File

@ -35,7 +35,7 @@ c3ext.generate = function (options) {
refresh();
}
var zoom2 = ZoomBehavior.create({ changed: onZoomChanged });
var zoom2 = ZoomBehavior.create({ changed: onZoomChanged, bindto:options.bindto });
zoom2.enhance = function () {
_zoom2_maxItems *= 2;
@ -49,7 +49,7 @@ c3ext.generate = function (options) {
refresh();
}
zoom2.maxItems = function(){return _zoom2_maxItems;};
zoom2.maxItems = function () { return _zoom2_maxItems; };
function zoomAndReduceData(list, zoomRange, func, maxItems) {
//var maxItems = 10;//Math.ceil(10 * zoomFactor);
var list2 = list.slice(zoomRange[0], zoomRange[1]);
@ -124,7 +124,13 @@ ZoomBehavior.create = function (options) {
var _left;
var totalItems;
var currentZoom;
var bindto = options.bindto;
var _zoomChanged = options.changed || function () { };
var element;
var mousewheelTimer;
var deltaY = 0;
var leftRatio = 0;
zoom.setOptions = function (options) {
if (options == null)
@ -188,7 +194,7 @@ ZoomBehavior.create = function (options) {
_zoom2_factor = factor;
if (_zoom2_factor < 1)
_zoom2_factor = 1;
if(skipDraw)
if (skipDraw)
return;
applyZoomAndPan();
}
@ -202,8 +208,8 @@ ZoomBehavior.create = function (options) {
//_left += pageSize;
if (_left + pageSize > totalItems)
_left = totalItems - pageSize;
console.log({left:_left, pageSize:pageSize});
if(skipDraw)
console.log({ left: _left, pageSize: pageSize });
if (skipDraw)
return;
applyZoomAndPan();
}
@ -211,22 +217,22 @@ ZoomBehavior.create = function (options) {
zoom.zoomAndPanByRatio = function (zoomRatio, panRatio) {
var pageSize = getItemsToShow();
var leftOffset = Math.round(pageSize*panRatio);
var mouseLeft = _left+leftOffset;
zoom.factor(zoom.factor()*zoomRatio, true);
var leftOffset = Math.round(pageSize * panRatio);
var mouseLeft = _left + leftOffset;
zoom.factor(zoom.factor() * zoomRatio, true);
var finalLeft = mouseLeft;
if(zoomRatio!=1){
if (zoomRatio != 1) {
var pageSize2 = getItemsToShow();
var leftOffset2 = Math.round(pageSize2*panRatio);
var finalLeft = mouseLeft-leftOffset2;
var leftOffset2 = Math.round(pageSize2 * panRatio);
finalLeft = mouseLeft - leftOffset2;
}
zoom.left(finalLeft, true);
applyZoomAndPan();
}
zoom.zoomIn = function () {
zoom.zoomAndPanByRatio(2,0);
zoom.zoomAndPanByRatio(2, 0);
}
zoom.zoomOut = function () {
@ -245,6 +251,37 @@ ZoomBehavior.create = function (options) {
_zoom2_factor = 1;
applyZoomAndPan();
}
function doZoom() {
if (deltaY != 0) {
var maxDelta = 10;
var multiply = (maxDelta + deltaY) / maxDelta;
//var factor = chart.zoom2.factor()*multiply;
//factor= Math.ceil(factor*100) / 100;
console.log({ deltaY: deltaY, multiply: multiply });
zoom.zoomAndPanByRatio(multiply, leftRatio);//0.5);//leftRatio);
deltaY = 0;
}
}
function element_mousewheel(e) {
deltaY += e.deltaY;
leftRatio = (e.offsetX - 70) / (e.currentTarget.offsetWidth - 70);
//console.log({ "e.offsetX": e.offsetX, "e.currentTarget.offsetWidth": e.currentTarget.offsetWidth, leftRatio: leftRatio });
mousewheelTimer.set(150);
e.preventDefault();
}
if (bindto != null) {
element = $(options.bindto);
if (element.mousewheel) {
mousewheelTimer = new Timer(doZoom);
element.mousewheel(element_mousewheel);
}
}
return zoom;
}

54
htdocs/js/samples/zoom2.js
Unescape View File

@ -46,22 +46,22 @@ function main() {
chart = c3ext.generate(options);
var deltaY = 0;
var leftRatio = 0;
var el = $("#divChart");
var timer = new Timer(doZoom);
el.mousewheel(function (e) {
deltaY += e.deltaY;
leftRatio = (e.offsetX - 70) / (e.currentTarget.offsetWidth - 70);
console.log({ "e.offsetX": e.offsetX, "e.currentTarget.offsetWidth": e.currentTarget.offsetWidth, leftRatio: leftRatio });
timer.set(150);
e.preventDefault();
//if(e.deltaY>0)
// chart.zoom2.zoomIn();
//else if(e.deltaY<0)
// chart.zoom2.zoomOut();
//console.log(e.deltaX, e.deltaY, e.deltaFactor);
});
//var deltaY = 0;
//var leftRatio = 0;
//var el = $("#divChart");
//var timer = new Timer(doZoom);
//el.mousewheel(function (e) {
// deltaY += e.deltaY;
// leftRatio = (e.offsetX - 70) / (e.currentTarget.offsetWidth - 70);
// console.log({ "e.offsetX": e.offsetX, "e.currentTarget.offsetWidth": e.currentTarget.offsetWidth, leftRatio: leftRatio });
// timer.set(150);
// e.preventDefault();
// //if(e.deltaY>0)
// // chart.zoom2.zoomIn();
// //else if(e.deltaY<0)
// // chart.zoom2.zoomOut();
// //console.log(e.deltaX, e.deltaY, e.deltaFactor);
//});
window.setInterval(refreshStatus, 1000);
@ -75,17 +75,17 @@ function main() {
};
$("#status").text(JSON.stringify(info, null, " "));
}
function doZoom() {
if (deltaY != 0) {
var maxDelta = 10;
var multiply = (maxDelta + deltaY) / maxDelta;
//var factor = chart.zoom2.factor()*multiply;
//factor= Math.ceil(factor*100) / 100;
console.log({ deltaY: deltaY, multiply: multiply });
chart.zoom2.zoomAndPanByRatio(multiply, leftRatio);//0.5);//leftRatio);
deltaY = 0;
}
}
//function doZoom() {
// if (deltaY != 0) {
// var maxDelta = 10;
// var multiply = (maxDelta + deltaY) / maxDelta;
// //var factor = chart.zoom2.factor()*multiply;
// //factor= Math.ceil(factor*100) / 100;
// console.log({ deltaY: deltaY, multiply: multiply });
// chart.zoom2.zoomAndPanByRatio(multiply, leftRatio);//0.5);//leftRatio);
// deltaY = 0;
// }
//}
};

Write Preview
Loading…
Cancel
Save