Browse Source

Merge pull request #1082 from hansmaulwurf23/zoom_key

Added option zoomKey
flowchartTest
Jos de Jong 9 years ago
parent
commit
afe0305073
5 changed files with 38 additions and 1 deletions
  1. +20
    -0
      docs/graph2d/index.html
  2. +10
    -0
      docs/timeline/index.html
  3. +4
    -1
      lib/timeline/Range.js
  4. +2
    -0
      lib/timeline/optionsGraph2d.js
  5. +2
    -0
      lib/timeline/optionsTimeline.js

+ 20
- 0
docs/graph2d/index.html View File

@ -1040,6 +1040,26 @@ function (option, path) {
<td>The width of the timeline in pixels or as a percentage.</td> <td>The width of the timeline in pixels or as a percentage.</td>
</tr> </tr>
<tr>
<td>zoomable</td>
<td>boolean</td>
<td><code>true</code></td>
<td>
Specifies whether the Timeline can be zoomed by pinching or scrolling in the window.
Only applicable when option <code>moveable</code> is set <code><code>true</code></code>.
</td>
</tr>
<tr>
<td>zoomKey</td>
<td>String</td>
<td><code>''</code></td>
<td>Specifies whether the Timeline is only zoomed when an additional key is down.
Available values are '' (does not apply), 'altKey', 'ctrlKey', or 'metaKey'.
Only applicable when option <code>moveable</code> is set <code><code>true</code></code>.
</td>
</tr>
<tr> <tr>
<td>zoomMax</td> <td>zoomMax</td>
<td>Number</td> <td>Number</td>

+ 10
- 0
docs/timeline/index.html View File

@ -916,6 +916,16 @@ function (option, path) {
</td> </td>
</tr> </tr>
<tr>
<td>zoomKey</td>
<td>String</td>
<td><code>''</code></td>
<td>Specifies whether the Timeline is only zoomed when an additional key is down.
Available values are '' (does not apply), 'altKey', 'ctrlKey', or 'metaKey'.
Only applicable when option <code>moveable</code> is set <code><code>true</code></code>.
</td>
</tr>
<tr> <tr>
<td>zoomMax</td> <td>zoomMax</td>
<td>number</td> <td>number</td>

+ 4
- 1
lib/timeline/Range.js View File

@ -78,7 +78,7 @@ Range.prototype = new Component();
Range.prototype.setOptions = function (options) { Range.prototype.setOptions = function (options) {
if (options) { if (options) {
// copy the options that we know // copy the options that we know
var fields = ['direction', 'min', 'max', 'zoomMin', 'zoomMax', 'moveable', 'zoomable', 'activate', 'hiddenDates'];
var fields = ['direction', 'min', 'max', 'zoomMin', 'zoomMax', 'moveable', 'zoomable', 'activate', 'hiddenDates', 'zoomKey'];
util.selectiveExtend(fields, this.options, options); util.selectiveExtend(fields, this.options, options);
if ('start' in options || 'end' in options) { if ('start' in options || 'end' in options) {
@ -474,6 +474,9 @@ Range.prototype._onMouseWheel = function(event) {
// only zoom when the mouse is inside the current range // only zoom when the mouse is inside the current range
if (!this._isInsideRange(event)) return; if (!this._isInsideRange(event)) return;
// only zoom when the according key is pressed and the zoomKey option is set
if (this.options.zoomKey && !event[this.options.zoomKey]) return;
// retrieve delta // retrieve delta
var delta = 0; var delta = 0;

+ 2
- 0
lib/timeline/optionsGraph2d.js View File

@ -150,6 +150,7 @@ let allOptions = {
}, },
width: {string, number}, width: {string, number},
zoomable: {boolean}, zoomable: {boolean},
zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']},
zoomMax: {number}, zoomMax: {number},
zoomMin: {number}, zoomMin: {number},
__type__: {object} __type__: {object}
@ -251,6 +252,7 @@ let configureOptions = {
start: '', start: '',
width: '100%', width: '100%',
zoomable: true, zoomable: true,
zoomKey: ['ctrlKey', 'altKey', 'metaKey', ''],
zoomMax: [315360000000000, 10, 315360000000000, 1], zoomMax: [315360000000000, 10, 315360000000000, 1],
zoomMin: [10, 10, 315360000000000, 1] zoomMin: [10, 10, 315360000000000, 1]
} }

+ 2
- 0
lib/timeline/optionsTimeline.js View File

@ -113,6 +113,7 @@ let allOptions = {
type: {string}, type: {string},
width: {string, number}, width: {string, number},
zoomable: {boolean}, zoomable: {boolean},
zoomKey: {string: ['ctrlKey', 'altKey', 'metaKey', '']},
zoomMax: {number}, zoomMax: {number},
zoomMin: {number}, zoomMin: {number},
@ -197,6 +198,7 @@ let configureOptions = {
type: ['box', 'point', 'range', 'background'], type: ['box', 'point', 'range', 'background'],
width: '100%', width: '100%',
zoomable: true, zoomable: true,
zoomKey: ['ctrlKey', 'altKey', 'metaKey', ''],
zoomMax: [315360000000000, 10, 315360000000000, 1], zoomMax: [315360000000000, 10, 315360000000000, 1],
zoomMin: [10, 10, 315360000000000, 1] zoomMin: [10, 10, 315360000000000, 1]
} }

Loading…
Cancel
Save