Loading ...
Sorry, an error occurred while loading the content.

Re: Please test the YUI charts on different browser

Expand Messages
  • tripp.bridges
    Hi, You have an extra comma trailing the style object in your attributes argument of your PieChart constructor. This is causing issues with IE and probably
    Message 1 of 3 , Jun 27, 2008
    • 0 Attachment
      Hi,
      You have an extra comma trailing the style object in your attributes
      argument of your PieChart constructor. This is causing issues with IE
      and probably Safari. If you remove it, that issue should clear up for
      you.

      As mentioned in my previous post, there is a known issue for the
      charts control that is causing your other problem. The good news is
      that it will be fixed in the next release. If you need to assemble a
      workaround now, others have had success with different approaches. You
      can view the following posts:

      http://tech.groups.yahoo.com/group/ydn-javascript/message/28642
      http://tech.groups.yahoo.com/group/ydn-javascript/message/24652

      I played around with your code and mocked up a solution. You will need
      to bind it to the appropriate event fired by your tabs to get it to
      work. Basically, you'll need to reload the data when your transitions
      are complete and the tab is in view again.

      First, you'll need to create style object. It will contain all the
      data that you are currently passing as the style property of the
      attributes argument of your constructor.

      YAHOO.example.chartStyle = {
      padding: 20,
      legend:
      {
      display: "right",
      padding: 10,
      spacing: 5,
      font:
      {
      family: "Arial",
      size: 13
      }
      }
      }

      Next, replace the constructor style attribute with your new variable.

      var mychart = new YAHOO.widget.PieChart( "chart", opinionData,
      {
      dataField: "count",
      categoryField: "response",
      style:YAHOO.example.chartStyle
      });

      Use the set method to reload the dataSource, dataField and
      categoryFields. Pass your chartStyle object to the setStyles method of
      the chart.
      YAHOO.example.reloadChartData = function()
      {
      mychart.set("dataSource", mychart.get("dataSource"));
      mychart.set("dataField", mychart.get("dataField"));
      mychart.set("categoryField", mychart.get("categoryField"));
      mychart.setStyles(YAHOO.example.chartStyle);
      }

      All that's left is to trigger this function in your application after
      your tab change transition is complete.

      I hope this helps.

      Tripp


      --- In ydn-javascript@yahoogroups.com, norman <norman_khine@...> wrote:
      >
      > Hello,
      > I have a site, but I am having issues with displaying YUI charts
      correctly within the tabs.
      > I am using jQuery Tabs and I am not sure whether is an issue with
      YUI charts or jQuery.
      >
      > Here is the link http://uk.expert.travel
      >
      > The 3rd Tab called 'Statistics' pulls the example Pie chart page and
      the problem is that when you click on the tab for the first time, the
      chart shows up (on FF) but if you click on any other tab and then go
      back to this tab, you need to refresh the page before you can see the
      chart.
      >
      > The page that is loaded into the tab is
      http://uk.expert.travel/;statistics
      >
      > Also, I am not able to see the chart in Safari nor IE6, if you can
      please check it out. If you can send me a screen shot will really be
      great.
      >
      > Cheers
      > Norman
      >
      >
      >
      > __________________________________________________________
      > Sent from Yahoo! Mail.
      > A Smarter Email http://uk.docs.yahoo.com/nowyoucan.html
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.