| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641 |
- (global["webpackJsonp"] = global["webpackJsonp"] || []).push([["pages_basics/common/vendor"],{
- /***/ 957:
- /*!**************************************************************************************!*\
- !*** E:/git/2021项目/v3-H5/pages_basics/component/cropper.js?vue&type=script&lang=js& ***!
- \**************************************************************************************/
- /*! no static exports found */
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
- "use strict";
- __webpack_require__.r(__webpack_exports__);
- /* harmony import */ var _D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./cropper.js?vue&type=script&lang=js& */ 958);
- /* harmony import */ var _D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);
- /* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
- /* harmony default export */ __webpack_exports__["default"] = (_D_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_D_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_cropper_js_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a);
- /***/ }),
- /***/ 958:
- /*!*****************************************************************************************************************************************************************************************************************************************************************************!*\
- !*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!E:/git/2021项目/v3-H5/pages_basics/component/cropper.js?vue&type=script&lang=js& ***!
- \*****************************************************************************************************************************************************************************************************************************************************************************/
- /*! no static exports found */
- /***/ (function(module, exports, __webpack_require__) {
- "use strict";
- /* WEBPACK VAR INJECTION */(function(uni) {
- var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = void 0;
- var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ 50));
- var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ 52));
- var ABS = Math.abs;
- var calcLen = function calcLen(v) {
- // distance between two coordinate
- return Math.sqrt(v.x * v.x + v.y * v.y);
- };
- var calcAngle = function calcAngle(a, b) {
- // angle of the two vectors
- var l = calcLen(a) * calcLen(b);
- var cosValue;
- var angle;
- if (l) {
- cosValue = (a.x * b.x + a.y * b.y) / l;
- angle = Math.acos(Math.min(cosValue, 1));
- angle = a.x * b.y - b.x * a.y > 0 ? -angle : angle;
- return angle * 180 / Math.PI;
- }
- return 0;
- };
- var generateCanvasId = function generateCanvasId() {
- // generate a random string
- var seeds = 'abcdefghijklmnopqrstuvwxyz';
- var arr = seeds.split('').concat(seeds.toUpperCase().split('')).concat('0123456789'.split(''));
- var m = arr.length;
- var i;
- while (m) {
- i = Math.floor(Math.random() * m--);
- var temp = arr[m];
- arr[m] = arr[i];
- arr[i] = temp;
- }
- return arr.slice(0, 16).join('');
- };
- var _default2 = {
- props: {
- width: {
- // width of the container
- type: [String, Number],
- default: '100%'
- },
- height: {
- // height of the container
- type: [String, Number],
- default: '100%'
- },
- cutWidth: {
- // cutter width
- type: [String, Number],
- default: '50%'
- },
- cutHeight: {
- // cutter height
- type: [String, Number],
- default: 0
- },
- minWidth: {
- // minWidth of the cutter
- type: Number,
- default: 50
- },
- minHeight: {
- // minHeight of the cutter
- type: Number,
- default: 50
- },
- center: {
- // autoCenter
- type: Boolean,
- default: true
- },
- src: String,
- disableScale: Boolean,
- // disable to zoom
- disableRotate: Boolean,
- disableTranslate: Boolean,
- disableCtrl: Boolean,
- // disable to resize the cutter
- boundDetect: Boolean,
- // open boundary detection
- freeBoundDetect: Boolean,
- // open boundary detection while doing rotation
- keepRatio: Boolean,
- // keep the ratio of the cutter
- disablePreview: Boolean,
- // disable preview after cutting
- showCtrlBorder: Boolean,
- // show cutter border
- resetCut: Boolean,
- // reset cut while img change
- fit: {
- type: Boolean,
- default: true
- },
- imageCenter: Boolean,
- // auto center/middle for image
- maxZoom: {
- // maximum scaling factor
- type: Number,
- default: 10 // can not be Infinity in baidu-MiniProgram
- },
- minZoom: {
- // minimum scaling factor
- type: Number,
- default: 1
- },
- angle: {
- // initial angle of rotation
- type: Number,
- default: 0
- },
- zoom: {
- // initial scaling factor
- type: Number,
- default: 1
- },
- offset: {
- // initial offset relative to the cutter left border
- type: Array,
- default: function _default() {
- return [0, 0];
- }
- },
- background: {
- type: String,
- default: '#000'
- },
- canvasBackground: {
- // background for the exported image
- type: String,
- default: '#fff'
- },
- canvasZoom: {
- // export multiples of the cutter size
- type: Number,
- default: 1
- },
- fileType: {
- type: String,
- default: 'png',
- validator: function validator(t) {
- return ['png', 'jpg'].includes(t);
- }
- },
- quality: {
- type: Number,
- default: 1
- },
- maskType: {
- // type for mask
- type: String,
- default: "shadow"
- },
- circleView: Boolean // circle clip view
- },
- data: function data() {
- return {
- transform: {
- angle: 0,
- translate: {
- x: 0,
- y: 0
- },
- zoom: 1
- },
- corner: {
- left: 50,
- right: 50,
- bottom: 50,
- top: 50
- },
- image: {
- originWidth: 0,
- originHeight: 0,
- width: 0,
- height: 0
- },
- ctrlWidth: 0,
- ctrlHeight: 0,
- view: false,
- canvasId: ''
- };
- },
- computed: {
- transformMeta: function transformMeta() {
- var transform = this.transform;
- return "translate3d(".concat(transform.translate.x, "px, ").concat(transform.translate.y, "px, 0) rotate(").concat(transform.angle, "deg) scale(").concat(transform.zoom, ")");
- },
- ctrlStyle: function ctrlStyle() {
- var corner = this.corner;
- var cssStr = "left: ".concat(corner.left, "px;top: ").concat(corner.top, "px;right: ").concat(corner.right, "px;bottom: ").concat(corner.bottom, "px;");
- if (this.maskType !== 'outline') {
- cssStr += "box-shadow: 0 0 0 50000rpx rgba(0,0,0, ".concat(this.view ? 0.8 : 0.4, ")");
- } else {
- cssStr += "outline: rgba(0,0,0, ".concat(this.view ? 0.8 : 0.4, ") solid 5000px");
- }
- return cssStr;
- }
- },
- watch: {
- src: function src() {
- if (this.resetCut) this.resetCutReact();
- this.initImage();
- }
- },
- created: function created() {
- var _this = this;
- this.canvasId = generateCanvasId();
- uni.getSystemInfo().then(function (result) {
- result = result[1] || {
- windowWidth: 375,
- windowHeight: 736
- };
- _this.ratio = result.windowWidth / 750;
- _this.windowHeight = result.windowHeight;
- _this.init();
- _this.initCanvas();
- });
- },
- methods: {
- toPx: function toPx(str) {
- if (str.indexOf('%') !== -1) {
- return Math.floor(Number(str.replace('%', '')) / 100 * this.containerWidth);
- }
- if (str.indexOf('rpx') !== -1) {
- return Math.floor(Number(str.replace('rpx', '')) * this.ratio);
- }
- return Math.floor(Number(str.replace('px', '')));
- },
- initCanvas: function initCanvas() {
- var _this2 = this;
- var context = uni.createSelectorQuery().in(this);
- // get contianer size
- context.select('.nice-cropper').boundingClientRect();
- context.exec(function (res) {
- _this2.containerWidth = res[0].width;
- _this2.containerHeight = res[0].height;
- _this2.initCut();
- });
- },
- resetCutReact: function resetCutReact() {
- // init size and position of the cutter
- this.ctrlWidth = Math.min(this.toPx(this.cutWidth), this.containerWidth);
- if (this.cutHeight) {
- this.ctrlHeight = Math.min(this.toPx(this.cutHeight), this.containerHeight);
- } else {
- // 默认为正方形
- this.ctrlHeight = Math.min(this.ctrlWidth, this.containerHeight);
- }
- var cornerStartX = this.center ? Math.floor((this.containerWidth - this.ctrlWidth) / 2) : 0;
- var cornerStartY = this.center ? Math.floor((this.containerHeight - this.ctrlHeight) / 2) : 0;
- this.cutRatio = this.ctrlHeight / this.ctrlWidth;
- this.corner = {
- left: cornerStartX,
- right: this.containerWidth - this.ctrlWidth - cornerStartX,
- top: cornerStartY,
- bottom: this.containerHeight - this.ctrlHeight - cornerStartY
- };
- },
- initCut: function initCut() {
- this.resetCutReact();
- this.initImage();
- },
- initImage: function initImage() {
- var _this3 = this;
- return (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
- var res, offset;
- return _regenerator.default.wrap(function _callee$(_context) {
- while (1) {
- switch (_context.prev = _context.next) {
- case 0:
- if (_this3.src) {
- _context.next = 2;
- break;
- }
- return _context.abrupt("return");
- case 2:
- _context.prev = 2;
- _context.next = 5;
- return uni.getImageInfo({
- src: _this3.src
- });
- case 5:
- res = _context.sent;
- _this3.$emit('load', res);
- _this3.image.originWidth = res.width;
- _this3.image.originHeight = res.height;
- _this3.image.width = _this3.fit ? _this3.ctrlWidth : res.width;
- _this3.image.height = res.height / res.width * _this3.image.width;
- _this3.img = res.path;
- _context.next = 23;
- break;
- case 14:
- _context.prev = 14;
- _context.t0 = _context["catch"](2);
- console.error("图片信息获取失败:", _context.t0);
- _this3.$emit("error", _context.t0);
- // 使用控件尺寸作为默认值
- _this3.image.originWidth = _this3.ctrlWidth;
- _this3.image.originHeight = _this3.ctrlHeight;
- _this3.image.width = _this3.ctrlWidth;
- _this3.image.height = _this3.ctrlHeight;
- _this3.img = null;
- case 23:
- offset = [0, 0];
- if (_this3.imageCenter) {
- offset[0] = (_this3.ctrlWidth - _this3.image.width) / 2;
- offset[1] = (_this3.ctrlHeight - _this3.image.height) / 2;
- }
- if (Array.isArray(_this3.offset)) {
- offset[0] += _this3.offset[0] || 0;
- offset[1] += _this3.offset[1] || 0;
- }
- _this3.setTranslate(offset);
- _this3.setZoom(_this3.zoom);
- _this3.transform.angle = _this3.freeBoundDetect || !_this3.disableRotate ? _this3.angle : 0;
- _this3.setBoundary();
- _this3.preview();
- _this3.draw();
- case 32:
- case "end":
- return _context.stop();
- }
- }
- }, _callee, null, [[2, 14]]);
- }))();
- },
- init: function init() {
- this.pretouch = {};
- this.handles = {};
- this.preVector = {
- x: 0,
- y: 0
- };
- this.distance = 30;
- this.touch = {};
- this.movetouch = {};
- this.cutMode = false;
- this.params = {
- zoom: 1,
- deltaX: 0,
- deltaY: 0,
- diffX: 0,
- diffY: 0,
- angle: 0
- };
- },
- start: function start(e) {
- if (!this.src) e.preventDefault();
- var point = e.touches ? e.touches[0] : e;
- var touch = this.touch;
- var now = Date.now();
- touch.startX = point.pageX;
- touch.startY = point.pageY;
- touch.startTime = now;
- this.doubleTap = false;
- this.view = false;
- clearTimeout(this.previewTimer);
- if (e.touches.length > 1) {
- var point2 = e.touches[1];
- this.preVector = {
- x: point2.pageX - this.touch.startX,
- y: point2.pageY - this.touch.startY
- };
- this.startDistance = calcLen(this.preVector);
- } else {
- var pretouch = this.pretouch;
- this.doubleTap = this.pretouch.time && now - this.pretouch.time < 300 && ABS(touch.startX - pretouch.startX) < 30 && ABS(touch.startY - pretouch.startY) < 30 && ABS(touch.startTime - pretouch.time) < 300;
- pretouch = {
- // reserve the last touch
- startX: this.touch.startX,
- startY: this.touch.startY,
- time: this.touch.startTime
- };
- }
- },
- move: function move(e) {
- if (!this.src) return;
- var point = e.touches ? e.touches[0] : e;
- if (e.touches.length > 1) {
- // multi touch
- var point2 = e.touches[1];
- var v = {
- x: point2.pageX - point.pageX,
- y: point2.pageY - point.pageY
- };
- if (this.preVector.x !== null) {
- if (this.startDistance) {
- // zoom
- var len = calcLen(v);
- this.params.zoom = calcLen(v) / this.startDistance;
- this.startDistance = len;
- this.cutMode && !this.disableCtrl ? this.setCut() : !this.disableScale && this.pinch();
- }
- // rotate
- this.params.angle = calcAngle(v, this.preVector);
- this.cutMode && !this.disableCtrl ? this.setCut() : !this.disableRotate && this.rotate();
- }
- this.preVector.x = v.x;
- this.preVector.y = v.y;
- } else {
- // translate
- var diffX = point.pageX - this.touch.startX;
- var diffY = point.pageY - this.touch.startY;
- this.params.diffY = diffY;
- this.params.diffX = diffX;
- if (this.movetouch.x) {
- this.params.deltaX = point.pageX - this.movetouch.x;
- this.params.deltaY = point.pageY - this.movetouch.y;
- } else {
- this.params.deltaX = this.params.deltaY = 0;
- }
- if (ABS(diffX) > 30 || ABS(diffY) > 30) {
- this.doubleTap = false;
- }
- this.cutMode && !this.disableCtrl ? this.setCut() : !this.disableTranslate && this.translate();
- this.movetouch.x = point.pageX;
- this.movetouch.y = point.pageY;
- }
- !this.cutMode && this.setBoundary();
- if (e.touches.length > 1) {
- e.preventDefault();
- }
- },
- end: function end() {
- this.doubleTap && this.$emit('doubleTap');
- this.cutMode && this.setBoundary();
- this.init();
- !this.disablePreview && this.preview();
- this.draw();
- },
- translate: function translate() {
- var transform = this.transform.translate;
- var meta = this.params;
- transform.x += meta.deltaX;
- transform.y += meta.deltaY;
- },
- pinch: function pinch() {
- this.transform.zoom *= this.params.zoom;
- },
- rotate: function rotate() {
- this.transform.angle += this.params.angle;
- },
- setZoom: function setZoom(scale) {
- scale = Math.min(Math.max(Number(scale) || 1, this.minZoom), this.maxZoom);
- this.transform.zoom = scale;
- },
- setTranslate: function setTranslate(offset) {
- if (Array.isArray(offset)) {
- var x = Number(offset[0]);
- var y = Number(offset[1]);
- this.transform.translate.x = isNaN(x) ? this.transform.translate.x : this.corner.left + x;
- this.transform.translate.y = isNaN(y) ? this.transform.translate.y : this.corner.top + y;
- }
- },
- setRotate: function setRotate(angle) {
- this.transform.angle = Number(angle) || 0;
- },
- setTransform: function setTransform(x, y, angle, scale) {
- this.setTranslate([x, y]);
- this.setZoom(scale);
- this.setRotate(angle);
- },
- setCutMode: function setCutMode(type) {
- if (!this.src) return;
- this.cutMode = true;
- this.cutDirection = type;
- },
- setCut: function setCut() {
- var corner = this.corner;
- var meta = this.params;
- this.setMeta(this.cutDirection, meta); // correct cutter position
- if (this.keepRatio) {
- if (this.cutDirection === 'lt' || this.cutDirection === 'rb') {
- meta.deltaY = meta.deltaX * this.cutRatio;
- } else {
- meta.deltaX = meta.deltaY / this.cutRatio;
- }
- }
- switch (this.cutDirection) {
- case 'lt':
- corner.top += meta.deltaY;
- corner.left += meta.deltaX;
- break;
- case 'rt':
- corner.top += meta.deltaY;
- corner.right -= this.keepRatio ? -meta.deltaX : meta.deltaX;
- break;
- case 'rb':
- corner.right -= meta.deltaX;
- corner.bottom -= meta.deltaY;
- break;
- case 'lb':
- corner.bottom -= meta.deltaY;
- corner.left += this.keepRatio ? -meta.deltaX : meta.deltaX;
- break;
- }
- this.ctrlWidth = this.containerWidth - corner.left - corner.right;
- this.ctrlHeight = this.containerHeight - corner.top - corner.bottom;
- },
- setMeta: function setMeta(direction, meta) {
- var ctrlWidth = this.ctrlWidth,
- ctrlHeight = this.ctrlHeight,
- minWidth = this.minWidth,
- minHeight = this.minHeight;
- switch (direction) {
- case 'lt':
- if (meta.deltaX > 0 || meta.deltaY > 0) {
- meta.deltaX = Math.min(meta.deltaX, ctrlWidth - minWidth);
- meta.deltaY = Math.min(meta.deltaY, ctrlHeight - minHeight);
- }
- break;
- case 'rt':
- if (meta.deltaX < 0 || meta.deltaY > 0) {
- meta.deltaX = Math.max(meta.deltaX, minWidth - ctrlWidth);
- meta.deltaY = Math.min(meta.deltaY, ctrlHeight - minHeight);
- }
- break;
- case 'rb':
- if (meta.deltaX < 0 || meta.deltaY < 0) {
- meta.deltaX = Math.max(meta.deltaX, minWidth - ctrlWidth);
- meta.deltaY = Math.max(meta.deltaY, minHeight - ctrlHeight);
- }
- break;
- case 'lb':
- if (meta.deltaX > 0 || meta.deltaY < 0) {
- meta.deltaX = Math.min(meta.deltaX, ctrlWidth - minWidth);
- meta.deltaY = Math.max(meta.deltaY, minHeight - ctrlHeight);
- }
- break;
- }
- },
- setBoundary: function setBoundary() {
- var zoom = this.transform.zoom;
- zoom = zoom < this.minZoom ? this.minZoom : zoom > this.maxZoom ? this.maxZoom : zoom;
- this.transform.zoom = zoom;
- if (!this.boundDetect || !this.disableRotate && !this.freeBoundDetect) return true;
- var translate = this.transform.translate;
- var corner = this.corner;
- var minX = corner.left - this.image.width + this.ctrlWidth - this.image.width * (zoom - 1) / 2;
- var maxX = corner.left + this.image.width * (zoom - 1) / 2;
- var minY = corner.top - this.image.height + this.ctrlHeight - this.image.height * (zoom - 1) / 2;
- var maxY = corner.top + this.image.height * (zoom - 1) / 2;
- translate.x = Math.floor(translate.x < minX ? minX : translate.x > maxX ? maxX : translate.x);
- translate.y = Math.floor(translate.y < minY ? minY : translate.y > maxY ? maxY : translate.y);
- },
- preview: function preview() {
- var _this4 = this;
- clearTimeout(this.previewTimer);
- this.previewTimer = setTimeout(function () {
- _this4.view = true;
- }, 500);
- },
- draw: function draw() {
- var _this5 = this;
- var context = uni.createCanvasContext(this.canvasId, this);
- var transform = this.transform;
- var corner = this.corner;
- var canvasZoom = this.canvasZoom;
- var img = this.image;
- context.save();
- context.setFillStyle(this.canvasBackground);
- this.$emit('beforeDraw', context, transform); // beforeDraw hook
- var zoom = transform.zoom;
- context.fillRect(0, 0, this.ctrlWidth * canvasZoom, this.ctrlHeight * canvasZoom); // clear canvas
- context.translate((transform.translate.x - corner.left + img.width / 2) * canvasZoom, (transform.translate.y - corner.top + img.height / 2) * canvasZoom); // translate the canvas's orgin to the image center
- context.rotate(transform.angle * Math.PI / 180);
- context.translate(-img.width * zoom * 0.5 * canvasZoom, -img.height * zoom * 0.5 * canvasZoom);
- context.drawImage(this.img, 0, 0, img.width * zoom * canvasZoom, img.height * zoom * canvasZoom);
- context.restore();
- this.$emit('afterDraw', context, {
- width: this.ctrlWidth * canvasZoom,
- height: this.ctrlHeight * canvasZoom
- }); // afterDraw hook
- context.draw(false, function () {
- uni.canvasToTempFilePath({
- canvasId: _this5.canvasId,
- quality: _this5.quality || 1,
- fileType: _this5.fileType,
- success: function success(res) {
- _this5.$emit('cropped', res.tempFilePath, {
- originWidth: _this5.image.originWidth,
- originHeight: _this5.image.originHeight,
- width: _this5.ctrlWidth * canvasZoom,
- height: _this5.ctrlHeight * canvasZoom,
- scale: zoom,
- translate: {
- x: transform.translate.x,
- y: transform.translate.y
- },
- rotate: transform.angle
- }); // draw callback
- }
- }, _this5);
- });
- }
- }
- };
- exports.default = _default2;
- /* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"]))
- /***/ })
- }]);
- //# sourceMappingURL=../../../.sourcemap/mp-weixin/pages_basics/common/vendor.js.map
|