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

Re: Time Axis Issue with Setting Min/Max Dates in Charts 2.7.0

Expand Messages
  • tripp.bridges
    Hi, Labels should never overlap. Please file this as a bug and I will address it. In the interim, if you set the snapToUnits property on your axis to false,
    Message 1 of 5 , Feb 26, 2009
    • 0 Attachment
      Hi,
      Labels should never overlap. Please file this as a bug and I will
      address it. In the interim, if you set the "snapToUnits" property on
      your axis to false, it will remedy this issue.

      var date_axis = new YAHOO.widget.TimeAxis();
      date_axis.labelFunction = format_date;
      date_axis.snapToUnits = false;
      date_axis.maximum = new Date(2008, 11, 28);
      date_axis.minimum = new Date(2009, 1, 28);

      Please let me know if this is not a suitable workaround for now.
      Thanks for catching this bug.

      Tripp
      --- In ydn-javascript@yahoogroups.com, "Brendan" <dardaeon@...> wrote:
      >
      > Ok, here's the full sample code. The issue appears to be that when the
      > chart (or its parent element) has a small enough width then the first
      > tick on the x-axis is rendered on top of the tick for the minimum
      > value on the axis, which is always present. I also noticed that even
      > with a maximum date specified, there isn't always a tick near the
      > maximum value, leading to a large gap on the right side of the graph
      > that is not labeled. I reverted to 2.6 and tried this exact code, and
      > neither of these issues were present.
      >
      > This is assuming all the dependencies are defined above, etc.
      >
      > MARKUP:
      >
      > <div id="sandvich-chart" style="width: 300px;"></div>
      >
      > JAVASCRIPT:
      >
      > var sandvich_data = [{"date": "01/01/2009", "sandviches": 5714},
      > {"date": "01/07/2009", "sandviches": 15714}, {"date": "01/13/2009",
      > "sandviches": 27142}, {"date": "01/19/2009", "sandviches": 35145},
      > {"date": "01/25/2009", "sandviches": 40222}]
      > var date_field = {key: "date", parser:
      > YAHOO.util.DataSourceBase.parseDate};
      > var sandvich_field = {key: "sandviches", parser:
      > YAHOO.util.DataSourceBase.parseNumber};
      >
      > var format_date = function(d) {
      > return (d.getMonth() + 1).toString() + '/' + d.getDate() + '/' +
      > d.getFullYear().toString().substring(2,4);
      > };
      >
      > YAHOO.util.Event.onDOMReady(function () {
      >
      > var data_source = new YAHOO.util.DataSource(sandvich_data);
      > data_source.responseType = YAHOO.util.DataSourceBase.TYPE_JSARRAY;
      > data_source.responseSchema = {fields: [date_field, sandvich_field]};
      >
      > var sandvich_axis = new YAHOO.widget.NumericAxis();
      >
      > var date_axis = new YAHOO.widget.TimeAxis();
      > date_axis.labelFunction = format_date;
      > date_axis.maximum = new Date(2008, 11, 28);
      > date_axis.minimum = new Date(2009, 1, 28);
      >
      > var sandvich_series = [{displayName: "Sandviches", yField:
      > "sandviches"}];
      > var sandvich_chart = new YAHOO.widget.LineChart("sandvich-chart",
      > data_source, {xField: "date", series: sandvich_series, yAxis:
      > sandvich_axis, xAxis: date_axis});
      >
      > });
      >
      >
      >
      > --- In ydn-javascript@yahoogroups.com, "tripp.bridges" <trippb@> wrote:
      > >
      > > Hi,
      > > Could you provide a link or full sample code so that I can take a
      look?
      > >
      > > Thanks,
      > > Tripp
      > > --- In ydn-javascript@yahoogroups.com, "Brendan" <dardaeon@> wrote:
      > > >
      > > > I'm trying to set minimum and maximum dates on a TimeAxis for
      various
      > > > LineCharts and I keep seeing all of the dates scrunched up on top of
      > > > each other underneath the y-axis on the far left side. This
      appears to
      > > > be a regression, as this method of setting dates worked fine in 2.6:
      > > >
      > > > var date_axis = new YAHOO.widget.TimeAxis();
      > > > date_axis.labelFunction = format_date;
      > > > date_axis.maximum = new Date(year1, month1, day1);
      > > > date_axis.minimum = new Date(year2, month2, day2);
      > > >
      > > > Is there a new requirement like setting one of the majorUnit or
      > > > majorTimeUnit properties? Or is this a new rendering bug I
      should file
      > > > a report for?
      > > >
      > >
      >
    • Brendan
      The new ticket has been created here: http://yuilibrary.com/projects/yui2/ticket/2527741 Thanks a lot for your speedy responses. They re much appreciated. And
      Message 2 of 5 , Feb 26, 2009
      • 0 Attachment
        The new ticket has been created here:

        http://yuilibrary.com/projects/yui2/ticket/2527741

        Thanks a lot for your speedy responses. They're much appreciated.

        And that workaround is great for the time being.

        --- In ydn-javascript@yahoogroups.com, "tripp.bridges" <trippb@...> wrote:
        >
        > Hi,
        > Labels should never overlap. Please file this as a bug and I will
        > address it. In the interim, if you set the "snapToUnits" property on
        > your axis to false, it will remedy this issue.
        >
        > var date_axis = new YAHOO.widget.TimeAxis();
        > date_axis.labelFunction = format_date;
        > date_axis.snapToUnits = false;
        > date_axis.maximum = new Date(2008, 11, 28);
        > date_axis.minimum = new Date(2009, 1, 28);
        >
        > Please let me know if this is not a suitable workaround for now.
        > Thanks for catching this bug.
        >
        > Tripp
        > --- In ydn-javascript@yahoogroups.com, "Brendan" <dardaeon@> wrote:
        > >
        > > Ok, here's the full sample code. The issue appears to be that when the
        > > chart (or its parent element) has a small enough width then the first
        > > tick on the x-axis is rendered on top of the tick for the minimum
        > > value on the axis, which is always present. I also noticed that even
        > > with a maximum date specified, there isn't always a tick near the
        > > maximum value, leading to a large gap on the right side of the graph
        > > that is not labeled. I reverted to 2.6 and tried this exact code, and
        > > neither of these issues were present.
        > >
        > > This is assuming all the dependencies are defined above, etc.
        > >
        > > MARKUP:
        > >
        > > <div id="sandvich-chart" style="width: 300px;"></div>
        > >
        > > JAVASCRIPT:
        > >
        > > var sandvich_data = [{"date": "01/01/2009", "sandviches": 5714},
        > > {"date": "01/07/2009", "sandviches": 15714}, {"date": "01/13/2009",
        > > "sandviches": 27142}, {"date": "01/19/2009", "sandviches": 35145},
        > > {"date": "01/25/2009", "sandviches": 40222}]
        > > var date_field = {key: "date", parser:
        > > YAHOO.util.DataSourceBase.parseDate};
        > > var sandvich_field = {key: "sandviches", parser:
        > > YAHOO.util.DataSourceBase.parseNumber};
        > >
        > > var format_date = function(d) {
        > > return (d.getMonth() + 1).toString() + '/' + d.getDate() + '/' +
        > > d.getFullYear().toString().substring(2,4);
        > > };
        > >
        > > YAHOO.util.Event.onDOMReady(function () {
        > >
        > > var data_source = new YAHOO.util.DataSource(sandvich_data);
        > > data_source.responseType = YAHOO.util.DataSourceBase.TYPE_JSARRAY;
        > > data_source.responseSchema = {fields: [date_field,
        sandvich_field]};
        > >
        > > var sandvich_axis = new YAHOO.widget.NumericAxis();
        > >
        > > var date_axis = new YAHOO.widget.TimeAxis();
        > > date_axis.labelFunction = format_date;
        > > date_axis.maximum = new Date(2008, 11, 28);
        > > date_axis.minimum = new Date(2009, 1, 28);
        > >
        > > var sandvich_series = [{displayName: "Sandviches", yField:
        > > "sandviches"}];
        > > var sandvich_chart = new YAHOO.widget.LineChart("sandvich-chart",
        > > data_source, {xField: "date", series: sandvich_series, yAxis:
        > > sandvich_axis, xAxis: date_axis});
        > >
        > > });
        > >
        > >
        > >
        > > --- In ydn-javascript@yahoogroups.com, "tripp.bridges" <trippb@>
        wrote:
        > > >
        > > > Hi,
        > > > Could you provide a link or full sample code so that I can take a
        > look?
        > > >
        > > > Thanks,
        > > > Tripp
        > > > --- In ydn-javascript@yahoogroups.com, "Brendan" <dardaeon@> wrote:
        > > > >
        > > > > I'm trying to set minimum and maximum dates on a TimeAxis for
        > various
        > > > > LineCharts and I keep seeing all of the dates scrunched up on
        top of
        > > > > each other underneath the y-axis on the far left side. This
        > appears to
        > > > > be a regression, as this method of setting dates worked fine
        in 2.6:
        > > > >
        > > > > var date_axis = new YAHOO.widget.TimeAxis();
        > > > > date_axis.labelFunction = format_date;
        > > > > date_axis.maximum = new Date(year1, month1, day1);
        > > > > date_axis.minimum = new Date(year2, month2, day2);
        > > > >
        > > > > Is there a new requirement like setting one of the majorUnit or
        > > > > majorTimeUnit properties? Or is this a new rendering bug I
        > should file
        > > > > a report for?
        > > > >
        > > >
        > >
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.