You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by GitBox <gi...@apache.org> on 2018/11/22 06:40:03 UTC

[GitHub] iAmGhost commented on issue #8310: 多坐标下,x轴为类目时,magicType切换'line',各坐标boundaryGap不一致

iAmGhost commented on issue #8310: 多坐标下,x轴为类目时,magicType切换'line',各坐标boundaryGap不一致
URL: https://github.com/apache/incubator-echarts/issues/8310#issuecomment-440928202
 
 
   Here's monkey-patching code for this problem. after applying this:
   - It respects original boundaryGap option.
   - It changes boundaryGap option for all axes, not just for first one.
   
   ```javascript
   var MagicType = require('echarts/lib/component/toolbox/feature/MagicType');
   
   var zrUtil = require("zrender/lib/core/util");
   
   
   var seriesOptGenreator = {
       'line': function (seriesType, seriesId, seriesModel, model) {
           if (seriesType === 'bar') {
               return zrUtil.merge({
                   id: seriesId,
                   type: 'line',
                   // Preserve data related option
                   data: seriesModel.get('data'),
                   stack: seriesModel.get('stack'),
                   markPoint: seriesModel.get('markPoint'),
                   markLine: seriesModel.get('markLine')
               }, model.get('option.line') || {}, true);
           }
       },
       'bar': function (seriesType, seriesId, seriesModel, model) {
           if (seriesType === 'line') {
               return zrUtil.merge({
                   id: seriesId,
                   type: 'bar',
                   // Preserve data related option
                   data: seriesModel.get('data'),
                   stack: seriesModel.get('stack'),
                   markPoint: seriesModel.get('markPoint'),
                   markLine: seriesModel.get('markLine')
               }, model.get('option.bar') || {}, true);
           }
       },
       'stack': function (seriesType, seriesId, seriesModel, model) {
           if (seriesType === 'line' || seriesType === 'bar') {
               return zrUtil.merge({
                   id: seriesId,
                   stack: '__ec_magicType_stack__'
               }, model.get('option.stack') || {}, true);
           }
       },
       'tiled': function (seriesType, seriesId, seriesModel, model) {
           if (seriesType === 'line' || seriesType === 'bar') {
               return zrUtil.merge({
                   id: seriesId,
                   stack: ''
               }, model.get('option.tiled') || {}, true);
           }
       }
   };
   
   var radioTypes = [['line', 'bar'], ['stack', 'tiled']];
   
   MagicType.prototype.onclick = function (ecModel, api, type) {
       var model = this.model;
       var seriesIndex = model.get('seriesIndex.' + type); // Not supported magicType
   
       if (!seriesOptGenreator[type]) {
           return;
       }
   
       var newOption = {
           series: []
       };
   
       var generateNewSeriesTypes = function (seriesModel) {
           var seriesType = seriesModel.subType;
           var seriesId = seriesModel.id;
           var newSeriesOpt = seriesOptGenreator[type](seriesType, seriesId, seriesModel, model);
   
           if (newSeriesOpt) {
               // PENDING If merge original option?
               zrUtil.defaults(newSeriesOpt, seriesModel.option);
               newOption.series.push(newSeriesOpt);
           } // Modify boundaryGap
   
   
           var coordSys = seriesModel.coordinateSystem;
   
           if (coordSys && coordSys.type === 'cartesian2d' && (type === 'line' || type === 'bar')) {
               var categoryAxis = coordSys.getAxesByScale('ordinal')[0];
   
               if (categoryAxis) {
                   var axisDim = categoryAxis.dim;
                   var axisType = axisDim + 'Axis';
                   var axisModels = ecModel.queryComponents({
                       mainType: axisType,
                       index: seriesModel.get(name + 'Index'),
                       id: seriesModel.get(name + 'Id')
                   });
   
                   for (var axisModelIndex = 0; axisModelIndex < axisModels.length; axisModelIndex++) {
                       var axisModel = axisModels[axisModelIndex];
   
                       var axisIndex = axisModel.componentIndex;
                       newOption[axisType] = newOption[axisType] || [];
   
                       for (var i = 0; i <= axisIndex; i++) {
                           newOption[axisType][axisIndex] = newOption[axisType][axisIndex] || {};
                       }
   
                       newOption[axisType][axisIndex].boundaryGap = type === 'bar' ? true : axisModel.option.boundaryGap;
                   }
               }
           }
       };
   
       zrUtil.each(radioTypes, function (radio) {
           if (zrUtil.indexOf(radio, type) >= 0) {
               zrUtil.each(radio, function (item) {
                   model.setIconStatus(item, 'normal');
               });
           }
       });
       model.setIconStatus(type, 'emphasis');
       ecModel.eachComponent({
           mainType: 'series',
           query: seriesIndex == null ? null : {
               seriesIndex: seriesIndex
           }
       }, generateNewSeriesTypes);
       api.dispatchAction({
           type: 'changeMagicType',
           currentType: type,
           newOption: newOption
       });
   };
   ```

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org