Admin UI Javascript hooks - methnen/m-chart GitHub Wiki

Available in M Chart v.2.0+

The M Chart admin interface uses the WordPress wp.hooks API (@wordpress/hooks) for JavaScript integration points. These allow library plugins and third-party code to extend the admin UI.

Filter Hooks

m_chart.render_chart

Filters the chart renderer used in the admin preview. A library plugin can hook into this to render its own chart (e.g. Highcharts) instead of the default Chart.js renderer.

Return a chart instance from your handler to take over rendering, or return false to fall through to the default renderer.

  • Arguments
    • instancefalse by default; return your chart instance to claim rendering
    • canvas — the HTML canvas element
    • chartArgs — the full chart configuration object
    • onComplete — callback to invoke when rendering is complete
    • existingInstance — previous chart instance if re-rendering

m_chart.settings_component

Filters the React component used to render the chart settings panel in the admin. A library plugin can replace the entire settings UI with its own component.

  • Arguments
    • DefaultSettings — the default React settings component

m_chart.multi_sheet_types

Filters the list of chart types that support multiple data sheets.

  • Arguments
    • types — default: ['scatter', 'bubble', 'radar', 'radar-area']

Action Hooks

m_chart.render_done

Fires in the admin after a chart has finished rendering in the preview panel.

  • Arguments
    • postId — the WordPress post ID
    • instance — the chart instance number
    • chartInstance — the chart library instance object

m_chart.chart_args_success

Fires in the admin after an AJAX request has successfully returned updated chart args.

  • Arguments
    • data — the chart args data returned from the server
    • postId — the WordPress post ID

See Highcharts Javascript Events for Highcharts-specific admin JavaScript integration.