X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6746dc89c47ed01b165cc1152533605f97eb8e8d..HEAD:/docs/source/Navigation.html
diff --git a/docs/source/Navigation.html b/docs/source/Navigation.html
index ebb8813b..dcdbd4f9 100644
--- a/docs/source/Navigation.html
+++ b/docs/source/Navigation.html
@@ -3,8 +3,8 @@
The source code
-
-
+
+
@@ -19,7 +19,7 @@
* @class Ext.chart.Navigation
*
* Handles panning and zooming capabilities.
- *
+ *
* Used as mixin by Ext.chart.Chart.
*/
Ext.define('Ext.chart.Navigation', {
@@ -27,48 +27,67 @@ Ext.define('Ext.chart.Navigation', {
constructor: function() {
this.originalStore = this.store;
},
-
- //filters the store to the specified interval(s)
+
+ /**
+ * Zooms the chart to the specified selection range.
+ * Can be used with a selection mask. For example:
+ *
+ * items: {
+ * xtype: 'chart',
+ * animate: true,
+ * store: store1,
+ * mask: 'horizontal',
+ * listeners: {
+ * select: {
+ * fn: function(me, selection) {
+ * me.setZoom(selection);
+ * me.mask.hide();
+ * }
+ * }
+ * }
+ * }
+ */
setZoom: function(zoomConfig) {
var me = this,
- store = me.substore || me.store,
+ axes = me.axes,
bbox = me.chartBBox,
- len = store.getCount(),
- from = (zoomConfig.x / bbox.width * len) >> 0,
- to = Math.ceil(((zoomConfig.x + zoomConfig.width) / bbox.width * len)),
- recFieldsLen, recFields = [], curField, json = [], obj;
-
- store.each(function(rec, i) {
- if (i < from || i > to) {
- return;
- }
- obj = {};
- //get all record field names in a simple array
- if (!recFields.length) {
- rec.fields.each(function(f) {
- recFields.push(f.name);
- });
- recFieldsLen = recFields.length;
+ xScale = 1 / bbox.width,
+ yScale = 1 / bbox.height,
+ zoomer = {
+ x : zoomConfig.x * xScale,
+ y : zoomConfig.y * yScale,
+ width : zoomConfig.width * xScale,
+ height : zoomConfig.height * yScale
+ };
+ axes.each(function(axis) {
+ var ends = axis.calcEnds();
+ if (axis.position == 'bottom' || axis.position == 'top') {
+ var from = (ends.to - ends.from) * zoomer.x + ends.from,
+ to = (ends.to - ends.from) * zoomer.width + from;
+ axis.minimum = from;
+ axis.maximum = to;
+ } else {
+ var to = (ends.to - ends.from) * (1 - zoomer.y) + ends.from,
+ from = to - (ends.to - ends.from) * zoomer.height;
+ axis.minimum = from;
+ axis.maximum = to;
}
- //append record values to an aggregation record
- for (i = 0; i < recFieldsLen; i++) {
- curField = recFields[i];
- obj[curField] = rec.get(curField);
- }
- json.push(obj);
- });
- me.store = me.substore = Ext.create('Ext.data.JsonStore', {
- fields: recFields,
- data: json
});
- me.redraw(true);
+ me.redraw(false);
},
+ /**
+ * Restores the zoom to the original value. This can be used to reset
+ * the previous zoom state set by `setZoom`. For example:
+ *
+ * myChart.restoreZoom();
+ */
restoreZoom: function() {
this.store = this.substore = this.originalStore;
this.redraw(true);
}
-
-});
+
+});
+