diff --git a/src/iscs_new/animateHandle.js b/src/iscs_new/animateHandle.js index 28d8a6c1b..0a0c3067f 100644 --- a/src/iscs_new/animateHandle.js +++ b/src/iscs_new/animateHandle.js @@ -1,33 +1,48 @@ import Group from 'zrender/src/container/Group'; +function traverse(group, map) { + group.eachChild(el => { + if (el instanceof Group) { + traverse(el, map); + } else { + map[el.name] = el; + } + }) + return map; +} class Animate { constructor(state) { this.state = {...state} this.shapeFactory = this.shape? this.shape.shapeFactory: null; - this.timer = null; - this.total = 0; + this.sum = 0; this.count = 0; + this.first = true; } - run(delay) { - this.total = this.total + delay; - if (this.total > this.state.time) { - clearTimeout(this.timer); - this.timer = setTimeout(this.__animate.bind(this), this.state.delay); + run(interval) { + this.sum = this.sum + interval; + const total = this.state.time + (this.first? this.state.delay: 0) + if (this.sum > total) { + this.animate(this) this.count = this.count + 1; - this.total = 0; + this.sum = 0; + this.first = false; } - } +} isLoop() { return this.state.loop; } - __animate() { + isNeedDefault() { + return this.state.isNeedDefault; + } + + animate() { const shape = this.state.shape; const frameList = this.state.frameList; - const mapView = this.__traverse(shape, {}); + const mapView = traverse(shape, {}); if(shape && frameList) { const size = frameList.length; const frame = frameList[this.count%size]; @@ -36,21 +51,11 @@ class Animate { const model = frame[name]; if (view && model) { view.attr({shape: model.shape, style: model.style}); + view.dirty(); } }) } } - - __traverse(group, map) { - group.eachChild(el => { - if (el instanceof Group) { - this.__traverse(el, map); - } else { - map[el.name] = el; - } - }) - return map; - } } class AnimateHandle { diff --git a/src/iscs_new/painter.js b/src/iscs_new/painter.js index 99920cf9d..08f5864d4 100644 --- a/src/iscs_new/painter.js +++ b/src/iscs_new/painter.js @@ -27,9 +27,9 @@ class Painter extends Group { onframe(zr) { const onframe = zr.animation.onframe; const animateHandle = this.$animateHandle; - zr.animation.onframe = (...args) => { - onframe.apply(zr.animation, args); - animateHandle.onframe(...args); + zr.animation.onframe = interval => { + onframe.call(zr.animation, interval); + animateHandle.onframe(interval); } } @@ -72,9 +72,11 @@ class Painter extends Group { } update(stateList=[]) { - stateList.forEach(state => { - this.$animateHandle.animate(state); - }) + stateList + .sort((a,b) => a.weight - b.weight) + .forEach(state => { + this.$animateHandle.animate(state); + }) } updateTransform(opt) { diff --git a/src/iscs_new/stateHandle.js b/src/iscs_new/stateHandle.js index c8e001383..338f79036 100644 --- a/src/iscs_new/stateHandle.js +++ b/src/iscs_new/stateHandle.js @@ -33,7 +33,7 @@ export default class StateHandle { // this.updateState(this.parse(shapeFactory, state)), // 处理自身 // this.updateState(this.parse(shapeFactory, state)) // 处理依赖 ]; - }, []).sort((a,b) => a.weight - b.weight); + }, []); } updateState(state={}) {