This is a migrated thread and some comments may be shown as answers.

IE7, IE8 Bar Chart Display Issue

3 Answers 118 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
Daniel
Top achievements
Rank 1
Iron
Daniel asked on 15 Nov 2012, 01:30 PM

I have a bar chart that displays correctly in IE9, but not IE8 and IE7. In IE8 and IE7 there is also a JavaScript error message: "Error: Unable to get value of the property 'clone': object is null or undefined". The JavaScript error however does not appear if a chart title is specified.
The chart displays correctly in IE8 and IE7 if either: 1. the chart border is removed, or 2. a chart height is speciifed. The error can be reproduced with the following chart. Again, the chart displays correctly in IE9, but not IE8 and IE7.

<
telerik:RadHtmlChart runat="server" ID="chart" BorderColor="Black" BorderStyle="Solid" BorderWidth="1">

  <PlotArea>

    <Series>

      <telerik:BarSeries Name="2009">

        <Items>

          <telerik:SeriesItem YValue="116" />

          <telerik:SeriesItem YValue="332" />

          <telerik:SeriesItem YValue="213" />

        </Items>

      </telerik:BarSeries>

    </Series>

  </PlotArea>

</telerik:RadHtmlChart>

 
Is the HtmlChart compatible with IE7 and IE8? If so, is there a limitation that I'm not aware of, or is this a bug?
Thanks...

3 Answers, 1 is accepted

Sort by
0
Daniel
Top achievements
Rank 1
Iron
answered on 15 Nov 2012, 01:37 PM
I forgot to mention that the above error occurs on:
ASP .NET 4.0
Windows 7 Pro
Telerik Controls version 2012.3.1016.40
0
Marin Bratanov
Telerik team
answered on 16 Nov 2012, 01:43 PM
Hi Daniel,

We do support IE7 and IE8. Indeed, there seems to be a problem in the case you have described and I am logging it for research. You can follow the issue's progress, comment and vote on it in this URL. I have also updated your Telerik points for your report.

What I would advise as a general point is to always set dimensions for the chart so that it knows where and how to render. It is a data visualization control, so it is more or less static and it does not support size set in percentage (which is exactly what a simple div without explicit dimensions is).

It is also important to note that the BorderColor, BorderStyle and BorderWidth properties are merely inherited from WebControl and are not implemented here, so they should be avoided.

All that being said - the following markup works fine with me, and I would suggest using CSS rules to set properties for your chart wrappers:
.chartContainer
{
    border: 1px solid black;
    width: 640px;
    height: 480px;
}
<div class="chartContainer">
    <telerik:RadHtmlChart runat="server" ID="chart" Width="640px" Height="480px">
        <PlotArea>
            <Series>
                <telerik:BarSeries Name="2009">
                    <Items>
                        <telerik:SeriesItem YValue="116" />
                        <telerik:SeriesItem YValue="332" />
                        <telerik:SeriesItem YValue="213" />
                    </Items>
                </telerik:BarSeries>
            </Series>
        </PlotArea>
    </telerik:RadHtmlChart>
</div>


Regards,
Marin Bratanov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Daniel
Top achievements
Rank 1
Iron
answered on 16 Nov 2012, 07:16 PM
That works. Thanks for the information.
Tags
Chart (HTML5)
Asked by
Daniel
Top achievements
Rank 1
Iron
Answers by
Daniel
Top achievements
Rank 1
Iron
Marin Bratanov
Telerik team
Share this question
or