CODEWITHSUNDEEP
javascriptd3.jsreactjsreact-d3
smuggledPancakes
smuggledPancakes

Reputation: 10323

Cannot figure out how to customize a D3 based plot

I am using react-d3 to make a scatter plot because the react wrapper for Plotly appears buggy. I am having a problem with d3 in that I cannot figure out the api. On the react-d3 website you can see how they made a scatter plot, and I have that working, but I cannot discover what other properties there are. For example, isn't there a way to set a hover tooltip for the points so that the x,y, and text values can be seen? What about the color of the dots for that chart?

Upvotes: 1

Views: 87

Answers (1)

Kyle
Kyle

Reputation: 3308

You can see all the properties available to you by viewing the source on github. For instance, you can see the props available to ScatterChart at https://github.com/esbullington/react-d3/blob/master/src/scatterchart/ScatterChart.jsx

Specifically, you care about this chunk:

propTypes: {
    circleRadius:     React.PropTypes.number,
    className:        React.PropTypes.string,
    hoverAnimation:   React.PropTypes.bool,
    margins:          React.PropTypes.object,
    xAxisClassName:   React.PropTypes.string,
    xAxisStrokeWidth: React.PropTypes.number,
    yAxisClassName:   React.PropTypes.string,
    yAxisStrokeWidth: React.PropTypes.number
 }

So for one of your sub questions: yes, you can control the color of the dots via the className prop.

Upvotes: 2

Related Questions