Cropping Legend of ComboChart in IE9 about every 5th load

[George]

Hello,

This has been seen only in IE9. The legend is displayed properly in IE8 and Firefox.

The legend is cropped and the y axis labels disappear every now and then. When the page is reloaded they appear again. It is inconsistent. It might happen 3 times in a row or only 1 out of 5.

 

The code is embedded in a separate tool where the data comes from. It is mostly for explanation.

google.load("visualization", "1", {"callback" : drawChart});

  function drawChart() {

      // Create and populate the data table.

      var data = new google.visualization.DataTable();

      data.addColumn('string', 'Month');

      data.addColumn('number', 'Long Series Name that will be cropped1');

      data.addColumn('number', 'Long Series Name that will be cropped2');

      data.addColumn('number', 'Long Series Name that will be cropped3');

      data.addColumn('number', 'Long Series Name that will be cropped4');

      data.addColumn('number', 'Long Series Name that will be cropped5');

      var myGeoArray=[];

//===========================================================================

     //There is a loop type structure here 

    //========Start Narrative===================

      myGeoArray.push(["@6",@1,@3,@4,@2,@5]);

      //========End Narrative=====================

//===========================================================================

      

   // Convert from an array data type(javascript type) to DataTable type (google visualization type)

         data.addRows(myGeoArray);

         //Formatting and giving options to the chart

         var chartOptions = {

           width: 1120,

           height: 560,

           hAxis: {title: " "},

           vAxis: {title:"FTE", titleTextStyle: {fontName: 'Times New Roman', color: '#000000', bold: false, italic: false}, textStyle: {color: "#000000", bold: false}, gridlines: {count: 8}},

           seriesType: "bars", 

           isStacked: true,

           series: { 1: {type: "area", color: "#E6781E"}, 2: {type: "area", color:"#FEBE10"}, isStacked: true, 4: {type: "line", color: "#870064"}, 

                     0: {color: "#0065B1"}, 3: {color: "#868686"} 

                   },

           allowHtml: true

         };

         var wrap = new google.visualization.ChartWrapper({

             'chartType':'ComboChart',

             'dataTable': data,

             'containerId':'div_combo_chart',

             'options': chartOptions

             }); 

         //Displaying the chart based on the data and the options

         wrap.draw();

Thanks,

George

[asgallant]

This is typically an issue with one of two things: either the API is not being loaded properly, or the chart is being drawn inside a hidden div.  At first glance, your code looks like it would load properly.  Do you draw in a hidden div (drawing inside tabs on a page is the typical way this happens)?

[Georgi Simeonov]

This is the html code that holds the div:

 <table>

     <tr>

       <td>

         <div id="div_combo_chart" style="width: 1400px; height: 700px;"></div>

       </td>

     </tr>

   </table>

Although the same happens when I remove the table and leave just:

         <div id="div_combo_chart" style="width: 1400px; height: 700px;"></div>

If I can judge by the debugger the code is loaded properly.

I have tried different ways to draw the chart with ChartWrapper and without but the result is the same.

Thanks,

George

--
You received this message because you are subscribed to a topic in the Google Groups "Google Visualization API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/4Ijvo9_HyfM/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.

[asgallant]

Do you have a public-facing page I can test this with?

To unsubscribe from this group and all its topics, send an email to google-visualization-api+unsub...@googlegroups.com.