dataRange component renamed to visualMap component

src/chart/graph/backwardCompat.js

+define(function (require) {
+
+});
\ No newline at end of file

src/chart/heatmap/HeatmapView.js

@@ -54,17 +54,17 @@ define(function (require) {
         type: 'heatmap',
 
         render: function (seriesModel, ecModel, api) {
-            var dataRangeOfThisSeries;
-            ecModel.eachComponent('dataRange', function (dataRange) {
-                dataRange.eachTargetSeries(function (targetSeries) {
+            var visualMapOfThisSeries;
+            ecModel.eachComponent('visualMap', function (visualMap) {
+                visualMap.eachTargetSeries(function (targetSeries) {
                     if (targetSeries === seriesModel) {
-                        dataRangeOfThisSeries = dataRange;
+                        visualMapOfThisSeries = visualMap;
                     }
                 });
             });
 
-            if (!dataRangeOfThisSeries) {
-                throw new Error('Heatmap must use with dataRange');
+            if (!visualMapOfThisSeries) {
+                throw new Error('Heatmap must use with visualMap');
             }
 
             this.group.removeAll();
@@ -74,7 +74,7 @@ define(function (require) {
             }
             else if (coordSys.type === 'geo') {
                 this._renderOnGeo(
-                    coordSys, seriesModel, dataRangeOfThisSeries, api
+                    coordSys, seriesModel, visualMapOfThisSeries, api
                 );
             }
         },
@@ -140,9 +140,9 @@ define(function (require) {
             });
         },
 
-        _renderOnGeo: function (geo, seriesModel, dataRangeModel, api) {
-            var inRangeVisuals = dataRangeModel.targetVisuals.inRange;
-            var outOfRangeVisuals = dataRangeModel.targetVisuals.outOfRange;
+        _renderOnGeo: function (geo, seriesModel, visualMapModel, api) {
+            var inRangeVisuals = visualMapModel.targetVisuals.inRange;
+            var outOfRangeVisuals = visualMapModel.targetVisuals.outOfRange;
             // if (!visualMapping) {
             //     throw new Error('Data range must have color visuals');
             // }
@@ -171,11 +171,11 @@ define(function (require) {
                 return pt;
             });
 
-            var dataExtent = dataRangeModel.getExtent();
-            var isInRange = dataRangeModel.type === 'dataRange.continuous'
-                ? getIsInContinuousRange(dataExtent, dataRangeModel.option.range)
+            var dataExtent = visualMapModel.getExtent();
+            var isInRange = visualMapModel.type === 'visualMap.continuous'
+                ? getIsInContinuousRange(dataExtent, visualMapModel.option.range)
                 : getIsInPiecewiseRange(
-                    dataExtent, dataRangeModel.getPieceList(), dataRangeModel.option.selected
+                    dataExtent, visualMapModel.getPieceList(), visualMapModel.option.selected
                 );
 
             hmLayer.update(

src/component/dataRange.js

-/**
- * DataZoom component entry
- */
-define(function (require) {
-
-    require('./dataRangeContinuous');
-    require('./dataRangePiecewise');
-
-});
\ No newline at end of file

src/component/dataRangeContinuous.js

-/**
- * DataZoom component entry
- */
-define(function (require) {
-
-    require('./dataRange/typeDefaulter');
-    require('./dataRange/visualCoding');
-    require('./dataRange/ContinuousModel');
-    require('./dataRange/ContinuousView');
-    require('./dataRange/dataRangeAction');
-
-});
\ No newline at end of file

src/component/dataRangePiecewise.js

-/**
- * DataZoom component entry
- */
-define(function (require) {
-
-    require('./dataRange/typeDefaulter');
-    require('./dataRange/visualCoding');
-    require('./dataRange/PiecewiseModel');
-    require('./dataRange/PiecewiseView');
-    require('./dataRange/dataRangeAction');
-
-});
\ No newline at end of file

src/component/visualMap.js

+/**
+ * visualMap component entry
+ */
+define(function (require) {
+
+    require('./visualMapContinuous');
+    require('./visualMapPiecewise');
+
+});
\ No newline at end of file

src/component/dataRange/ContinuousModel.js → src/component/visualMap/ContinuousModel.js

@@ -4,16 +4,16 @@
  */
 define(function(require) {
 
-    var DataRangeModel = require('./DataRangeModel');
+    var VisualMapModel = require('./VisualMapModel');
     var zrUtil = require('zrender/core/util');
     var numberUtil = require('../../util/number');
 
     // Constant
     var DEFAULT_BAR_BOUND = [20, 140];
 
-    return DataRangeModel.extend({
+    return VisualMapModel.extend({
 
-        type: 'dataRange.continuous',
+        type: 'visualMap.continuous',
 
         /**
          * @protected
@@ -49,7 +49,7 @@ define(function(require) {
          * @override
          */
         resetItemSize: function () {
-            DataRangeModel.prototype.resetItemSize.apply(this, arguments);
+            VisualMapModel.prototype.resetItemSize.apply(this, arguments);
 
             var itemSize = this.itemSize;
 
@@ -77,7 +77,7 @@ define(function(require) {
          * @override
          */
         completeVisualOption: function () {
-            DataRangeModel.prototype.completeVisualOption.apply(this, arguments);
+            VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
 
             zrUtil.each(this.stateList, function (state) {
                 var symbolSize = this.option.controller[state].symbolSize;

src/component/dataRange/ContinuousView.js → src/component/visualMap/ContinuousView.js

 define(function(require) {
 
-    var DataRangeView = require('./DataRangeView');
+    var VisualMapView = require('./VisualMapView');
     var graphic = require('../../util/graphic');
     var zrUtil = require('zrender/core/util');
     var numberUtil = require('../../util/number');
@@ -17,16 +17,16 @@ define(function(require) {
     // high data value: this._dataInterval[1] and has high coord.
     // The logic of transform is implemented in this._createBarGroup.
 
-    var PiecewiseDataRangeView = DataRangeView.extend({
+    var PiecewiseVisualMapView = VisualMapView.extend({
 
-        type: 'dataRange.continuous',
+        type: 'visualMap.continuous',
 
         /**
          * @override
          */
         init: function () {
 
-            DataRangeView.prototype.init.apply(this, arguments);
+            VisualMapView.prototype.init.apply(this, arguments);
 
             /**
              * @private
@@ -58,7 +58,7 @@ define(function(require) {
          * @protected
          * @override
          */
-        doRender: function (dataRangeModel, ecModel, api, payload) {
+        doRender: function (visualMapModel, ecModel, api, payload) {
             if (!payload || payload.type !== 'selectDataRange' || payload.from !== this.uid) {
                 this._buildView();
             }
@@ -73,17 +73,17 @@ define(function(require) {
         _buildView: function () {
             this.group.removeAll();
 
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
             var thisGroup = this.group;
 
-            this._orient = dataRangeModel.get('orient');
-            this._useHandle = dataRangeModel.get('calculable');
+            this._orient = visualMapModel.get('orient');
+            this._useHandle = visualMapModel.get('calculable');
 
             this._resetInterval();
 
             this._renderBar(thisGroup);
 
-            var dataRangeText = dataRangeModel.get('text');
+            var dataRangeText = visualMapModel.get('text');
             this._renderEndsText(thisGroup, dataRangeText, 0);
             this._renderEndsText(thisGroup, dataRangeText, 1);
 
@@ -112,9 +112,9 @@ define(function(require) {
             var text = dataRangeText[1 - endsIndex];
             text = text != null ? text + '' : '';
 
-            var dataRangeModel = this.dataRangeModel;
-            var textGap = dataRangeModel.get('textGap');
-            var itemSize = dataRangeModel.itemSize;
+            var visualMapModel = this.visualMapModel;
+            var textGap = visualMapModel.get('textGap');
+            var itemSize = visualMapModel.itemSize;
 
             var barGroup = this._shapes.barGroup;
             var position = this._applyTransform(
@@ -129,7 +129,7 @@ define(function(require) {
                 barGroup
             );
             var orient = this._orient;
-            var textStyleModel = this.dataRangeModel.textStyleModel;
+            var textStyleModel = this.visualMapModel.textStyleModel;
 
             this.group.add(new graphic.Text({
                 style: {
@@ -148,9 +148,9 @@ define(function(require) {
          * @private
          */
         _renderBar: function (targetGroup) {
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
             var shapes = this._shapes;
-            var itemSize = dataRangeModel.itemSize;
+            var itemSize = visualMapModel.itemSize;
             var api = this.api;
             var orient = this._orient;
             var useHandle = this._useHandle;
@@ -170,7 +170,7 @@ define(function(require) {
                 useHandle ? 'move' : null
             ));
 
-            var textRect = dataRangeModel.textStyleModel.getTextRect('国');
+            var textRect = visualMapModel.textStyleModel.getTextRect('国');
             var textSize = Math.max(textRect.width, textRect.height);
 
             // Handle
@@ -213,7 +213,7 @@ define(function(require) {
                     : (handleIndex === 0 ? -textSize / 2 : textSize / 2)
             };
 
-            var textStyleModel = this.dataRangeModel.textStyleModel;
+            var textStyleModel = this.visualMapModel.textStyleModel;
             var handleLabel = new graphic.Text({
                 silent: true,
                 style: {
@@ -250,7 +250,7 @@ define(function(require) {
             this.api.dispatchAction({
                 type: 'selectDataRange',
                 from: this.uid,
-                dataRangeId: this.dataRangeModel.id,
+                visualMapId: this.visualMapModel.id,
                 selected: this._dataInterval.slice()
             });
         },
@@ -259,14 +259,14 @@ define(function(require) {
          * @private
          */
         _resetInterval: function () {
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
 
-            var dataInterval = this._dataInterval = dataRangeModel.getSelected();
+            var dataInterval = this._dataInterval = visualMapModel.getSelected();
 
             this._handleEnds = linearMap(
                 dataInterval,
-                dataRangeModel.getExtent(),
-                [0, dataRangeModel.itemSize[1]],
+                visualMapModel.getExtent(),
+                [0, visualMapModel.itemSize[1]],
                 true
             );
         },
@@ -279,13 +279,13 @@ define(function(require) {
          */
         _updateInterval: function (handleIndex, delta) {
             delta = delta || 0;
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
             var handleEnds = this._handleEnds;
 
             sliderMove(
                 delta,
                 handleEnds,
-                [0, dataRangeModel.itemSize[1]],
+                [0, visualMapModel.itemSize[1]],
                 handleIndex === 'all' ? 'rigid' : 'push',
                 handleIndex
             );
@@ -293,8 +293,8 @@ define(function(require) {
             // Update data interval.
             this._dataInterval = linearMap(
                 handleEnds,
-                [0, dataRangeModel.itemSize[1]],
-                dataRangeModel.getExtent(),
+                [0, visualMapModel.itemSize[1]],
+                visualMapModel.getExtent(),
                 true
             );
         },
@@ -303,12 +303,12 @@ define(function(require) {
          * @private
          */
         _updateView: function (forSketch) {
-            var dataRangeModel = this.dataRangeModel;
-            var dataExtent = dataRangeModel.getExtent();
+            var visualMapModel = this.visualMapModel;
+            var dataExtent = visualMapModel.getExtent();
             var shapes = this._shapes;
             var dataInterval = this._dataInterval;
 
-            var outOfRangeHandleEnds = [0, dataRangeModel.itemSize[1]];
+            var outOfRangeHandleEnds = [0, visualMapModel.itemSize[1]];
             var inRangeHandleEnds = forSketch ? outOfRangeHandleEnds : this._handleEnds;
 
             var visualInRange = this._createBarVisual(
@@ -332,7 +332,7 @@ define(function(require) {
                 );
 
                 shapes.handleLabels[handleIndex].setStyle({
-                    text: dataRangeModel.formatValueText(dataInterval[handleIndex]),
+                    text: visualMapModel.formatValueText(dataInterval[handleIndex]),
                     textAlign: this._applyTransform(
                         this._orient === 'horizontal'
                             ? (handleIndex === 0 ? 'bottom' : 'top')
@@ -372,7 +372,7 @@ define(function(require) {
          * @private
          */
         _createBarPoints: function (handleEnds, symbolSizes) {
-            var itemSize = this.dataRangeModel.itemSize;
+            var itemSize = this.visualMapModel.itemSize;
 
             return [
                 [itemSize[0] - symbolSizes[0], handleEnds[0]],
@@ -387,7 +387,7 @@ define(function(require) {
          */
         _createBarGroup: function (itemAlign) {
             var orient = this._orient;
-            var inverse = this.dataRangeModel.get('inverse');
+            var inverse = this.visualMapModel.get('inverse');
 
             return new graphic.Group(
                 (orient === 'horizontal' && !inverse)
@@ -456,5 +456,5 @@ define(function(require) {
             : [[0, 0], [textSize, 0], [textSize, textSize]];
     }
 
-    return PiecewiseDataRangeView;
+    return PiecewiseVisualMapView;
 });

src/component/dataRange/PiecewiseModel.js → src/component/visualMap/PiecewiseModel.js

-/**
- * @file DataRange model
- */
 define(function(require) {
 
-    var DataRangeModel = require('./DataRangeModel');
+    var VisualMapModel = require('./VisualMapModel');
     var zrUtil = require('zrender/core/util');
     var VisualMapping = require('../../visual/VisualMapping');
 
-    return DataRangeModel.extend({
+    return VisualMapModel.extend({
 
-        type: 'dataRange.piecewise',
+        type: 'visualMap.piecewise',
 
         /**
          * @protected

src/component/dataRange/PiecewiseView.js → src/component/visualMap/PiecewiseView.js

 define(function(require) {
 
-    var DataRangeView = require('./DataRangeView');
+    var VisualMapView = require('./VisualMapView');
     var zrUtil = require('zrender/core/util');
     var graphic = require('../../util/graphic');
     var symbolCreators = require('../../util/symbol');
     var layout = require('../../util/layout');
 
-    var PiecewiseDataRangeView = DataRangeView.extend({
+    var PiecewiseVisualMapView = VisualMapView.extend({
 
-        type: 'dataRange.piecewise',
+        type: 'visualMap.piecewise',
 
         /**
          * @protected
@@ -19,15 +19,15 @@ define(function(require) {
 
             thisGroup.removeAll();
 
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
             var api = this.api;
             var ecWidth = api.getWidth();
-            var textGap = dataRangeModel.get('textGap');
-            var textStyleModel = dataRangeModel.textStyleModel;
+            var textGap = visualMapModel.get('textGap');
+            var textStyleModel = visualMapModel.textStyleModel;
             var textFont = textStyleModel.getFont();
             var textFill = textStyleModel.getTextColor();
             var itemAlign = this.getItemAlignByOrient('horizontal', ecWidth);
-            var itemSize = dataRangeModel.itemSize;
+            var itemSize = visualMapModel.itemSize;
 
             var viewData = this._getViewData();
             var showLabel = !viewData.endsText;
@@ -40,7 +40,7 @@ define(function(require) {
             showEndsText && this._renderEndsText(thisGroup, viewData.endsText[0], itemSize);
 
             layout.box(
-                dataRangeModel.get('orient'), thisGroup, dataRangeModel.get('itemGap')
+                visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap')
             );
 
             this.renderBackground(thisGroup);
@@ -79,7 +79,7 @@ define(function(require) {
                 return;
             }
             var itemGroup = new graphic.Group();
-            var textStyleModel = this.dataRangeModel.textStyleModel;
+            var textStyleModel = this.visualMapModel.textStyleModel;
             itemGroup.add(new graphic.Text({
                 style: {
                     x: itemSize[0] / 2,
@@ -100,16 +100,16 @@ define(function(require) {
          * @return {Object} {peiceList, endsText} value order is [low, ..., high]
          */
         _getViewData: function () {
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
 
-            var pieceList = zrUtil.map(dataRangeModel.getPieceList(), function (piece, index) {
+            var pieceList = zrUtil.map(visualMapModel.getPieceList(), function (piece, index) {
                 return {piece: piece, index: index};
             });
-            var endsText = dataRangeModel.get('text');
+            var endsText = visualMapModel.get('text');
 
             // Consider orient and inverse.
-            var orient = dataRangeModel.get('orient');
-            var inverse = dataRangeModel.get('inverse');
+            var orient = visualMapModel.get('orient');
+            var inverse = visualMapModel.get('inverse');
 
             if (orient === 'horizontal' ? inverse : !inverse) {
                 // Value order of pieceList is [high, ..., low]
@@ -128,7 +128,7 @@ define(function(require) {
          */
         _createItemSymbol: function (group, piece, shapeParam) {
             var representValue;
-            if (this.dataRangeModel.isCategory()) {
+            if (this.visualMapModel.isCategory()) {
                 representValue = piece.value;
             }
             else {
@@ -149,10 +149,10 @@ define(function(require) {
          * @private
          */
         _onItemClick: function (index) {
-            var dataRangeModel = this.dataRangeModel;
-            var selected = zrUtil.clone(dataRangeModel.get('selected'), true);
+            var visualMapModel = this.visualMapModel;
+            var selected = zrUtil.clone(visualMapModel.get('selected'), true);
 
-            if (dataRangeModel.get('selectedMode') === 'single') {
+            if (visualMapModel.get('selectedMode') === 'single') {
                 zrUtil.each(selected, function (item, index) {
                     selected[index] = false;
                 });
@@ -162,11 +162,11 @@ define(function(require) {
             this.api.dispatchAction({
                 type: 'selectDataRange',
                 from: this.uid,
-                dataRangeId: this.dataRangeModel.id,
+                visualMapId: this.visualMapModel.id,
                 selected: selected
             });
         }
     });
 
-    return PiecewiseDataRangeView;
+    return PiecewiseVisualMapView;
 });

src/component/dataRange/DataRangeModel.js → src/component/visualMap/VisualMapModel.js

@@ -19,7 +19,7 @@ define(function(require) {
 
     return echarts.extendComponentModel({
 
-        type: 'dataRange',
+        type: 'visualMap',
 
         dependencies: ['series'],
 

src/component/dataRange/DataRangeView.js → src/component/visualMap/VisualMapView.js

@@ -9,7 +9,7 @@ define(function (require) {
 
     return echarts.extendComponentView({
 
-        type: 'dataRange',
+        type: 'visualMap',
 
         /**
          * @readOnly
@@ -32,9 +32,9 @@ define(function (require) {
 
             /**
              * @readOnly
-             * @type {module:echarts/component/dataRange/DataRangeModel}
+             * @type {module:echarts/component/visualMap/visualMapModel}
              */
-            this.dataRangeModel;
+            this.visualMapModel;
 
             /**
              * @private
@@ -46,10 +46,10 @@ define(function (require) {
         /**
          * @protected
          */
-        render: function (dataRangeModel, ecModel, api, payload) {
-            this.dataRangeModel = dataRangeModel;
+        render: function (visualMapModel, ecModel, api, payload) {
+            this.visualMapModel = visualMapModel;
 
-            if (dataRangeModel.get('show') === false) {
+            if (visualMapModel.get('show') === false) {
                 this.group.removeAll();
                 return;
             }
@@ -61,8 +61,8 @@ define(function (require) {
          * @protected
          */
         renderBackground: function (group) {
-            var dataRangeModel = this.dataRangeModel;
-            var padding = formatUtil.normalizeCssArray(dataRangeModel.get('padding') || 0);
+            var visualMapModel = this.visualMapModel;
+            var padding = formatUtil.normalizeCssArray(visualMapModel.get('padding') || 0);
             var rect = group.getBoundingRect();
 
             group.add(new graphic.Rect({
@@ -75,9 +75,9 @@ define(function (require) {
                     height: rect.height + padding[0] + padding[2]
                 },
                 style: {
-                    fill: dataRangeModel.get('backgroundColor'),
-                    stroke: dataRangeModel.get('borderColor'),
-                    lineWidth: dataRangeModel.get('borderWidth')
+                    fill: visualMapModel.get('backgroundColor'),
+                    stroke: visualMapModel.get('borderColor'),
+                    lineWidth: visualMapModel.get('borderWidth')
                 }
             }));
         },
@@ -89,7 +89,7 @@ define(function (require) {
          * @param {string=} visualCluster Specify visual type, defualt all available visualClusters.
          */
         getControllerVisual: function (targetValue, forceState, visualCluster) {
-            var dataRangeModel = this.dataRangeModel;
+            var visualMapModel = this.visualMapModel;
             var targetIsArray = zrUtil.isArray(targetValue);
 
             // targetValue is array when caculate gradient color,
@@ -98,12 +98,12 @@ define(function (require) {
                 throw new Error(targetValue);
             }
 
-            var mappings = dataRangeModel.controllerVisuals[
-                forceState || dataRangeModel.getValueState(targetValue)
+            var mappings = visualMapModel.controllerVisuals[
+                forceState || visualMapModel.getValueState(targetValue)
             ];
-            var defaultColor = dataRangeModel.get('contentColor');
+            var defaultColor = visualMapModel.get('contentColor');
             var visualObj = {
-                symbol: dataRangeModel.get('itemSymbol'),
+                symbol: visualMapModel.get('itemSymbol'),
                 color: targetIsArray
                     ? [{color: defaultColor, offset: 0}, {color: defaultColor, offset: 1}]
                     : defaultColor
@@ -133,7 +133,7 @@ define(function (require) {
          * @protected
          */
         getItemAlignByOrient: function (itemOrient, ecSize) {
-            var modelOption = this.dataRangeModel.option;
+            var modelOption = this.visualMapModel.option;
             var itemAlign = modelOption.align;
             var orient = modelOption.orient;
 
@@ -166,7 +166,7 @@ define(function (require) {
          * @protected
          */
         positionGroup: function (group) {
-            var model = this.dataRangeModel;
+            var model = this.visualMapModel;
             var x = model.get('x');
             var y = model.get('y');
             var x2 = model.get('x2');

src/component/dataRange/typeDefaulter.js → src/component/visualMap/typeDefaulter.js

 define(function (require) {
 
-    require('../../model/Component').registerSubTypeDefaulter('dataRange', function (option) {
-        // Compatible with ec2, when splitNumber === 0, continuous dataRange will be used.
+    require('../../model/Component').registerSubTypeDefaulter('visualMap', function (option) {
+        // Compatible with ec2, when splitNumber === 0, continuous visualMap will be used.
         return (
                 !option.categories
                 && (

src/component/dataRange/visualCoding.js → src/component/visualMap/visualCoding.js

@@ -8,22 +8,22 @@ define(function (require) {
     var zrUtil = require('zrender/core/util');
 
     echarts.registerVisualCoding('component', function (ecModel) {
-        ecModel.eachComponent('dataRange', function (dataRangeModel) {
-            processSingleDataRange(dataRangeModel, ecModel);
+        ecModel.eachComponent('visualMap', function (visualMapModel) {
+            processSingleVisualMap(visualMapModel, ecModel);
         });
     });
 
-    function processSingleDataRange(dataRangeModel, ecModel) {
-        var visualMappings = dataRangeModel.targetVisuals;
+    function processSingleVisualMap(visualMapModel, ecModel) {
+        var visualMappings = visualMapModel.targetVisuals;
         var visualTypesMap = {};
         zrUtil.each(['inRange', 'outOfRange'], function (state) {
             var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
             visualTypesMap[state] = visualTypes;
         });
 
-        dataRangeModel.eachTargetSeries(function (seriesModel) {
+        visualMapModel.eachTargetSeries(function (seriesModel) {
             var data = seriesModel.getData();
-            var dimension = dataRangeModel.getDataDimension(data);
+            var dimension = visualMapModel.getDataDimension(data);
             var dataIndex;
 
             function getVisual(key) {
@@ -37,7 +37,7 @@ define(function (require) {
             data.each([dimension], function (value, index) {
                 // For performance consideration, do not use curry.
                 dataIndex = index;
-                var valueState = dataRangeModel.getValueState(value);
+                var valueState = visualMapModel.getValueState(value);
                 var mappings = visualMappings[valueState];
                 var visualTypes = visualTypesMap[valueState];
                 for (var i = 0, len = visualTypes.length; i < len; i++) {

src/component/dataRange/dataRangeAction.js → src/component/visualMap/visualMapAction.js

@@ -14,7 +14,7 @@ define(function(require) {
 
     echarts.registerAction(actionInfo, function (payload, ecModel) {
 
-        ecModel.eachComponent({mainType: 'dataRange', query: payload}, function (model) {
+        ecModel.eachComponent({mainType: 'visualMap', query: payload}, function (model) {
             model.setSelected(payload.selected);
         });
 

src/component/visualMapContinuous.js

+/**
+ * DataZoom component entry
+ */
+define(function (require) {
+
+    require('./visualMap/typeDefaulter');
+    require('./visualMap/visualCoding');
+    require('./visualMap/ContinuousModel');
+    require('./visualMap/ContinuousView');
+    require('./visualMap/visualMapAction');
+
+});
\ No newline at end of file

src/component/visualMapPiecewise.js

+/**
+ * DataZoom component entry
+ */
+define(function (require) {
+
+    require('./visualMap/typeDefaulter');
+    require('./visualMap/visualCoding');
+    require('./visualMap/PiecewiseModel');
+    require('./visualMap/PiecewiseView');
+    require('./visualMap/visualMapAction');
+
+});
\ No newline at end of file

src/model/OptionManager.js

@@ -22,7 +22,7 @@ define(function (require) {
      *     var option = {
      *         title: {...},
      *         legend: {...},
-     *         dataRange: {...},
+     *         visualMap: {...},
      *         series: [
      *             {data: [...]},
      *             {data: [...]},
@@ -53,14 +53,14 @@ define(function (require) {
      *         media: [
      *             {
      *                 query: {maxWidth: 320},
-     *                 option: {series: {x: 20}, dataRange: {show: false}}
+     *                 option: {series: {x: 20}, visualMap: {show: false}}
      *             },
      *             {
      *                 query: {minWidth: 320, maxWidth: 720},
-     *                 option: {series: {x: 500}, dataRange: {show: true}}
+     *                 option: {series: {x: 500}, visualMap: {show: true}}
      *             },
      *             {
-     *                 option: {series: {x: 1200}, dataRange: {show: true}}
+     *                 option: {series: {x: 1200}, visualMap: {show: true}}
      *             }
      *         ]
      *     };

test/area.html

@@ -117,6 +117,11 @@
                         symbolSize: 10,
                         data: data3,
                         itemStyle: itemStyle,
+                        label: {
+                            normal: {
+                                show: true
+                            }
+                        },
                         smooth: true
                     }]
                 });

test/bar.html

@@ -69,7 +69,7 @@
                         borderWidth: 1,
                         data: [{
                             name: 'bar'
-                        }, 'bar2', 'bar3', 'bar4'],
+                        }, 'bar2', '\n', 'bar3', 'bar4'],
                         selected: {
                             // 'bar': false
                         },
@@ -85,7 +85,9 @@
                                 type: ['line', 'bar', 'stack', 'tiled']
                             },
                             dataView: {},
-                            saveAsImage: {}
+                            saveAsImage: {
+                                pixelRatio: 2
+                            }
                         }
                     },
                     tooltip: {},

test/color-mix-aqi.html

@@ -36,7 +36,7 @@
                 'echarts/component/legend',
                 'echarts/component/tooltip',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (dataBJ, dataGZ, dataSH, echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -135,7 +135,7 @@
                             }
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             x: 'right',
                             y: 'top',

test/connect.html

@@ -29,7 +29,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRange',
+                'echarts/component/visualMap',
                 'echarts/component/tooltip'
             ], function (echarts) {
 
@@ -73,7 +73,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             realtime: false,
                             x: 'right',
@@ -126,7 +126,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             x: 'right',
                             // selectedMode: 'single',

test/connect2.html

@@ -47,7 +47,7 @@
                 'echarts/component/legend',
                 'echarts/component/tooltip',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (dataBJ, dataGZ, dataSH, echarts) {
 
                 var chart1 = echarts.init(document.getElementById('chart1'));
@@ -55,24 +55,24 @@
 
                 var option1 = makeChartOption();
                 var option2 = makeChartOption();
-                option1.dataRange.inRange = {
+                option1.visualMap.inRange = {
                     symbolSize: [10, 70]
                 };
-                option1.dataRange.outOfRange = {
+                option1.visualMap.outOfRange = {
                     symbolSize: [10, 70],
                     color: ['rgba(255,255,255,.2)']
                 };
-                option1.dataRange.dimension = 'z';
-                option1.dataRange.max = 250;
+                option1.visualMap.dimension = 'z';
+                option1.visualMap.max = 250;
 
-                option2.dataRange.inRange = {
+                option2.visualMap.inRange = {
                     colorLightness: [1, 0.5]
                 };
-                option2.dataRange.outOfRange = {
+                option2.visualMap.outOfRange = {
                     color: ['rgba(255,255,255,.2)']
                 };
-                option2.dataRange.dimension = 'z';
-                option2.dataRange.max = 250;
+                option2.visualMap.dimension = 'z';
+                option2.visualMap.max = 250;
 
                 chart1.setOption(option1);
                 chart2.setOption(option2);
@@ -174,7 +174,7 @@
                                 }
                             }
                         },
-                        dataRange: {
+                        visualMap: {
                             x: 'right',
                             y: 'top',
                             min: 0,

test/dynamicData.html

@@ -37,7 +37,7 @@
                 for (; count < 500; count++) {
                     xAxisData.push('类目' + count);
                     data1.push(randomData());
-                    data2.push(-randomData());
+                    // data2.push(-randomData());
                 }
 
                 var itemStyle = {
@@ -93,21 +93,6 @@
                         symbolSize: 10,
                         data: data1,
                         itemStyle: itemStyle
-                    }, {
-                        name: 'line2',
-                        type: 'line',
-                        stack: 'all',
-                        symbol: 'none',
-                        symbolSize: 10,
-                        data: data2,
-                        // itemStyle: {
-                        //     normal: {
-                        //         areaStyle: {
-                        //             color: 'black'
-                        //         }
-                        //     }
-                        // }
-                        itemStyle: itemStyle
                     }]
                 });
 
@@ -117,10 +102,6 @@
                         xAxisData.push('类目' + count);
                         data1.shift();
                         data1.push(randomData());
-
-                        data2.shift();
-                        data2.push(randomData());
-
                         count++;
                     }
                     chart.setOption({
@@ -130,9 +111,6 @@
                         series: [{
                             name: 'line',
                             data: data1
-                        }, {
-                            name: 'line2',
-                            data: data2
                         }]
                     });
                 }, 500);

test/force.html

@@ -28,7 +28,7 @@
                 'echarts/component/legend',
                 'echarts/component/geo',
                 'echarts/component/tooltip',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {

test/force2.html

@@ -28,7 +28,7 @@
                 'echarts/component/legend',
                 'echarts/component/geo',
                 'echarts/component/tooltip',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts, gexf) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {

test/force3.html

@@ -28,7 +28,7 @@
                 'echarts/component/legend',
                 'echarts/component/geo',
                 'echarts/component/tooltip',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {

test/graph.html

@@ -28,7 +28,7 @@
                 'echarts/component/legend',
                 'echarts/component/geo',
                 'echarts/component/tooltip',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts, gexf) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -57,7 +57,7 @@
                                 return a.name;
                             })
                         }],
-                        dataRange: {
+                        visualMap: {
                             max: 100,
                             inRange: {
                                 colorSaturation: [1, 0.3]

test/heatmap-map.html

@@ -21,7 +21,7 @@
                 'echarts/chart/heatmap',
                 'echarts/component/geo',
                 'echarts/component/legend',
-                'echarts/component/dataRange',
+                'echarts/component/visualMap',
                 'echarts/component/grid',
                 'echarts/component/polar',
                 'echarts/component/tooltip'
@@ -236,7 +236,7 @@
 
                     chart.setOption({
                         backgroundColor: '#404a59',
-                        dataRange: {
+                        visualMap: {
                             min: 0,
                             max: 500,
                             splitNumber: 5,

test/heatmap.html

@@ -20,7 +20,7 @@
                 'echarts',
                 'echarts/chart/heatmap',
                 'echarts/component/legend',
-                'echarts/component/dataRange',
+                'echarts/component/visualMap',
                 'echarts/component/grid',
                 'echarts/component/polar',
                 'echarts/component/tooltip'
@@ -57,7 +57,7 @@
                         type: 'category',
                         data: days
                     },
-                    dataRange: {
+                    visualMap: {
                         min: 1,
                         max: 10,
                         calculable: true

test/line.html

@@ -64,7 +64,7 @@
                     legend: {
                         data: ['line', 'line2', 'line3']
                     },
-                    dataRange: null, // 用于测试 option 中含有null的情况。
+                    visualMap: null, // 用于测试 option 中含有null的情况。
                     tooltip: {
                         trigger: 'axis',
                         axisPointer: {

test/map.html

@@ -23,7 +23,7 @@
                 'echarts/chart/map',
                 'echarts/component/title',
                 'echarts/component/legend',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts) {
 
                 require(['map/js/china'], function () {
@@ -53,7 +53,7 @@
                             x:'left',
                             data:['iphone3','iphone4','iphone5']
                         },
-                        dataRange: {
+                        visualMap: {
                             min: 0,
                             max: 1500,
                             x: 'left',

test/mapWorld.html

@@ -21,7 +21,7 @@
                 'echarts/chart/map',
                 'echarts/component/legend',
                 'echarts/component/geo',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts) {
 
                 $.get('../map/json/world.json', function (worldJson) {
@@ -62,7 +62,7 @@
                                 return params.seriesName + '<br/>' + params.name + ' : ' + value;
                             }
                         },
-                        dataRange: {
+                        visualMap: {
                             min: 0,
                             max: 1000000,
                             text:['High','Low'],

test/media-finance.html

@@ -78,19 +78,18 @@ for (var i = 0; i < categoryData.length; i++) {
 
 
 var categoryAxis = {
-    id: 'categoryAxis',
     type: 'category',
-    axisLabel: {interval: 0},
+    // axisLabel: {interval: 0},
     data: categoryDataWithReturn,
     splitLine: {show: false}
 };
 
 var valueAxis = {
-    id: 'valueAxis',
     type: 'value',
     name: 'GDP（亿元）',
     // max: 53500
-    max: 30000
+    max: 30000,
+    data: null
 }
 
 var option = {
@@ -255,10 +254,8 @@ var option = {
                     x2: 100,
                     y2: 50
                 },
-                xAxis: {
-                    axisLabel: {interval: 'auto'},
-                    data: categoryData
-                },
+                xAxis: valueAxis,
+                yAxis: categoryAxis,
                 timeline: {
                     orient: 'vertical',
                     inverse: true,

test/parallel-aqi.html

@@ -36,7 +36,7 @@
                 'echarts',
                 'echarts/chart/parallel',
                 'echarts/component/legend',
-                // 'echarts/component/dataZoom',
+                'echarts/component/visualMap',
                 'echarts/component/parallel',
             ], function (dataBJ, dataGZ, dataSH, zrUtil, echarts) {
 
@@ -44,6 +44,7 @@
 
                 var lineStyle = {
                     normal: {
+                        width: 1
                         // opacity: 0.5,
                         // shadowBlur: 10,
                         // shadowOffsetX: 0,
@@ -81,6 +82,16 @@
                                 + schema[6].text + '：' + value[6] + '<br>';
                         }
                     },
+                    visualMap: {
+                        show: true,
+                        min: 0,
+                        max: 150,
+                        dimension: 2,
+                        inRange: {
+                            color: ['#d94e5d','#eac736','#50a3ba'].reverse(),
+                            // colorAlpha: [0, 1]
+                        }
+                    },
                     // dataZoom: {
                     //     show: true,
                     //     orient: 'vertical',

test/pie.html

@@ -20,12 +20,11 @@
                 'echarts/chart/pie',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/tooltip'
+                'echarts/component/tooltip',
+                'echarts/component/toolbox'
             ], function (echarts) {
 
-                var chart = echarts.init(document.getElementById('main'), null, {
-                    renderer: 'canvas'
-                });
+                var chart = echarts.init(document.getElementById('main'));
 
                 var itemStyle = {
                     normal: {
@@ -40,9 +39,14 @@
                     legend: {
                         data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
                     },
-                    tooltip: {
-
+                    toolbox: {
+                        x: 'left',
+                        feature: {
+                            dataView: {},
+                            saveAsImage: {}
+                        }
                     },
+                    tooltip: {},
                     series: [{
                         name: 'pie',
                         type: 'pie',

test/radar.html

+<html>
+    <head>
+        <meta charset="utf-8">
+        <script src="esl.js"></script>
+        <script src="config.js"></script>
+    </head>
+    <body>
+        <style>
+            html, body, #main {
+                width: 100%;
+                height: 100%;
+            }
+        </style>
+        <div id="main"></div>
+        <script>
+
+            require([
+                'echarts',
+                'echarts/chart/radar',
+                'echarts/component/legend',
+                'echarts/component/tooltip'
+            ], function (echarts) {
+
+                var chart = echarts.init(document.getElementById('main'));
+
+                var xAxisData = [];
+                var data1 = [];
+                var data2 = [];
+                var data3 = [];
+
+                for (var i = 0; i < 10; i++) {
+                    xAxisData.push('类目' + i);
+                    data1.push((Math.random() * 2 + 1).toFixed(3));
+                    data3.push((Math.random() + 0.5).toFixed(3));
+                    data2.push((Math.random() + 0.5).toFixed(3));
+                }
+
+                chart.setOption({
+                    legend: {
+                        data: ['radar', 'radar2', 'radar3']
+                    },
+                    tooltip: {
+                        trigger: 'axis',
+                        axisPointer: {
+                            type: 'shadow'
+                        }
+                    },
+                    polar: {},
+                    angleAxis: {
+                        data: xAxisData,
+                        boundaryGap: false
+                    },
+                    radiusAxis: {
+                    },
+                    series: [{
+                        name: 'radar',
+                        stack: 'all',
+                        type: 'radar',
+                        symbolSize: 10,
+                        itemStyle: {
+                            normal: {
+                                areaStyle: {}
+                            }
+                        },
+                        data: data1
+                    }, {
+                        name: 'radar2',
+                        stack: 'all',
+                        type: 'radar',
+                        symbolSize: 10,
+                        itemStyle: {
+                            normal: {
+                                areaStyle: {}
+                            }
+                        },
+                        data: data2
+                    }, {
+                        name: 'radar3',
+                        stack: 'all',
+                        type: 'radar',
+                        symbolSize: 10,
+                        itemStyle: {
+                            normal: {
+                                areaStyle: {}
+                            }
+                        },
+                        data: data3
+                    }]
+                });
+            })
+
+        </script>
+    </body>
+</html>
\ No newline at end of file

test/scatter.html

@@ -19,12 +19,11 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/tooltip'
+                'echarts/component/tooltip',
+                'echarts/component/toolbox'
             ], function (echarts) {
 
-                var chart = echarts.init(document.getElementById('main'), null, {
-                    renderer: 'canvas'
-                });
+                var chart = echarts.init(document.getElementById('main'));
 
                 var data1 = [];
                 var data2 = [];
@@ -44,6 +43,13 @@
                     legend: {
                         data: ['scatter', 'scatter2', 'scatter3']
                     },
+                    toolbox: {
+                        x: 'left',
+                        feature: {
+                            dataView: {},
+                            saveAsImage: {}
+                        }
+                    },
                     tooltip: {
                         trigger: 'axis',
                         axisPointer: {

test/symbol-categories.html

@@ -36,7 +36,7 @@
                 'echarts/component/legend',
                 'echarts/component/tooltip',
                 'echarts/component/grid',
-                'echarts/component/dataRangePiecewise'
+                'echarts/component/visualMapPiecewise'
             ], function (dataBJ, dataGZ, dataSH, echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -138,7 +138,7 @@
                             }
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             x: 'right',
                             y: 'top',

test/dataRange-scatter-alpha.html → test/visualMap-scatter-alpha.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangePiecewise'
+                'echarts/component/visualMapPiecewise'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -75,7 +75,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             splitNumber: 6,
                             x: 'right',

test/dataRange-scatter-colorAndSymbol.html → test/visualMap-scatter-colorAndSymbol.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangePiecewise'
+                'echarts/component/visualMapPiecewise'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -83,7 +83,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             splitNumber: 7,

test/dataRange-scatter-continuous.html → test/visualMap-scatter-continuous.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -69,7 +69,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             y: 100,

test/dataRange-scatter-layout1-text.html → test/visualMap-scatter-layout1-text.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangePiecewise'
+                'echarts/component/visualMapPiecewise'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -83,7 +83,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             splitNumber: 7,

test/dataRange-scatter-layout1.html → test/visualMap-scatter-layout1.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangePiecewise'
+                'echarts/component/visualMapPiecewise'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -83,7 +83,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             splitNumber: 7,

test/dataRange-scatter-layout2-text.html → test/visualMap-scatter-layout2-text.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -83,7 +83,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             splitNumber: 7,

test/dataRange-scatter-layout2.html → test/visualMap-scatter-layout2.html

@@ -20,7 +20,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
@@ -83,7 +83,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             show: true,
                             splitNumber: 0,

test/dataRange-scatter-symbolSize.html → test/visualMap-scatter-symbolSize.html

@@ -20,12 +20,10 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/grid',
-                'echarts/component/dataRangeContinuous'
+                'echarts/component/visualMapContinuous'
             ], function (echarts) {
 
-                var chart = echarts.init(document.getElementById('main'), null, {
-                    renderer: 'canvas'
-                });
+                var chart = echarts.init(document.getElementById('main'));
 
                 var data1 = [];
                 var data2 = [];
@@ -82,7 +80,7 @@
                             show: false
                         }
                     },
-                    dataRange: [
+                    visualMap: [
                         {
                             min: 0,
                             max: 200,

test/webkit-dep.html

+<html>
+    <head>
+        <meta charset="utf-8">
+        <script src="esl.js"></script>
+        <script src="config.js"></script>
+        <script src="lib/jquery.min.js"></script>
+        <script src="lib/dat.gui.min.js"></script>
+    </head>
+    <body>
+        <style>
+            html, body, #main {
+                width: 100%;
+                height: 100%;
+                margin: 0;
+            }
+        </style>
+        <div id="main"></div>
+        <script>
+
+            require([
+                'echarts',
+
+                'echarts/chart/graph',
+
+                'echarts/component/title',
+                'echarts/component/legend',
+                'echarts/component/geo',
+                'echarts/component/tooltip',
+                'echarts/component/visualMap'
+            ], function (echarts) {
+
+                $.get('data/webkit-dep.json', function (webkitDep) {
+                    var chart = echarts.init(document.getElementById('main'));
+
+                    chart.setOption({
+                        legend: {
+                            data: ['HTMLElement', 'WebGL', 'SVG', 'CSS', 'Other']
+                        },
+                        series: [{
+                            type: 'graph',
+                            layout: 'force',
+                            animation: false,
+                            label: {
+                                normal: {
+                                    position: 'right',
+                                    formatter: '{b}'
+                                }
+                            },
+                            draggable: true,
+                            data: webkitDep.nodes.map(function (node, idx) {
+                                node.id = idx;
+                                return node;
+                            }),
+                            categories: webkitDep.categories,
+                            force: {
+                                // initLayout: 'circular'
+                                // gravity: 0
+                                // repulsion: 20,
+                                edgeLength: 5,
+                                repulsion: 20
+                            },
+                            edges: webkitDep.links
+                        }]
+                    });
+                });
+            });
+        </script>
+    </body>
+</html>
\ No newline at end of file

test/worldPopulationBubble.html

@@ -23,7 +23,7 @@
                 'echarts/chart/scatter',
                 'echarts/component/legend',
                 'echarts/component/geo',
-                'echarts/component/dataRange'
+                'echarts/component/visualMap'
             ], function (echarts) {
 
                 $.get('../map/json/world.json', function (worldJson) {
@@ -474,7 +474,7 @@
                                 return params.seriesName + '<br/>' + params.name + ' : ' + value;
                             }
                         },
-                        dataRange: {
+                        visualMap: {
                             show: false,
                             min: 0,
                             max: max,