Question

我想在后台模式下载图表，但我不知道图表何时完全绘制并且所有动画都已完成。例如：

var chart = Ext.create({
    xtype: 'polar',
    width: 400,
    height: 400,
    store: {
       fields: ['Name', 'Data'],
       data: [
          { 'Name': 'Price',     'Data': 100 },
          { 'Name': 'Revenue %', 'Data': 100 },
          { 'Name': 'Growth %',  'Data': 100 },
          { 'Name': 'Product %', 'Data': 100 },
          { 'Name': 'Market %',  'Data': 100 }
       ]
    },
    axes: [{
        type: 'category',
        position: 'angular',
        grid: true
    }, {
        type: 'numeric',
        position: 'radial',
        grid: true
    }],
    series: [{
        type: 'radar',
        xField: 'Name',
        yField: 'Data',
   }],
   listeners: {
        afterrender: function() {
             chart.download(); // not work
        }
   }
});

Ext.create({
   xtype: 'panel',
   renderTo: Ext.getBody(),
   dockedItems: [{
       xtype: 'toolbar',
       dock: 'top',
       items: [{
           xtype: 'button',
           text: 'download chart',
           handler: function() {
               chart.download(); // works correctly
           }
       }]
   }]
});

var renderCt = document.createElement('div');
document.body.appendChild(renderCt);
chart.render(renderCt);

Sencha Fiddle

当我点击按钮＆＃34;下载图表＆＃34;。图表是正确下载的，但是当事件＆＃34;后现代＆＃34;被解雇我得到错误或下载的文件是空的（更确切地说，图像是透明的）。这是因为图表没有完全绘制。

我描述了我的情况。我在页面上有一些图表，他们有一些设置可以在这个页面上显示。但它的设置并不完整。我想在我的服务器上发送图表数据（图像base64数据）。数据应该是满的（例如设置图像的大小，然后在页面上显示（300x300 - 页面 - > 600x600 - 发送到服务器）并添加一些不适合页面的信息（图例和其他））。

即我想在我的服务器上发送多个图表，其中包含一个请求的完整设置，其中包含图表的所有完整数据（base64数据）。我应该知道所有图表何时完全在后台模式下绘制，我可以将数据发送到服务器。

完全绘制图表并完成动画后，是否有任何事件被触发？

感谢您的回答。

Answer 1

http://docs.sencha.com/extjs/6.2.1/classic/Ext.chart.PolarChart.html#method-afterShow

但是你应该重新考虑设计，没有明确的用户交互下载是不好的...... 另请查看this chromium commit

完全绘制完图表后我可以使用哪个事件，并在ext.js 6.x中完成动画？

1 个答案: