ID, $key, true); }; $gvnsql_rawtype = $gvnsql_meta('guaven_sqlcharts_graphtype'); if ($gvnsql_rawtype == '') $gvnsql_rawtype = 'pie_l'; $gvnsql_type = guaven_sqlcharts_normalize_type($gvnsql_rawtype); $gvnsql_catalog = guaven_sqlcharts_type_catalog(); if (!isset($gvnsql_catalog[$gvnsql_type])) $gvnsql_type = 'pie_l'; $gvnsql_icons = array( 'pie_l' => '', 'donut_l' => '', 'polar_l' => '', 'radar_l' => '', 'line_l' => '', 'area_l' => '', 'steppedline_l' => '', 'bar_l' => '', 'horizontalbar_l' => '', 'stackedbar_l' => '', 'scatter_l' => '', ); $gvnsql_svg_kses = array( 'svg' => array('viewbox' => array(), 'xmlns' => array()), 'path' => array('d' => array(), 'fill' => array(), 'stroke' => array(), 'stroke-width' => array(), 'stroke-linecap' => array(), 'stroke-linejoin' => array(), 'opacity' => array()), 'circle' => array('cx' => array(), 'cy' => array(), 'r' => array(), 'fill' => array(), 'stroke' => array(), 'stroke-width' => array(), 'opacity' => array()), 'rect' => array('x' => array(), 'y' => array(), 'width' => array(), 'height' => array(), 'fill' => array(), 'opacity' => array()), ); ?>
This chart used the deprecated Google Chart type "". It has been automatically mapped to the equivalent modern chart type below — just press Update to finish the migration. Nothing else changes.

Pick a chart type

$info) { ?>
$info) { ?>
>
chart — when to use it:

Build your SQL query

Tip: press Ctrl+Space for suggestions at any point. Separate multiple queries with ; to build comparison charts. Supported dynamic tags: {current_user_id}, {current_user_login}, {current_user_email}, {current_user_display_name} — plus every filter you define in the Input Filters tab.

Final step Map query columns to the chart

Tell the chart which query column goes to which axis. The dropdowns are filled with the columns found in your SQL query above.

The column whose values become the labels/X positions.
The numeric column that becomes the chart values. Use one output name even with multiple queries.
Shown as the X axis title on Bar, Line and Scatter charts, and as the first table-view header.
Shown in the legend and as the Y axis title. With multiple queries, separate one name per query with ";" (then only the legend is used).

Input filters — no code needed

Each filter becomes an input field above your chart at the front-end, and a {tag} placed inside the SQL query. The tag dropdown suggests {tags} already written in your query and columns from its WHERE part. Example: pick or type fromdate with type date, click "Insert into query" and complete the condition, e.g. WHERE post_date > {fromdate}.

Raw format: name~default~label~type | name~default~label~type (type: text, number or date)

Colors

One color per data series (or per slice for circular charts). Leave empty to use the built-in palette.

The legend lists your series names (Y label field).
Leave empty for full container width (responsive).
Leave empty to keep the natural aspect ratio.

Axis behavior (Line and Bar charts)

Date/time scaling places each point by real elapsed time instead of equal steps. X values must be dates such as 2024-02-23, 2024-02, 2024 or 2024-02-23 14:30. If any X value is not a date, the normal axis is used. Bars are sized from the closest pair of dates, so very uneven gaps produce thin bars.

Remote MySQL database (optional)

Leave all fields empty to use this WordPress site's own database.

Stored encrypted. WordPress supports MySQL databases; for other engines contact us.

Text shortcode: [gvn_schart id="ID); ?>"]

PHP shortcode: <?php echo do_shortcode(' [gvn_schart id="ID); ?>"]'); ?>

Note: Shortcodes support width and height attributes, f.e. [gvn_schart id="1" width="500" height="400"]. Without attributes, the width/height from the Style tab is used. ID), $gvnsql_argtags); $gvnsql_argtags = array_unique($gvnsql_argtags[1]); sort($gvnsql_argtags); if (!empty($gvnsql_argtags)) { $gvnsql_argexample = ''; foreach ($gvnsql_argtags as $gvnsql_argn) $gvnsql_argexample .= ' arg' . (int) $gvnsql_argn . '="..."'; ?>

This query uses shortcode arguments. Pass the values in the shortcode: [gvn_schart id="ID); ?>"]. The live preview below runs without them (every {arg} is 0), so check the real result on a page or post.


Live Preview (reflects the last saved state — press Update to refresh)

ID) . '" ' . ($gvnsql_meta('guaven_sqlcharts_tablepart') !== '' ? ' table="1"' : '') . ']'); } ?>