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

Re: charts and minor units

Expand Messages
  • tripp.bridges
    Hi Laura, You are not able to rotate the text in YUI Charts. This is due to the fact that flash can only rotate embedded fonts. As for the gridlines and ticks,
    Message 1 of 6 , Oct 31, 2008
    • 0 Attachment
      Hi Laura,
      You are not able to rotate the text in YUI Charts. This is due to the
      fact that flash can only rotate embedded fonts. As for the gridlines
      and ticks, you should find all the documentation you need here:
      http://developer.yahoo.com/yui/charts/#basicstyles
      (although, It sounds like you already have those issues sorted)

      Thanks,
      Tripp

      --- In ydn-javascript@yahoogroups.com, "larhire" <larhire@...> wrote:
      >
      > I've digged though the .as files in the distribution and have found
      > some answers.
      >
      > For the first thing - I've decided agains using minor grid units for
      > now, but I added the tick marks for major grid units on the 0x axis
      > like so:
      > xAxis: {
      > majorTicks: {display: "always"}
      > }
      >
      >
      > For the second problem (minor grid lines not showing up), I've styled
      > the chart like so:
      >
      > yAxis: {
      > minorGridLines: {
      > color: 0xeeeeee,
      > size: 1
      > }
      > }
      >
      > Still looking into tilting the 0x text.
      >
      > Thanks,
      > Laura
      >
      > --- In ydn-javascript@yahoogroups.com, "larhire" <larhire@> wrote:
      > >
      > > Hello
      > >
      > > I've actually managed to do quite a lot with yui charts, it is one of
      > > the most impressive tools in the yui package. I'm now working on
      > > styling, and I am stumbling upon something though, maybe someone can
      > > help me.
      > >
      > > I have a chart like the one in the following picture:
      > >
      > > http://img247.imageshack.us/my.php?image=minorsj9.png
      > >
      > > The first problem is that the minor time units are not visible on the
      > > chart. The code I used is the following:
      > >
      > > var timeAxis = new YAHOO.widget.TimeAxis();
      > > timeAxis.labelFunction = dateFormatter;
      > > timeAxis.snapToUnits = true;
      > > timeAxis.majorTimeUnit = "hours";
      > > timeAxis.majorUnit = 1;
      > > timeAxis.minorTimeUnit = "minutes";
      > > timeAxis.minorUnit = 10;
      > > timeAxis.minimum = new Date(minimumDate.getTime() - 60 * 1000);
      > > timeAxis.maximum = new Date(maximumDate.getTime() + 60 * 1000 );
      > >
      > > So I should be getting minor units every 10 minutes on the chart -
      > > however, they are not displayed on the chart at all (I need the actual
      > > minute value at the bottom of the chart).
      > >
      > > The second problem would be with the minor units on the 0Y axis, they
      > > only show up as a very small line (at roughly x500, x from 0 to 5 in
      > > the picture) - it would be nice if there would be a dotted line of
      > > some sort showing up on the chart (would be easier to follow the minor
      > > units). I've looked into the js files but there does not seem to be a
      > > way to style the minor/major units so I'm just wondering if it is
      > > possible to do so.
      > >
      > > The code for the 0X axis is the following:
      > >
      > > var currencyAxis = new YAHOO.widget.NumericAxis();
      > > currencyAxis.stackingEnabled = true;
      > > currencyAxis.maximum = maxVal * 1.1;
      > > currencyAxis.majorUnit = parseInt (maxVal / 10);
      > > currencyAxis.minorUnit = parseInt (maxVal / 20);
      > > currencyAxis.labelFunction = numberFormatter;
      > >
      > > The third issue would be one of styling - I'd like the values on the
      > > 0X axis to be "tilted" diagonally (about 45 degrees), so more would
      > > fit on the same chart. In the picture above, they are fully
      > > horizontal. Can this be done in the current API?
      > >
      > > Thanks!
      > > Laura
      > >
      >
    • Laura Arhire
      Hi Tripp, Thanks for the reply. As I was looking through charts source code I saw there is code there to make chart labels rotate (heavily commented with the
      Message 2 of 6 , Nov 2, 2008
      • 0 Attachment
        Hi Tripp,

        Thanks for the reply. As I was looking through charts source code I saw there is code there to make chart labels rotate (heavily commented with the embed fonts option). Am I correct in guessing this functionality will be added in a future release of yui ?

        Thanks again,
        Laura

        On Fri, Oct 31, 2008 at 6:43 PM, tripp.bridges <trippb@...> wrote:

        Hi Laura,
        You are not able to rotate the text in YUI Charts. This is due to the
        fact that flash can only rotate embedded fonts. As for the gridlines
        and ticks, you should find all the documentation you need here:
        http://developer.yahoo.com/yui/charts/#basicstyles
        (although, It sounds like you already have those issues sorted)

        Thanks,
        Tripp



        --- In ydn-javascript@yahoogroups.com, "larhire" <larhire@...> wrote:
        >
        > I've digged though the .as files in the distribution and have found
        > some answers.
        >
        > For the first thing - I've decided agains using minor grid units for
        > now, but I added the tick marks for major grid units on the 0x axis
        > like so:
        > xAxis: {
        > majorTicks: {display: "always"}
        > }
        >
        >
        > For the second problem (minor grid lines not showing up), I've styled
        > the chart like so:
        >
        > yAxis: {
        > minorGridLines: {
        > color: 0xeeeeee,
        > size: 1
        > }
        > }
        >
        > Still looking into tilting the 0x text.
        >
        > Thanks,
        > Laura
        >
        > --- In ydn-javascript@yahoogroups.com, "larhire" <larhire@> wrote:
        > >
        > > Hello
        > >
        > > I've actually managed to do quite a lot with yui charts, it is one of
        > > the most impressive tools in the yui package. I'm now working on
        > > styling, and I am stumbling upon something though, maybe someone can
        > > help me.
        > >
        > > I have a chart like the one in the following picture:
        > >
        > > http://img247.imageshack.us/my.php?image=minorsj9.png
        > >
        > > The first problem is that the minor time units are not visible on the
        > > chart. The code I used is the following:
        > >
        > > var timeAxis = new YAHOO.widget.TimeAxis();
        > > timeAxis.labelFunction = dateFormatter;
        > > timeAxis.snapToUnits = true;
        > > timeAxis.majorTimeUnit = "hours";
        > > timeAxis.majorUnit = 1;
        > > timeAxis.minorTimeUnit = "minutes";
        > > timeAxis.minorUnit = 10;
        > > timeAxis.minimum = new Date(minimumDate.getTime() - 60 * 1000);
        > > timeAxis.maximum = new Date(maximumDate.getTime() + 60 * 1000 );
        > >
        > > So I should be getting minor units every 10 minutes on the chart -
        > > however, they are not displayed on the chart at all (I need the actual
        > > minute value at the bottom of the chart).
        > >
        > > The second problem would be with the minor units on the 0Y axis, they
        > > only show up as a very small line (at roughly x500, x from 0 to 5 in
        > > the picture) - it would be nice if there would be a dotted line of
        > > some sort showing up on the chart (would be easier to follow the minor
        > > units). I've looked into the js files but there does not seem to be a
        > > way to style the minor/major units so I'm just wondering if it is
        > > possible to do so.
        > >
        > > The code for the 0X axis is the following:
        > >
        > > var currencyAxis = new YAHOO.widget.NumericAxis();
        > > currencyAxis.stackingEnabled = true;
        > > currencyAxis.maximum = maxVal * 1.1;
        > > currencyAxis.majorUnit = parseInt (maxVal / 10);
        > > currencyAxis.minorUnit = parseInt (maxVal / 20);
        > > currencyAxis.labelFunction = numberFormatter;
        > >
        > > The third issue would be one of styling - I'd like the values on the
        > > 0X axis to be "tilted" diagonally (about 45 degrees), so more would
        > > fit on the same chart. In the picture above, they are fully
        > > horizontal. Can this be done in the current API?
        > >
        > > Thanks!
        > > Laura
        > >
        >


      • tripp.bridges
        Hi Laura The YUI Charts SWF uses the same source files as the ASTRA Charts component for flash developers. http://developer.yahoo.com/flash/astra-flash/charts/
        Message 3 of 6 , Nov 2, 2008
        • 0 Attachment
          Hi Laura
          The YUI Charts SWF uses the same source files as the ASTRA Charts
          component for flash developers.
          http://developer.yahoo.com/flash/astra-flash/charts/ Since ASTRA
          components are used in applications compiled by the developer, the
          developer has the option of embedding a font in their application and
          using this functionality. In short, this code exists for the ASTRA
          component and not its YUI counterpart.

          I will, however, log this as a feature request for the YUI Chart
          component as flash player 10 supports more robust handling of device
          fonts. This would have to be in a future release and it would only
          work for end-users who have flash player 10.

          Thanks,
          Tripp
          --- In ydn-javascript@yahoogroups.com, "Laura Arhire" <larhire@...> wrote:
          >
          > Hi Tripp,
          >
          > Thanks for the reply. As I was looking through charts source code I saw
          > there is code there to make chart labels rotate (heavily commented
          with the
          > embed fonts option). Am I correct in guessing this functionality will be
          > added in a future release of yui ?
          >
          > Thanks again,
          > Laura
          >
          > On Fri, Oct 31, 2008 at 6:43 PM, tripp.bridges <trippb@...> wrote:
          >
          > > Hi Laura,
          > > You are not able to rotate the text in YUI Charts. This is due to the
          > > fact that flash can only rotate embedded fonts. As for the gridlines
          > > and ticks, you should find all the documentation you need here:
          > > http://developer.yahoo.com/yui/charts/#basicstyles
          > > (although, It sounds like you already have those issues sorted)
          > >
          > > Thanks,
          > > Tripp
          > >
          > >
          > > --- In ydn-javascript@yahoogroups.com
          <ydn-javascript%40yahoogroups.com>,
          > > "larhire" <larhire@> wrote:
          > > >
          > > > I've digged though the .as files in the distribution and have found
          > > > some answers.
          > > >
          > > > For the first thing - I've decided agains using minor grid units for
          > > > now, but I added the tick marks for major grid units on the 0x axis
          > > > like so:
          > > > xAxis: {
          > > > majorTicks: {display: "always"}
          > > > }
          > > >
          > > >
          > > > For the second problem (minor grid lines not showing up), I've
          styled
          > > > the chart like so:
          > > >
          > > > yAxis: {
          > > > minorGridLines: {
          > > > color: 0xeeeeee,
          > > > size: 1
          > > > }
          > > > }
          > > >
          > > > Still looking into tilting the 0x text.
          > > >
          > > > Thanks,
          > > > Laura
          > > >
          > > > --- In ydn-javascript@yahoogroups.com
          <ydn-javascript%40yahoogroups.com>,
          > > "larhire" <larhire@> wrote:
          > > > >
          > > > > Hello
          > > > >
          > > > > I've actually managed to do quite a lot with yui charts, it is
          one of
          > > > > the most impressive tools in the yui package. I'm now working on
          > > > > styling, and I am stumbling upon something though, maybe
          someone can
          > > > > help me.
          > > > >
          > > > > I have a chart like the one in the following picture:
          > > > >
          > > > > http://img247.imageshack.us/my.php?image=minorsj9.png
          > > > >
          > > > > The first problem is that the minor time units are not visible
          on the
          > > > > chart. The code I used is the following:
          > > > >
          > > > > var timeAxis = new YAHOO.widget.TimeAxis();
          > > > > timeAxis.labelFunction = dateFormatter;
          > > > > timeAxis.snapToUnits = true;
          > > > > timeAxis.majorTimeUnit = "hours";
          > > > > timeAxis.majorUnit = 1;
          > > > > timeAxis.minorTimeUnit = "minutes";
          > > > > timeAxis.minorUnit = 10;
          > > > > timeAxis.minimum = new Date(minimumDate.getTime() - 60 * 1000);
          > > > > timeAxis.maximum = new Date(maximumDate.getTime() + 60 * 1000 );
          > > > >
          > > > > So I should be getting minor units every 10 minutes on the chart -
          > > > > however, they are not displayed on the chart at all (I need
          the actual
          > > > > minute value at the bottom of the chart).
          > > > >
          > > > > The second problem would be with the minor units on the 0Y
          axis, they
          > > > > only show up as a very small line (at roughly x500, x from 0
          to 5 in
          > > > > the picture) - it would be nice if there would be a dotted line of
          > > > > some sort showing up on the chart (would be easier to follow
          the minor
          > > > > units). I've looked into the js files but there does not seem
          to be a
          > > > > way to style the minor/major units so I'm just wondering if it is
          > > > > possible to do so.
          > > > >
          > > > > The code for the 0X axis is the following:
          > > > >
          > > > > var currencyAxis = new YAHOO.widget.NumericAxis();
          > > > > currencyAxis.stackingEnabled = true;
          > > > > currencyAxis.maximum = maxVal * 1.1;
          > > > > currencyAxis.majorUnit = parseInt (maxVal / 10);
          > > > > currencyAxis.minorUnit = parseInt (maxVal / 20);
          > > > > currencyAxis.labelFunction = numberFormatter;
          > > > >
          > > > > The third issue would be one of styling - I'd like the values
          on the
          > > > > 0X axis to be "tilted" diagonally (about 45 degrees), so more
          would
          > > > > fit on the same chart. In the picture above, they are fully
          > > > > horizontal. Can this be done in the current API?
          > > > >
          > > > > Thanks!
          > > > > Laura
          > > > >
          > > >
          > >
          > >
          > >
          >
        • Laura Arhire
          Hi Tripp, I understand now, this is good to know. It would bring a nice flavor to the charts if it will make it into a release. Thanks again for the great work
          Message 4 of 6 , Nov 2, 2008
          • 0 Attachment
            Hi Tripp,

            I understand now, this is good to know. It would bring a nice flavor to the charts if it will make it into a release.

            Thanks again for the great work with the charts (and the really swift replies!), it is truly great stuff! It has saved me a ton of work - and they have a very nice feel to them. Great job!

            Laura

            On Sun, Nov 2, 2008 at 7:59 PM, tripp.bridges <trippb@...> wrote:

            Hi Laura
            The YUI Charts SWF uses the same source files as the ASTRA Charts
            component for flash developers.
            http://developer.yahoo.com/flash/astra-flash/charts/ Since ASTRA
            components are used in applications compiled by the developer, the
            developer has the option of embedding a font in their application and
            using this functionality. In short, this code exists for the ASTRA
            component and not its YUI counterpart.

            I will, however, log this as a feature request for the YUI Chart
            component as flash player 10 supports more robust handling of device
            fonts. This would have to be in a future release and it would only
            work for end-users who have flash player 10.

            Thanks,
            Tripp

            --- In ydn-javascript@yahoogroups.com, "Laura Arhire" <larhire@...> wrote:
            >
            > Hi Tripp,
            >
            > Thanks for the reply. As I was looking through charts source code I saw
            > there is code there to make chart labels rotate (heavily commented
            with the
            > embed fonts option). Am I correct in guessing this functionality will be
            > added in a future release of yui ?
            >
            > Thanks again,
            > Laura
            >
            > On Fri, Oct 31, 2008 at 6:43 PM, tripp.bridges <trippb@...> wrote:
            >
            > > Hi Laura,
            > > You are not able to rotate the text in YUI Charts. This is due to the
            > > fact that flash can only rotate embedded fonts. As for the gridlines
            > > and ticks, you should find all the documentation you need here:
            > > http://developer.yahoo.com/yui/charts/#basicstyles
            > > (although, It sounds like you already have those issues sorted)
            > >
            > > Thanks,
            > > Tripp
            > >
            > >
            > > --- In ydn-javascript@yahoogroups.com
            <ydn-javascript%40yahoogroups.com>,

            > > "larhire" <larhire@> wrote:
            > > >
            > > > I've digged though the .as files in the distribution and have found
            > > > some answers.
            > > >
            > > > For the first thing - I've decided agains using minor grid units for
            > > > now, but I added the tick marks for major grid units on the 0x axis
            > > > like so:
            > > > xAxis: {
            > > > majorTicks: {display: "always"}
            > > > }
            > > >
            > > >
            > > > For the second problem (minor grid lines not showing up), I've
            styled
            > > > the chart like so:
            > > >
            > > > yAxis: {
            > > > minorGridLines: {
            > > > color: 0xeeeeee,
            > > > size: 1
            > > > }
            > > > }
            > > >
            > > > Still looking into tilting the 0x text.
            > > >
            > > > Thanks,
            > > > Laura
            > > >
            > > > --- In ydn-javascript@yahoogroups.com
            <ydn-javascript%40yahoogroups.com>,

            > > "larhire" <larhire@> wrote:
            > > > >
            > > > > Hello
            > > > >
            > > > > I've actually managed to do quite a lot with yui charts, it is
            one of
            > > > > the most impressive tools in the yui package. I'm now working on
            > > > > styling, and I am stumbling upon something though, maybe
            someone can
            > > > > help me.
            > > > >
            > > > > I have a chart like the one in the following picture:
            > > > >
            > > > > http://img247.imageshack.us/my.php?image=minorsj9.png
            > > > >
            > > > > The first problem is that the minor time units are not visible
            on the
            > > > > chart. The code I used is the following:
            > > > >
            > > > > var timeAxis = new YAHOO.widget.TimeAxis();
            > > > > timeAxis.labelFunction = dateFormatter;
            > > > > timeAxis.snapToUnits = true;
            > > > > timeAxis.majorTimeUnit = "hours";
            > > > > timeAxis.majorUnit = 1;
            > > > > timeAxis.minorTimeUnit = "minutes";
            > > > > timeAxis.minorUnit = 10;
            > > > > timeAxis.minimum = new Date(minimumDate.getTime() - 60 * 1000);
            > > > > timeAxis.maximum = new Date(maximumDate.getTime() + 60 * 1000 );
            > > > >
            > > > > So I should be getting minor units every 10 minutes on the chart -
            > > > > however, they are not displayed on the chart at all (I need
            the actual
            > > > > minute value at the bottom of the chart).
            > > > >
            > > > > The second problem would be with the minor units on the 0Y
            axis, they
            > > > > only show up as a very small line (at roughly x500, x from 0
            to 5 in
            > > > > the picture) - it would be nice if there would be a dotted line of
            > > > > some sort showing up on the chart (would be easier to follow
            the minor
            > > > > units). I've looked into the js files but there does not seem
            to be a
            > > > > way to style the minor/major units so I'm just wondering if it is
            > > > > possible to do so.
            > > > >
            > > > > The code for the 0X axis is the following:
            > > > >
            > > > > var currencyAxis = new YAHOO.widget.NumericAxis();
            > > > > currencyAxis.stackingEnabled = true;
            > > > > currencyAxis.maximum = maxVal * 1.1;
            > > > > currencyAxis.majorUnit = parseInt (maxVal / 10);
            > > > > currencyAxis.minorUnit = parseInt (maxVal / 20);
            > > > > currencyAxis.labelFunction = numberFormatter;
            > > > >
            > > > > The third issue would be one of styling - I'd like the values
            on the
            > > > > 0X axis to be "tilted" diagonally (about 45 degrees), so more
            would
            > > > > fit on the same chart. In the picture above, they are fully
            > > > > horizontal. Can this be done in the current API?
            > > > >
            > > > > Thanks!
            > > > > Laura
            > > > >
            > > >
            > >
            > >
            > >
            >


          Your message has been successfully submitted and would be delivered to recipients shortly.