如何从商店 sencha touch 为图表提供动态轴的最小值和最大值

Posted 2023-02-25

【中文标题】如何从商店 sencha touch 为图表提供动态轴的最小值和最大值

【英文标题】：how to give dynamic axes minimum and maximum values to chart from store sencha touch

【发布时间】：2013-07-24 20:07:16

【问题描述】：

我正在使用 xtype:chart，这是我的坐标轴。

   axes: [
      type: 'numeric',
      minimum: 0,
      position: 'left',
      fields: ['2011', '2012', '2013'],
      title: 'Sales',
      minorTickSteps: 1,
      grid: 
              odd: 
                      opacity: 1,
                      fill: '#ddd',
              
      ,
      style: 
              axisLine: false,
              estStepSize: 20,
              stroke: '#ddd',
              'stroke-width': 0.5
      ,
      minimum: 0,
      maximum: 1000
  , 
      type: 'category',
      position: 'bottom',
      fields: ['name'],
      title: 'Month of the Year',
      style: 
              estStepSize: 1,
              stroke: '#999'
      
 ]

这是我的问题，不同用户之间的最小值和最大值变化很大。就像图表不会显示，如果我为某些用户提供最小值 -0 和最大值为 10000 ..对于其他一些图表，如果我不显示使 0 -1000，所以我想在加载图表之前从商店更改最小值和最大值。有没有可能这样做？我请求一个例子。谢谢你

【参考方案1】：

不需要设置最小值和最大值，因为它将由sencha根据数据设置

如果你还想这样做，那么可以通过监听图表的初始化事件来做到这一点

可以说，这是轴

axes: [
        type: 'numeric',
        position: 'left',
        fields: ['data1'],
        title: 
            text: 'Sample Values',
            fontSize: 15
        ,
        grid: true,
        minimum: 0
    , 
        type: 'category',
        position: 'bottom',
        fields: ['name'],
        title: 
            text: 'Sample Values',
            fontSize: 15
        
    ],

并初始化监听器

    listeners : 
        initialize : function( me, eOpts ) 
            Ext.getStore('chartstore').load(
                callback: function(records, operation, success) 
                var data = records[0].data;
                 var axes = me.getAxes();
                 var SampleValuesAxis =  axes[0];
                    SampleValuesAxis.setMinimum(data.minimum);
                    SampleValuesAxis.setMaximum(data.maximum);
            ,
            scope: this
        );
       
   

【讨论】：

谢谢，我还是有问题，如果线条是步进和填充的，它们工作正常，但如果它是平滑的，线条就不会出现..smooth: true 不适用于我，如果我给出 fill: true 或 step: true .. 我可以知道我哪里出错了

该图表中有 3 条线（2011,2012,2013）.. 三条线显示得非常好，对我来说也很流畅.. 哪条线不适合你？

对我来说，填充工作正常 2013 年线......而 2011 年和 2012 年只有点不显示线..

你在用 chrome 测试吗？

是的..它在 chrome、ios 模拟器和 firefox 上也不起作用

【参考方案2】：

如果您没有为minimum 和maximum 设置任何值，Ext 将在每次加载商店时将轴调整为数据。