Code Monkey home page Code Monkey logo

Comments (6)

ccrowley96 avatar ccrowley96 commented on May 17, 2024 1

Hi! Checkout the scatter plot API reference. You can use the isTemporal chartOption to change the data display from time sliced with a slider to showing all timestamps at once. The scatter plot must plot two values against one another however, with an optional parameter for radius of the points.

from tsiclient.

xxeasterxx avatar xxeasterxx commented on May 17, 2024

Is this available in v1.2.45? I have data which I just need to plot against Y-axis and X-axis being the time. Is it possible for the X-axis to be optional on this case? Is there any examples for scatter plot?

from tsiclient.

ccrowley96 avatar ccrowley96 commented on May 17, 2024

If you're looking to plot data on the Y axis vs time, I'd recommend checking out the line chart! The latest updates in scatter plot are not in NPM yet, but they'll be out soon.

from tsiclient.

darsney avatar darsney commented on May 17, 2024

Also, if you are really set on using the x axis for time, you can specify milliseconds of the time you intend to use as a value (using .valueOf()) and plot that on the x axis. If you could share an example of a chart that uses scatterplot and x axis as time that would be cool, I'm curious in the use case

Alternatively you can enable dots and hide the paths of lines using CSS in the line chart, that should give you a similar effect

from tsiclient.

xxeasterxx avatar xxeasterxx commented on May 17, 2024

If you're looking to plot data on the Y axis vs time, I'd recommend checking out the line chart! The latest updates in scatter plot are not in NPM yet, but they'll be out soon.

As the data points are quite densed, having line chart makes it look messy.
image

Also, if you are really set on using the x axis for time, you can specify milliseconds of the time you intend to use as a value (using .valueOf()) and plot that on the x axis. If you could share an example of a chart that uses scatterplot and x axis as time that would be cool, I'm curious in the use case

Alternatively you can enable dots and hide the paths of lines using CSS in the line chart, that should give you a similar effect

Above image is a use case, I've 4 values I need to plot against time. If I used line chart and change the line colors to white, and enable the dots for all 4 values, they're all black and cannot customize the color, moreover the legend color too. So I hope that the scatter plot can have out of the box, just plot X-axis as the time.

from tsiclient.

darsney avatar darsney commented on May 17, 2024

Hi, here's a minimal example in a single file that does what you are trying to achieve...I'm going to go ahead and close this issue now. Thanks for using the library!

https://codepen.io/darsney/pen/xNvbBQ

from tsiclient.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.