Browser hangs when Google Charts are used with <apex:TabPanel>

Question

Browser hangs when Google Charts are used with .Do I have any options other than using jquery tabs instead visualforce tabs.

<apex:page sidebar="false" >
<h1>Google Chart Test</h1>

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
 <script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Year', 'Sales', 'Expenses'],
      ['2004',  1000,      400],
      ['2005',  1170,      460],
      ['2006',  660,       1120],
      ['2007',  1030,      540]
    ]);

    var options = {
      title: 'Company Performance',
      vAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
    };

    var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>
  <apex:tabPanel title="myTab" switchType="server">
   <apex:tab >
     <div id="chart_div" style="width: 900px; height: 500px;"></div>
   </apex:tab>
  </apex:tabPanel>
 </apex:page>

Answer 1

This appears to be a question that's been asked a few times at least:

• Google Chart not working when using apex:tabPanel
• http://boards.developerforce.com/t5/Visualforce-Development/Google-Charts-hanging-when-used-with-lt-apex-TabPanel-gt/td-p/550025

These two appear to be incompatible for the time being. Would love to have a google or salesforce dev take a look at this.

My guess is that either Salesforce, Google, or probably both are changing something in the global variable space and then relying on nothing else to modify that thing. Things go sideways when that thing doesn't respond as expected.

I did spend some time with this, but since both sf and google code is minified, it's very difficult to figure out what's going on.

Answer 2

I came up with a workaround of using jquery tabs for visualforce page.Please find below link

Jquery tabs for Visualforce page