diff --git a/docs/src/OptionsPage.js b/docs/src/OptionsPage.js index 9a1dc43..1018c50 100644 --- a/docs/src/OptionsPage.js +++ b/docs/src/OptionsPage.js @@ -832,6 +832,16 @@ class OptionsPage extends React.Component { + + zoomFriction + number + 5 + + Specifies how strong the zooming is for each scroll tick. Higher zooming friction will slow + zooming speed. + + + zoomKey String diff --git a/examples/basicUsage.html b/examples/basicUsage.html index 62c807d..7957776 100644 --- a/examples/basicUsage.html +++ b/examples/basicUsage.html @@ -9,7 +9,7 @@ } - + diff --git a/lib/timeline/Core.js b/lib/timeline/Core.js index 188550c..c3bf41c 100644 --- a/lib/timeline/Core.js +++ b/lib/timeline/Core.js @@ -387,7 +387,7 @@ class Core { const fields = [ 'width', 'height', 'minHeight', 'maxHeight', 'autoResize', 'start', 'end', 'clickToUse', 'dataAttributes', 'hiddenDates', - 'locale', 'locales', 'moment', 'rtl', 'zoomKey', 'horizontalScroll', 'verticalScroll' + 'locale', 'locales', 'moment', 'rtl', 'zoomKey', 'zoomFriction', 'horizontalScroll', 'verticalScroll' ]; util.selectiveExtend(fields, this.options, options); diff --git a/lib/timeline/Range.js b/lib/timeline/Range.js index be063ed..5a019da 100644 --- a/lib/timeline/Range.js +++ b/lib/timeline/Range.js @@ -101,7 +101,7 @@ export default class Range extends Component { // copy the options that we know const fields = [ 'animation', 'direction', 'min', 'max', 'zoomMin', 'zoomMax', 'moveable', 'zoomable', - 'moment', 'activate', 'hiddenDates', 'zoomKey', 'rtl', 'showCurrentTime', 'rollingMode', 'horizontalScroll' + 'moment', 'activate', 'hiddenDates', 'zoomKey', 'zoomFriction', 'rtl', 'showCurrentTime', 'rollingMode', 'horizontalScroll' ]; util.selectiveExtend(fields, this.options, options); @@ -635,12 +635,14 @@ export default class Range extends Component { // adjust a negative delta such that zooming in with delta 0.1 // equals zooming out with a delta -0.1 + + const zoomFriction = this.options.zoomFriction || 5; let scale; if (delta < 0) { - scale = 1 - (delta / 5); + scale = 1 - (delta / zoomFriction); } else { - scale = 1 / (1 + (delta / 5)) ; + scale = 1 / (1 + (delta / zoomFriction)) ; } // calculate center, the date to zoom around diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js index 3a4e300..c780e6c 100644 --- a/lib/timeline/optionsTimeline.js +++ b/lib/timeline/optionsTimeline.js @@ -178,6 +178,7 @@ let allOptions = { width: {string, number}, zoomable: { 'boolean': bool}, zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']}, + zoomFriction: {number}, zoomMax: {number}, zoomMin: {number},