我正在尝试使用 Easel.js 在画布中创建一个可调整大小的数据库图标。我想出了如何创建基础圆柱体,但无法弄清楚堆栈的曲线。数据库图标应如下面的链接所示:
http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/256/Data-Database-icon.png
我已经开始在下面的 JSFiddle 上创建图标:http: //jsfiddle.net/rsperlaza/u6Uaq/
var stage = new createjs.Stage($("#test")[0]);
stage.enableMouseOver(50);
stage.canvas.width = 500;
stage.canvas.height = 500;
var shape = new createjs.Shape();
var g = shape.graphics;
var x = 50;
var y = 100;
var width = 100;
var height = 120;
g.beginStroke("red");
g.beginFill("black");
g.drawEllipse(x, y, width, height / 4);
g.moveTo(x, y + height / 8);
g.lineTo(x, y + 7 * height / 8);
g.moveTo(x, y + height / 8);
g.lineTo(x, y + 7 * height / 8);
g.drawEllipse(x, y + 3 * height / 4, width, height / 4);
g.endStroke();
g.drawRect(x, y + height / 8, width, 3 * height / 4);
stage.addChild(shape);
stage.update();