Question

我是Ext JS和Sencha排行榜的新手。对于我们的应用程序，我们有多个图表，其中一个图表我需要隐藏X轴上的破折号。我们使用的是Ext JS 5.1版，我找不到dashSize属性。在框架中进行了一些挖掘后，我做了一个空的覆盖，如下面的

Ext.define('Ext.overrides.chart.axis.sprite.Axis', {
override: 'Ext.chart.axis.sprite.Axis',

renderTicks: function (surface, ctx, layout, clipRect) {        
}});

这对我的要求来说就像一个魅力，但适用于应用程序中的所有图表，我如何进行条件覆盖，所以我需要这样的东西，但不太确定如何将配置传递给框架

Ext.define('Ext.overrides.chart.axis.sprite.Axis', {
override: 'Ext.chart.axis.sprite.Axis',

renderTicks: function (surface, ctx, layout, clipRect) { 
   if(condition)
      //empty
   else
      this.superclass.renderTicks.call();
}});

请帮助。如果我需要提供更多详细信息，请告诉我......

Answer 1

如果您根本不需要底部轴，只需设置：

即可

axes: [{
    type: 'category',
    position: 'bottom',
    fields: 'name',
    hidden: true // this will hide the axis
}]

如果这不是一个好的选择，并且您的覆盖适用于您，您可以简单地向轴添加一个额外的配置以将其用作条件，如下所示：

axes: [{
    type: 'category',
    position: 'bottom',
    fields: 'name',
    hideMajorTicks: true // custom config
}]

Ext.define('Ext.overrides.chart.axis.sprite.Axis', {
    override: 'Ext.chart.axis.sprite.Axis',

    renderTicks: function (surface, ctx, layout, clipRect) {
        var axis = layout.segmenter && layout.segmenter.getAxis();

        if (axis && axis.hideMajorTicks) return;

        this.callParent([surface, ctx, layout, clipRect]);
    }
});

有条件地覆盖Ext JS / Sencha Chart框架

1 个答案: