zrender.js 介绍
ZZrender是 一个 二维绘图引擎,它提供了Canvas,SVG,VML等多种渲染方式,Zrender也是Echarts的渲染器。
zrender.js 使用
HTML代码 ?
<script src=" dis t/ zrender.js "></script>
?
初始化zrender对象:
var main = document.getElementById('main');
// 初始化zrender
var zr = zrender.init(main);
?
一个 简单的例子, 显示 一个 圆:
var zr = zrender.init(document.getElementById('main'));
var circle = new zrender.Circle({
shape: {
cx: 150,
cy: 300,
r: 40
},
style: {
fill: 'none',
stroke : '#F00'
}
});
zr.add(circle);
?我们还可以动态的改变圆的大小:
window.onload = function(){
var zr = zrender.init(document.getElementById('main'));
var circle = new zrender.Circle({
shape: {
cx: 150,
stroke : '#F00'
}
});
zr.add(circle);
document.getElementById("changeBtn").onclick = function(){
circle.attr('shape',{
r:parseFloat(document.getElementById("r_input").value)
});
}
}
GitHub: https://github.com/ecomfe/zrender
网站描述: 一个 轻量级的画布库,可为ECharts提供2D绘制
zrender.js官方网站
官方网站:
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。