%PDF- %PDF-
Direktori : /home/opti/workflow/src/public/app-assets/vendors/js/charts/echarts/zrender/graphic/ |
Current File : /home/opti/workflow/src/public/app-assets/vendors/js/charts/echarts/zrender/graphic/Image.js |
/** * Image element * @module zrender/graphic/Image */ define(function (require) { var Displayable = require('./Displayable'); var BoundingRect = require('../core/BoundingRect'); var zrUtil = require('../core/util'); var roundRectHelper = require('./helper/roundRect'); var LRU = require('../core/LRU'); var globalImageCache = new LRU(50); /** * @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) { var style = this.style; var src = style.image; var image; // style.image is a url string if (typeof src === 'string') { image = this._image; } // style.image is an HTMLImageElement or HTMLCanvasElement or Canvas else { image = src; } // FIXME Case create many images with src if (!image && src) { // Try get from global image cache var cachedImgObj = globalImageCache.get(src); if (!cachedImgObj) { // Create a new image image = new Image(); image.onload = function () { image.onload = null; for (var i = 0; i < cachedImgObj.pending.length; i++) { cachedImgObj.pending[i].dirty(); } }; cachedImgObj = { image: image, pending: [this] }; image.src = src; globalImageCache.put(src, cachedImgObj); this._image = image; return; } else { image = cachedImgObj.image; this._image = image; // Image is not complete finish, add to pending list if (!image.width || !image.height) { cachedImgObj.pending.push(this); return; } } } if (image) { // 图片已经加载完成 // if (image.nodeName.toUpperCase() == 'IMG') { // if (!image.complete) { // return; // } // } // Else is canvas var width = style.width || image.width; var height = style.height || image.height; var x = style.x || 0; var y = style.y || 0; // 图片加载失败 if (!image.width || !image.height) { return; } ctx.save(); style.bind(ctx); // 设置transform this.setTransform(ctx); if (style.r) { // Border radius clipping // FIXME ctx.beginPath(); roundRectHelper.buildPath(ctx, style); ctx.clip(); } 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); } // 如果没设置宽和高的话自动根据图片宽高设置 if (style.width == null) { style.width = width; } if (style.height == null) { style.height = height; } // Draw rect text if (style.text != null) { this.drawRectText(ctx, this.getBoundingRect()); } ctx.restore(); } }, 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); return ZImage; });