ExtJS ViewPort ContentEl无法呈现Google可视化API饼图

Question

我无法在界面的边框布局中呈现Google饼图。虽然饼图在单独的html页面上运行良好。

股利如下：

的JavaScript代码如下所示： { 标题： '查看交互式报告'， ContentEl： “pChartMap”，
平淡的道：真的，
bodyStyle ： '填充：5px的'， 边界：假的， 自动滚屏：真 }

我不知道有关康特ntEl的事。它工作正常，如果有简单的文本，但由于谷歌图表基于谷歌可视化api和AJAX调用，其中有一个函数调用为： google.setOnLoadCallback（createChart）;

任何想法如何呈现这将不胜感激。

干杯 阿里

Answer 1

你有没有检查这个？ http://www.sencha.com/blog/2008/10/13/google-visualization/

可悲的是example page坏了，但仅仅是因为煎茶网站有没有ExtJS的的2.2源了;或者至少不是样本期望的地方;但如果您下载页面并使用ExtJS 2.3.0，它将起作用。

无论如何，你只需要下载这个js：http://dev.sencha.com/playpen/google-visualization/GVisualizationPanel.js

，然后只用了Ext.ux.GVisualizationPanel。这是我测试的一个例子：

Ext.onReady(function() { 
    var lineChartDs = new Ext.data.SimpleStore({ 
     fields: [ 
      {name: 'yr', type: 'string'} 
      ,{name: 'sales', type: 'int'} 
      ,{name: 'expenses', type: 'int'} 
     ], 
     data: [['2004',1000,400],['2005',1170,460],['2006',860,580],['2007',1030,540]] 
    }); 
    var lineChart = new Ext.ux.GVisualizationPanel({ 
     id: 'lineChart', 
     visualizationPkg: 'linechart', 
     title: 'Company Performance Sample', 
     store: lineChartDs, 
     columns: [ 
      {dataIndex: 'yr', label: 'Year'} 
      ,{dataIndex: 'sales', label: 'Sales'} 
      ,{dataIndex: 'expenses', label: 'Expenses'} 
     ] 
    }) 
    new Ext.Viewport({ 
     layout: 'fit', 
     items: [lineChart] 
    }); 
});