predixdesignsystem/px-vis-xy-chart

Customizing XY Chart

Closed this issue · 1 comments

anandmedhekar commented

Is there any way we can customize the XY chart according to the business requirement in the screenshot,

image
I have tried using this component but not able to find out a way to for following,

  1. Unable to provide string value on XAxis e.g. Jan, Feb, Mar etc. I have tried using charExtents option but not worked.
  2. Restricting tool tip to be appeared on mouse over on the line only
  3. Removing additional Y Axis column from the chart

https://codepen.io/prashantmedhekar/pen/aWyvpE?editors=1000

I tried my best to achieve above 3 points but unable to do the same. Here is codepen sample,
image

Please let me know if you need more information.

randyaskin commented
  1. Since you want to display months along the x-axis, you should be using px-vis-timeseries instead of px-vis-xy-chart. Then you'd be able to use the tickFormat property on your x-axis-config to specify the datetime format you'd like to use.
  2. No, this is not currently possible.
  3. The series-config object in your CodePen is setting the second series to appear on a second y-axis, hence why all 3 series aren't appearing together on one axis.