0CodeKit icon

0CodeKit

A toolbox of no-code utilities

Actions132

Chart → Line Chart

AI-generated

Overview

The node provides a utility to generate line charts based on user-supplied data points and labels. It is useful for visualizing trends over time or any sequential data, such as sales figures by month, website traffic by day, or temperature changes over a week. Users can customize the chart's appearance including colors, border width, fill options, tension of the line curve, and output format (image or URL).

Practical examples:

  • Visualizing monthly sales data with labeled months.
  • Displaying daily website visits with custom line colors.
  • Creating a curved line chart showing temperature variations.

Properties

Name Meaning
Data Points Array of numeric values representing the data points to plot on the line chart.
Labels Array of strings labeling each data point on the x-axis.
Chart Title Optional title text displayed on the chart.
Background Color Hex color code defining the background color of the chart image.
Line Colors Array of hex color codes specifying the colors of the lines in the chart.
Border Colors Array of hex color codes for the borders around the lines.
Border Width Numeric value setting the thickness of the line borders.
Fill Under Line Boolean indicating whether to fill the area under the line with color.
Line Tension Numeric value between 0 and 1 controlling the curvature of the line (0 = straight, 1 = curved).
Return as URL Boolean indicating if the output should be a URL pointing to the chart image instead of the image itself.
File Name Optional string specifying the filename for the generated chart image.
Width Numeric value defining the width of the chart image in pixels.
Height Numeric value defining the height of the chart image in pixels.

Output

The node outputs JSON data containing the generated line chart. Depending on the "Return as URL" property, the output will either include:

  • The chart image data (likely as a base64-encoded string or binary data).
  • Or a URL pointing to the hosted chart image.

If the image is returned directly, it can be used downstream for further processing or saving. If a URL is returned, it can be used to embed or share the chart easily.

Dependencies

  • Requires an API key credential for authentication with the external 0CodeKit service.
  • The node sends a POST request to the endpoint /generate/chart/line on the 0CodeKit API to generate the chart.
  • No additional environment variables are explicitly required beyond the API key credential.

Troubleshooting

  • Invalid JSON input for Data Points or Labels: Ensure that the arrays provided for data and labels are valid JSON arrays and that their lengths match.
  • API Authentication errors: Verify that the API key credential is correctly configured and has necessary permissions.
  • Chart generation failures: Check that numeric properties like width, height, borderWidth, and tension are within acceptable ranges.
  • Empty or missing data: The node requires at least one data point and corresponding label; otherwise, the chart cannot be generated.
  • Color format issues: Colors must be valid hex codes; invalid color strings may cause rendering errors.

Links and References

Discussion