When your webchart renders, it creates a div with a table inside. The table has styling on it that gives the table a z-index: 4.
Example code:<div id="ctl00_x_UltraChart1" style=""> <table id="ctl00_x_UltraChart1_table" style="left:0px; top:0px; position: relative; z-index:4;">
This code resides in a usercontrol that resides on a page. The usercontrol that wraps around your chart has the style scroll:auto. Since your z-index:4 is on your table, the table causes the surrounding div tag to have scrollbars (like it should) but your chart is sitting 'on top' of the div, thus breaking my layout. The chart should be inside my div and scroll, not sit outside of my div.
Is there a way I can change your rendering options for the table that you put the webchart in?
I've tried:
<asp:Panel ID="Panel1" runat="server" Height="300px" Width="400px" ScrollBars="Auto">
<igchart:UltraChart ID="UltraChart1" runat="server" Width="500" Height="400" ...
...
</igchart:UltraChart>
</asp:Panel>
and it seems ok.
Yes, that was the first thing I did =/
It seems that if you put the webchart in a div and set the height to 400px with overflow:auto (you can put a 1px border on the div to see the effect), and then have a chart in that div with a height of 500px, the chart just pops on out of the enveloping div. The div creates the scrollbars, like it should, but the chart sits 'on top' of the div. I tried putting my div to z-index:100 to no avail.
Any other ideas?
Have you tried setting z-index your user control bigger that 4?