首页 > 代码库 > easy-pie-chart和excanvas的兼容性问题

easy-pie-chart和excanvas的兼容性问题

2024-07-28 04:36:23   221人阅读

之前多次调节IE的canvas兼容性，总结如下： 



<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8"/>
	<title>jQuery</title>
	<meta name="viewport" content="width=device-width"/>
	<link rel="stylesheet" href="http://www.mamicode.com/style.css"/>
	<script src="http://www.mamicode.com/excanvas.compiled.js"></script>
	<script>
	// IE function.bind polyfill
	if (!Function.prototype.bind) {
		Function.prototype.bind = function (oThis) {
			if (typeof this !== "function") {
				// closest thing possible to the ECMAScript 5 internal IsCallable function
				throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
			}

			var aArgs = Array.prototype.slice.call(arguments, 1),
				fToBind = this,
				fNOP = function () {},
				fBound = function () {
					return fToBind.apply(this instanceof fNOP && oThis ? this : oThis,
				aArgs.concat(Array.prototype.slice.call(arguments)));
			};

			fNOP.prototype = this.prototype;
			fBound.prototype = new fNOP();

			return fBound;
		};
	}
	</script>
</head>
<body>

	<ul>
		<li><a href="http://www.mamicode.com/index.html">Vanilla JS</a></li>
		<li><a href="http://www.mamicode.com/jquery.html">jQuery plugin</a></li>
		<li><a href="http://www.mamicode.com/angular.html">Angular module</a></li>
	</ul>

	<p>Demo for old Internet Explorer Versions 7 and 8 with <a href="http://excanvas.sourceforge.net" target="_blank">excanvas</a> and a Function.bind polyfill.</p>

	<span class="chart" data-percent="86">
		<span class="percent"></span>
	</span>

	<span class="btn js_update">Update chart</span>

	<script src="http://www.91liren.com:80/js/jquery.min.js"></script>
	<script src="http://www.mamicode.com/dist/jquery.easypiechart.min.js"></script>
	<script>
	$(function() {
		var $chart = $(‘.chart‘);
		$chart.easyPieChart({
			onStep: function(from, to, percent) {
				$(this.el).find(‘.percent‘).text(Math.round(percent));
			}
		});
		var chart = window.chart = $chart.data(‘easyPieChart‘);
		chart.update($chart.data(‘percent‘));
		$(‘.js_update‘).on(‘click‘, function() {
			chart.update(Math.random()*200-100);
		});
	});
	</script>
</body>
</html>



前一段中的《script》是对IE对bind（）的扩展，很重要。

easy-pie-chart和excanvas的兼容性问题


联系
我们