XY Chart

​

What is an XY Chart?

• Bar Chart: Displays data as rectangular bars.
• Line Chart: Connects data points with a line.

​

Creating Your First XY Chart

​

Steps:

1. Launch DinoAI: From Code IDE, access DinoAI to start creating diagrams.
2. Use a Simple Prompt: Tell DinoAI what kind of XY Chart you want to create. For example:

- "Create an Mermaid XY chart showing data pipeline performance trends over time"

- "Generate an Mermaid XY chart for data quality metrics with monthly comparisons"

- "Build an Mermaid XY chart showing data volume growth across different sources"

3. Get Your Diagram: DinoAI will generate a complete .mmd file with proper Mermaid syntax.
4. Preview Your Work: Click the eye icon (👁️) to preview your diagram in real-time as you edit.
5. Iterate and Refine: Modify the generated .mmd file directly, or ask DinoAI to make specific changes.

​

Example:

​

Syntax Guide

​

Title

​

X-Axis

• Categorical: [cat1, cat2, ...]
• Numerical: "title" min --> max

​

Y-Axis

• "title" min --> max

​

Chart Types

• Bar Chart: Use bar [data values].
• Line Chart: Use line [data values].

​

Example:

​

Advanced Features

​

Orientation

​

Configuration Options

​

Theming

​

Practical Example: Monthly Sales Revenue

​

Best Practices

1. Use descriptive titles for clarity.
2. Ensure axis ranges accommodate your data.
3. Choose appropriate chart types for data representation.
4. Use themes to make charts visually appealing.