Skip to content

Implement different data-based autorange mode #928

Description

@fhurta

Scatter graph with traces using autorange on x-axis has left and right gap if any of the traces has markers flag set on trace.mode.

If mode='lines' for all traces, the leftmost trace points are displayed on the leftmost point of X-axis, but if the mode is changed to e.g. lines+markers, there is a gap from the left and from the right. This visualization looks strange for time series data - it looks like there are no data point within the gaps..

See sample, change the traceX.mode to lines to see the difference.

Activity

  1. etpinard commented on Sep 12, 2016

    @etpinard
    Contributor

    This is the intended behaviour at the moment.

    Can you expand on why this undesirable for your use case?

  2. fhurta commented on Sep 12, 2016

    @fhurta
    ContributorAuthor

    I'm showing the data for specified time range selected by user. On Pan event (or Zoom) I load the data for the new interval. The data is continuous time series stored in historian database for several years so user can pan backwards to see older data.

  3. etpinard commented on Sep 12, 2016

    @etpinard
    Contributor

    ... and what's wrong with the current autorange for lines?

  4. etpinard commented on Sep 12, 2016

    @etpinard
    Contributor

    I guess you're looking for some autorange padding setting?

  5. fhurta commented on Sep 12, 2016

    @fhurta
    ContributorAuthor

    Exactly, I would use padding=0 for my case

  6. fhurta commented on Sep 12, 2016

    @fhurta
    ContributorAuthor

    When all traces have lines mode, it is OK. That's why I haven't noticed this behavior before. Once I allowed to set (and display) the markers and the gap appeared I considered it as bug..

  7. etpinard commented on Sep 12, 2016

    @etpinard
    Contributor

    Great. I'll change this issue title accordingly.

    This issue is somewhat related to #387

  8. changed the title [-]X-axis autorange depends on trace.mode[/-] [+]Implement different data-based autorange mode[/+] on Sep 12, 2016
  9. erikrenberg commented on Apr 24, 2018

    @erikrenberg

    Any progress on this?

    It's a bit of a waste to have padding that could be used for actual data at both ends of the chart when markers are used.

  10. advaithasabnis commented on Apr 28, 2020

    @advaithasabnis

    I'm looking for the opposite - only some scatter traces seem to have the padding but bar traces or filled-area traces don't. So if we have two or more types of traces in a plot, toggling one on or off affects the axis range. (In my specific example, I have a marker+lines scatter trace and bar trace. If I toggle off the scatter, then the bar trace "extends" to occupy the full x-axis).

  11. jackparmer commented on Sep 10, 2020

    @jackparmer
    Contributor

    This issue has been tagged with NEEDS SPON$OR

    A community PR for this feature would certainly be welcome, but our experience is deeper features like this are difficult to complete without the Plotly maintainers leading the effort.

    What Sponsorship includes:

    • Completion of this feature to the Sponsor's satisfaction, in a manner coherent with the rest of the Plotly.js library and API
    • Tests for this feature
    • Long-term support (continued support of this feature in the latest version of Plotly.js)
    • Documentation at plotly.com/javascript
    • Possibility of integrating this feature with Plotly Graphing Libraries (Python, R, F#, Julia, MATLAB, etc)
    • Possibility of integrating this feature with Dash
    • Feature announcement on community.plotly.com with shout out to Sponsor (or can remain anonymous)
    • Gratification of advancing the world's most downloaded, interactive scientific graphing libraries (>50M downloads across supported languages)

    Please include the link to this issue when contacting us to discuss.

  12. amroczeK commented on Apr 29, 2021

    @amroczeK

    Not sure if this helps you guys, but here is an example of removing the padding on the X-Axis for line+scatter charts.

    https://jsfiddle.net/amroczeK90/waj25yc8/3/

    Setting the range on the X-Axis did the trick.

    xaxis: { range: [data[0]["x"][0], data[0]["x"][data[0]["x"].length-1]] }

    Also make sure you haven't set "autorange" to true.

  13. ajafff commented on Jun 24, 2021

    @ajafff

    FYI: I just discovered that adding fill removes the padding. Setting fillcolor: 'transparent' hides the fill and everything works as expected.

    I changed the fiddle form above accordingly: https://jsfiddle.net/zv6kuh1f/

  14. YasserHassan commented on Mar 15, 2022

    @YasserHassan

    @ajafff good observation but seems not suitable for all cases. I tried it from Python and it enforces the chart to extend down to the zero line (since fill='tozeroy') which is not always desired.

    Edit: Changing yaxes range fixed it for me.

  15. gvwilson commented on Jun 5, 2024

    @gvwilson
    Contributor

    Hi - this issue has been sitting for a while, so as part of our effort to tidy up our public repositories I'm going to close it. If it's still a concern, we'd be grateful if you could open a new issue (with a short reproducible example if appropriate) so that we can add it to our stack. Cheers - @gvwilson

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions