Chart Documentation Updates

[TheRealJon]

A few observations on how we could improve chart documentation:

https://docs.google.com/document/d/1Fjmic5rA4XFuksqwjMCb8glDlt647yyLgiadv6fE4dQ/edit?usp=sharing

@janwright73 @LHinson

[janwright73]

@dlabrecq to help review these notes and help prescribe next steps to improve the chart documentation/examples.

+1 to review the general comments - @TheRealJon - can you please help prioritize this list and start building out small examples for the top priority items?

@rachael-phillips - how/where could we put general developer information about charts on the site? My $.02 is that developers will generally go directly to specific chart types as prescribed by the design. Any general 'how to best use charts' would be good to centralize and possibly reference at the top of each chart type.

[dlabrecq]

I would like to see the following react-docs issue addressed, first. That would go a long way in helping us clarify the API documentation.
#2139

Unlike most react-core components, chart properties are complex objects with multiple, nested properties. The react-docs do fine with simple types like boolean, string, etc., but there's no way to document complex object types. We have no way to modify what react-docs outputs in that regard.

Note that we link (in text) to each Victory component at the top of the component doc, but react-docs won't allow us to add a working link. That could also be addressed with #2139.

[rachael-phillips]

@janwright73 I think we can better support documentation on the documentation pages - that's where developer information lives. Let's set up some time to look at the prioritized list @TheRealJon that can help us understand more about what we would like to take on. @dlabrecq would love to hear your thoughts on this, too!

[dlabrecq]

I would also like to create a Katacoda tutorial to show how to create a chart with a given height and width, then add padding for a legend, labels, etc. Although there is API documentation for these features, it may be most helpful to show how all the pieces work together, step by step?

[rachael-phillips]

I also wanted to add this feedback from Chris Shinn. Some of his feedback has overlap, but he also makes some other great points that hasn't been captured yet. @TheRealJon would you be interested in including any of these in your list to prioritize?

• No guidance for tooltip styling or content (esp in complicated cases)
• Brush to zoom should be standard/possible
• No empty state components or guidelines
• Axis values are not always displayed intelligently
• Default color themes don’t seem to align with the chart color work that Michael has done
• No guidance for axis lines (when/whether they should be present)

[dlabrecq]

Regarding colors, I worked with @mceledonia to adjust colors for various reasons. As a result, some mocks no longer match exactly. For example, colors were adjusted to address contrast issues with donut charts. In some cases, we added new color pallets (e.g., grey and red pallets were added for bullet chart). We also created a new color themes for ordered and unordered charts.

Brush and zoom are available, but prefer the functionality remains optional. For example, not all charts use a Voronoi container. Also, brush and zoom containers don't appear to be supported for use at the same time?

[TheRealJon]

@rachael-phillips Added those points to my doc

[rachael-phillips]

That's great @TheRealJon . How is the document coming along? Have you had time to sort these into items you find higher priority than others?

[TheRealJon]

Yes, they have been prioritized according to my own opinion.

[rachael-phillips]

Ok great, thanks @TheRealJon !

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.