dianping/cat · critical · Error

Please load either the SVG- or the CanvasRenderer

Error message

Please load either the SVG- or the CanvasRenderer

What it means

easypiechart ships its renderers as separate files: CanvasRenderer and/or SVGRenderer. At plugin load time it detects which renderer global exists and stores it in defaultOptions.renderer; if neither is present it throws immediately, because the chart cannot draw anything. Unlike the other errors here, this throw happens when the easypiechart script itself is evaluated, not at chart creation.

Source

Thrown at cat-home/src/main/webapp/assets/js/uncompressed/jquery.easypiechart.js:251

		},
		onStart: function(from, to) {
			return;
		},
		onStep: function(from, to, currentValue) {
			return;
		},
		onStop: function(from, to) {
			return;
		}
	};

	// detect present renderer
	if (typeof(CanvasRenderer) !== 'undefined') {
		defaultOptions.renderer = CanvasRenderer;
	} else if (typeof(SVGRenderer) !== 'undefined') {
		defaultOptions.renderer = SVGRenderer;
	} else {
		throw new Error('Please load either the SVG- or the CanvasRenderer');
	}

	var options = {};
	var currentValue = 0;

	/**
	 * Initialize the plugin by creating the options object and initialize rendering
	 */
	var init = function() {
		this.el = el;
		this.options = options;

		// merge user options into default options
		for (var i in defaultOptions) {
			if (defaultOptions.hasOwnProperty(i)) {
				options[i] = opts && typeof(opts[i]) !== 'undefined' ? opts[i] : defaultOptions[i];
				if (typeof(options[i]) === 'function') {
					options[i] = options[i].bind(this);

View on GitHub (pinned to e815e74d4c)

Solutions

1. Include the renderer file(s) shipped with easypiechart BEFORE jquery.easypiechart.js (typically easypiechart.js bundles CanvasRenderer — use the official distribution file).
2. Verify with a bundler/host page that the renderer global is defined before the plugin evaluates.
3. Check the Network tab for 404s on the renderer file.

Example fix

// before
<script src="jquery.easypiechart.js"></script> <!-- renderer file missing -->

// after
<script src="jquery.easypiechart.js"></script> <!-- official build includes CanvasRenderer -->
<!-- or: -->
<script src="easypiechart-renderers.js"></script>
<script src="jquery.easypiechart.js"></script>

if (typeof window.CanvasRenderer === 'undefined' && typeof window.SVGRenderer === 'undefined') {
  console.error('easypiechart renderer missing: load the distribution file that bundles CanvasRenderer before jquery.easypiechart.js');
}

function easyPieChartReady() {
  return typeof window.jQuery === 'function' &&
    (typeof window.CanvasRenderer !== 'undefined' || typeof window.SVGRenderer !== 'undefined') &&
    typeof $.fn.easyPieChart === 'function';
}

When it happens

Trigger: Loading jquery.easypiechart.js without the renderer file(s); loading the renderer after the chart script (detection already failed); a custom build that omits the renderer; renderer file 404.

Common situations: Minimal includes copied from a blog example that assumed a combined bundle; asset concatenation ordering issues in combined JS files.

Related errors

• momentjs is required
• Bootstrap's JavaScript requires jQuery
• Popover requires tooltip.js
• Time mode requires the flot.time plugin.
• Invalid date format.

AI-assisted analysis of dianping/cat@e815e74d4c (2026-08-14). Data as JSON: /api/errors/b9a0d3ffd85d4f72. Report an issue: GitHub.