1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- var Displayable = require("./Displayable");
- var BoundingRect = require("../core/BoundingRect");
- var zrUtil = require("../core/util");
- var imageHelper = require("./helper/image");
- /**
- * @alias zrender/graphic/Image
- * @extends module:zrender/graphic/Displayable
- * @constructor
- * @param {Object} opts
- */
- function ZImage(opts) {
- Displayable.call(this, opts);
- }
- ZImage.prototype = {
- constructor: ZImage,
- type: 'image',
- brush: function (ctx, prevEl) {
- var style = this.style;
- var src = style.image; // Must bind each time
- style.bind(ctx, this, prevEl);
- var image = this._image = imageHelper.createOrUpdateImage(src, this._image, this, this.onload);
- if (!image || !imageHelper.isImageReady(image)) {
- return;
- } // 图片已经加载完成
- // if (image.nodeName.toUpperCase() == 'IMG') {
- // if (!image.complete) {
- // return;
- // }
- // }
- // Else is canvas
- var x = style.x || 0;
- var y = style.y || 0;
- var width = style.width;
- var height = style.height;
- var aspect = image.width / image.height;
- if (width == null && height != null) {
- // Keep image/height ratio
- width = height * aspect;
- } else if (height == null && width != null) {
- height = width / aspect;
- } else if (width == null && height == null) {
- width = image.width;
- height = image.height;
- } // 设置transform
- this.setTransform(ctx);
- if (style.sWidth && style.sHeight) {
- var sx = style.sx || 0;
- var sy = style.sy || 0;
- ctx.drawImage(image, sx, sy, style.sWidth, style.sHeight, x, y, width, height);
- } else if (style.sx && style.sy) {
- var sx = style.sx;
- var sy = style.sy;
- var sWidth = width - sx;
- var sHeight = height - sy;
- ctx.drawImage(image, sx, sy, sWidth, sHeight, x, y, width, height);
- } else {
- ctx.drawImage(image, x, y, width, height);
- } // Draw rect text
- if (style.text != null) {
- // Only restore transform when needs draw text.
- this.restoreTransform(ctx);
- this.drawRectText(ctx, this.getBoundingRect());
- }
- },
- getBoundingRect: function () {
- var style = this.style;
- if (!this._rect) {
- this._rect = new BoundingRect(style.x || 0, style.y || 0, style.width || 0, style.height || 0);
- }
- return this._rect;
- }
- };
- zrUtil.inherits(ZImage, Displayable);
- var _default = ZImage;
- module.exports = _default;
|