优化皮肤配置
This commit is contained in:
parent
cad7ff2129
commit
74d82f5872
@ -36,7 +36,7 @@ class Animate {
|
||||
}
|
||||
|
||||
isNeedDefault() {
|
||||
return this._state.needDefault; // && this.getIndex() == 0;
|
||||
return this._state.needDefault;
|
||||
}
|
||||
|
||||
isDispose() {
|
||||
@ -67,7 +67,7 @@ class Animate {
|
||||
const state = mapShape[name]
|
||||
const view = mapView[name];
|
||||
if (view) {
|
||||
shape.setSightless(shape.model.sightless);
|
||||
shape.setInvisible(shape.model.sightless);
|
||||
view.attr({shape: state.default.shape, style: state.default.style});
|
||||
view.dirty();
|
||||
}
|
||||
@ -78,7 +78,7 @@ class Animate {
|
||||
const view = mapView[name];
|
||||
const model = frame[name];
|
||||
if (view && model) {
|
||||
shape.setSightless(shape.model.sightless||model.sightless);
|
||||
shape.setInvisible(shape.model.sightless||model.sightless);
|
||||
view.attr({shape: model.shape, style: model.style});
|
||||
view.dirty();
|
||||
}
|
||||
@ -96,7 +96,7 @@ class AnimateHandle {
|
||||
this._animates = [];
|
||||
}
|
||||
|
||||
onframe (delay) {
|
||||
onframe(delay) {
|
||||
const animate = this._animates.shift();
|
||||
if (animate) {
|
||||
animate.run(delay);
|
||||
|
@ -6,34 +6,25 @@ const defaultStyle = {
|
||||
backgroundColor : '#000000',
|
||||
|
||||
/** 默认字体 族类*/
|
||||
fontFamily : '黑体,Times New Roman',
|
||||
fontFamily : 'SimSun,Times New Roman',
|
||||
|
||||
/** 默认字体 大小*/
|
||||
fontSize : 12,
|
||||
|
||||
/** 文字高亮颜色*/
|
||||
textHover2Color : '#6000ff',
|
||||
|
||||
/** 线条高亮颜色*/
|
||||
lineHover2Color : '#ffff00',
|
||||
|
||||
/** Svg高亮颜色*/
|
||||
svgHover2Color : '#62ff00',
|
||||
|
||||
/** 图片高亮遮罩*/
|
||||
maskHover2Image : '',
|
||||
|
||||
/** 选中透明度*/
|
||||
maskOpacity : 0.8,
|
||||
opacity : 0.5,
|
||||
|
||||
/** 提亮度*/
|
||||
liftLevel : 0.5,
|
||||
liftLevel : 0.8,
|
||||
|
||||
/** 边框宽度*/
|
||||
borderWidth : 1,
|
||||
|
||||
/** 边框颜色*/
|
||||
borderColor : '#000'
|
||||
borderColor : '#000',
|
||||
|
||||
/** 边框Dash*/
|
||||
borderDash: [4, 4]
|
||||
}
|
||||
|
||||
export default defaultStyle;
|
||||
|
@ -1,7 +1,9 @@
|
||||
import * as graphic from '../core/graphic';
|
||||
import * as utils from '../utils/utils';
|
||||
import * as color from 'zrender/src/tool/color';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import shapeRender from '../constant/shapeRender';
|
||||
import defaultStyle from '../config/defaultStyle';
|
||||
|
||||
function shapeStyleBuilder(model) {
|
||||
return {
|
||||
@ -17,14 +19,17 @@ function shapeStyleBuilder(model) {
|
||||
height: 0
|
||||
},
|
||||
style: {
|
||||
lineWidth: 1,
|
||||
stroke: 'rgba(255,255,255,0.5)',
|
||||
fill: 'rgba(200,200,200,0.5)'
|
||||
lineWidth: defaultStyle.borderWidth,
|
||||
stroke: color.lift(defaultStyle.borderColor, defaultStyle.liftLevel),
|
||||
fill: `rgba(200,200,200,0.5)`
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log(color);
|
||||
|
||||
// 图形抽象层
|
||||
// 继承Group是为了直接获取的到包围框不需要进行坐标变化。
|
||||
class AbstractShape extends Group {
|
||||
constructor({model, shapeType, shapeFactory}) {
|
||||
super({...shapeRender, code: model.code, type: model.type});
|
||||
@ -48,11 +53,10 @@ class AbstractShape extends Group {
|
||||
}
|
||||
|
||||
// 设置显隐
|
||||
setSightless(sightless) {
|
||||
setInvisible(sightless) {
|
||||
sightless ? this.hide(): this.show();
|
||||
}
|
||||
|
||||
|
||||
// 设置高亮
|
||||
active() {}
|
||||
|
||||
|
@ -14,8 +14,7 @@ function shapeStyleBuilder({shape}) {
|
||||
cursor: 'crosshair',
|
||||
shape,
|
||||
style: {
|
||||
opacity: 0.5,
|
||||
fill: '#0000ff'
|
||||
fill: `rgba(200,200,200,0.5)`
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -10,9 +10,8 @@ function lineStyleBuilder() {
|
||||
z: 9998,
|
||||
shape: {x1: 0, y1: 0, x2: 0, y2: 0 },
|
||||
style: {
|
||||
opacity: 0.8,
|
||||
lineWidth: 2,
|
||||
stroke: '#ff0000'
|
||||
stroke: `rgba(200,200,200,0.8)`
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -27,7 +26,7 @@ function circleStyleBuilder({shape}) {
|
||||
shape,
|
||||
style: {
|
||||
opacity: 0.5,
|
||||
fill: '#0000ff'
|
||||
fill: `rgba(200,200,200,0.3)`
|
||||
},
|
||||
}
|
||||
}
|
||||
|
@ -48,7 +48,7 @@ class Compose extends AbstractShape {
|
||||
this.instance.origin = utils.createOrigin(this.instance);
|
||||
this.instance.transform = utils.createTransform({scale: this.model.scale, position: this.model.position, rotation: this.model.rotation});
|
||||
this.add(this.instance);
|
||||
this.setSightless(this.model.sightless)
|
||||
this.setInvisible(this.model.sightless)
|
||||
}
|
||||
|
||||
// 设置高亮
|
||||
|
@ -44,7 +44,7 @@ class Element extends AbstractShape {
|
||||
this.instance.origin = utils.createOrigin(this.instance);
|
||||
this.instance.transform = utils.createTransform({scale: this.model.scale, position: this.model.position, rotation: this.model.rotation});
|
||||
this.add(this.instance);
|
||||
this.setSightless(this.model.sightless)
|
||||
this.setInvisible(this.model.sightless)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -10,6 +10,7 @@ import shapeEvent from '../constant/shapeEvent';
|
||||
import orders from '../utils/orders';
|
||||
import shapeLayer from '../constant/shapeLayer';
|
||||
import templateParser from './templateParser';
|
||||
import defaultStyle from '../config/defaultStyle';
|
||||
|
||||
const None = e => null;
|
||||
const shapeBuilderMap = {
|
||||
@ -29,10 +30,10 @@ function shapeStyleBuilder() {
|
||||
height: 0
|
||||
},
|
||||
style: {
|
||||
lineDash: [4, 4],
|
||||
lineWidth: 1,
|
||||
stroke: '#000',
|
||||
fill: 'transparent'
|
||||
lineDash: defaultStyle.borderDash,
|
||||
lineWidth: defaultStyle.borderWidth,
|
||||
stroke: defaultStyle.borderColor,
|
||||
fill: defaultStyle.transparentColor
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -20,7 +20,7 @@ class Painter extends Group {
|
||||
// 动画处理器
|
||||
this.$animateHandle = new AnimateHandle(this);
|
||||
|
||||
// 重新动画函数,加入钩子
|
||||
// 重写onFrame加入钩子
|
||||
this.onframe(zr);
|
||||
}
|
||||
|
||||
|
@ -1,6 +1,7 @@
|
||||
import * as graphic from './core/graphic.js';
|
||||
import shapeRender from './constant/shapeRender';
|
||||
import shapeLayer from './constant/shapeLayer';
|
||||
import defaultStyle from './config/defaultStyle';
|
||||
|
||||
function shapeStyleBuilder() {
|
||||
return {
|
||||
@ -14,9 +15,7 @@ function shapeStyleBuilder() {
|
||||
height: 0
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
stroke: '#000',
|
||||
fill: 'rgba(200,200,200,0.3)'
|
||||
fill: `rgba(200,200,200,0.3)`
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -21,8 +21,6 @@ export default class StateHandle {
|
||||
// );
|
||||
// }
|
||||
|
||||
console.log(template, 11)
|
||||
|
||||
return {
|
||||
...state,
|
||||
...templateState,
|
||||
|
@ -15,12 +15,14 @@ export default class TransformHandle {
|
||||
|
||||
// 检查显隐
|
||||
checkVisible(shape) {
|
||||
return shape.model && !shape.model.sightless && utils.createBoundingRectCheckVisible(shape, this.transform).intersect(this.rect);
|
||||
return shape.model && !shape.model.sightless || utils.createBoundingRectCheckVisible(shape, this.transform).intersect(this.rect);
|
||||
}
|
||||
|
||||
// 重新计算显隐
|
||||
visibleView(shape) {
|
||||
this.checkVisible(shape) ? shape.show(): shape.hide();
|
||||
this.checkVisible(shape)
|
||||
? shape.show()
|
||||
: shape.hide();
|
||||
shape.dirty();
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user