修改代码
This commit is contained in:
ival
parent
c735f4dd50
commit
1639866515
@ -65,6 +65,7 @@ class Animate {
|
||||
const view = mapView[name];
|
||||
const model = frame[name];
|
||||
if (view && model) {
|
||||
model.visible? view.show(): view.hide();
|
||||
view.attr({shape: model.shape, style: model.style});
|
||||
view.dirty();
|
||||
}
|
||||
@ -101,4 +102,4 @@ class AnimateHandle {
|
||||
}
|
||||
}
|
||||
|
||||
export default AnimateHandle
|
||||
export default AnimateHandle
|
||||
|
||||
@ -4,19 +4,43 @@ import * as graphic from '../../core/graphic';
|
||||
const elementType = Object.fromEntries(Object.keys(graphic).map(type => [type, type]));
|
||||
|
||||
export const elementConst = {
|
||||
[elementType.Line]: {code: elementType.Line, name:'线段', formList:{style:[], shape:[] }},
|
||||
{code:'text', name:'文字', formList:{style:[], shape:[] }},
|
||||
{code:'rect', name:'矩形', formList:{style:[], shape:[] }},
|
||||
{code:'circle', name:'圆形', formList:{style:[], shape:[] }},
|
||||
{code:'polygon', name:'多边形', formList:{style:[], shape:[] }},
|
||||
{code:'triangle', name:'三角形', formList:{style:[], shape:[] }},
|
||||
{code:'arrow', name:'箭头', formList:{style:[], shape:[] }},
|
||||
{code:'polyline', name:'多边形折线段', formList:{style:[], shape:[] }},
|
||||
{code:'isogon', name:'正多边形', formList:{style:[], shape:[] }},
|
||||
{code:'ellipse', name:'椭圆', formList:{style:[], shape:[] }},
|
||||
{code:'arc', name:'圆弧', formList:{style:[], shape:[] }},
|
||||
{code:'sector', name:'扇形', formList:{style:[], shape:[] }},
|
||||
{code:'heart', name:'心形', formList:{style:[], shape:[] }},
|
||||
{code:'droplet', name:'水滴', formList:{style:[], shape:[] }}
|
||||
]
|
||||
[elementType.Line]: {
|
||||
code: elementType.Line, name:'线段', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Text]: {
|
||||
code: elementType.Text, name:'文字', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Rect]: {
|
||||
code: elementType.Rect, name:'矩形', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Circle]: {
|
||||
code: elementType.Circle, name:'圆形', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Polygon]: {
|
||||
code: elementType.Polygon, name:'多边形', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Arrow]: {
|
||||
code: elementType.Arrow, name:'箭头', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Polyline]: {
|
||||
code: elementType.Polyline, name:'多边形折线段', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Isogon]: {
|
||||
code: elementType.Isogon, name:'正多边形', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Ellipse]: {
|
||||
code: elementType.Ellipse, name:'椭圆', formList:{ style:[], shape:[] }
|
||||
},
|
||||
[elementType.Arc]: {
|
||||
code: elementType.Arc, name:'圆弧', formList:{style:[], shape:[] }
|
||||
},
|
||||
[elementType.Sector]: {
|
||||
code: elementType.Sector, name:'扇形', formList:{style:[], shape:[] }
|
||||
},
|
||||
[elementType.Heart]: {
|
||||
code: elementType.Heart, name:'心形', formList:{style:[], shape:[] }
|
||||
},
|
||||
[elementType.Droplet]: {
|
||||
code: elementType.Droplet, name:'水滴', formList:{style:[], shape:[] }
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,36 +1,39 @@
|
||||
export default [
|
||||
// number 0 控制图形的前后顺序。z 值小的图形会被 z 值大的图形覆盖。z 相比 zlevel 优先级更低，而且不会创建新的 Canvas。
|
||||
{ prop: 'z',
|
||||
label: '层级 z',
|
||||
type: 'number', precisionFlag:0, min:0, max:100, step:1,
|
||||
{ prop: 'z1',
|
||||
label: '层级 z1',
|
||||
type: 'number',
|
||||
precisionFlag: 0,
|
||||
min:0,
|
||||
max:20,
|
||||
step:1,
|
||||
rules:[
|
||||
{ required: true, message:'请输入层级z', trigger: 'blur' }
|
||||
],
|
||||
value: 1,
|
||||
description: ''
|
||||
value: 10,
|
||||
description: '控制图形的前后顺序。'
|
||||
},
|
||||
{ prop: 'z2', label: '层级 z2',
|
||||
type: 'number', precisionFlag:0, min:0, max:100, step:1,
|
||||
rules:[{ required: true, message:'请输入层级z2', trigger: 'blur' }],
|
||||
defValue: 10, required:true
|
||||
}
|
||||
// boolean false 图形是否不可见，为 true 时不绘制图形，但是仍能触发鼠标事件。
|
||||
// {prop: 'invisible', label: '不可见', type: 'switch', defValue: false,required:true},
|
||||
// // boolean false 是否响应鼠标事件。
|
||||
// {prop: 'silent', label: '响应鼠标事件', type: 'switch', defValue: false,required:true}
|
||||
// // boolean false 是否进行裁剪。
|
||||
// culling: {
|
||||
// },
|
||||
// // string 'pointer' 鼠标移到元素上时的鼠标样式。
|
||||
// cursor: {
|
||||
// },
|
||||
// // boolean false 图形是否可拖曳。
|
||||
// draggable: {
|
||||
// },
|
||||
// // number -1 是否渐进式渲染。当图形元素过多时才使用，用大于 0 的数字表示渲染顺序。
|
||||
// progressive: {
|
||||
// },
|
||||
// // boolean false 是否使用包围盒检验鼠标是否移动到物体。false 则检测元素实际的内容。
|
||||
// rectHover: {
|
||||
// },
|
||||
{
|
||||
prop: 'z2',
|
||||
label: '层级 z2',
|
||||
type: 'number',
|
||||
precisionFlag: 0,
|
||||
min: 0,
|
||||
max: 100,
|
||||
step: 1,
|
||||
rules:[
|
||||
{ required: true, message:'请输入层级z2', trigger: 'blur' }
|
||||
],
|
||||
value: 50,
|
||||
description: '控制图形的前后顺序。z2 值小的图形会被 z2 值大的图形覆盖。z2 相比 z1 优先级更低。'
|
||||
},
|
||||
{
|
||||
prop: 'visible',
|
||||
label: '图形是否可见',
|
||||
type: props.Boolean,
|
||||
rules:[
|
||||
{ required: true, message:'请输入层级z2', trigger: 'blur' }
|
||||
],
|
||||
value: false,
|
||||
description: '图形是否可见，为 false 时不绘制图形。'
|
||||
}
|
||||
];
|
||||
|
||||
@ -15,18 +15,15 @@ export default class TransformHandle {
|
||||
|
||||
// 检查显隐
|
||||
checkVisible(shape) {
|
||||
return utils.createBoundingRectCheckVisible(shape, this.transform).intersect(this.rect);
|
||||
return shape.model.visible && utils.createBoundingRectCheckVisible(shape, this.transform).intersect(this.rect);
|
||||
}
|
||||
|
||||
// 重新计算显隐
|
||||
visibleView(shape) {
|
||||
let visible = false;
|
||||
if (this.checkVisible(shape)) {
|
||||
shape.show();
|
||||
visible = true;
|
||||
} else {
|
||||
shape.hide();
|
||||
visible = false;
|
||||
}
|
||||
|
||||
shape.dirty();
|
||||
|
||||
@ -112,8 +112,8 @@ export default {
|
||||
stroke: 'black'
|
||||
},
|
||||
stateList: [
|
||||
{ status: 'st1', shape: {}, style:{ fill: 'yellow', stroke: 'black'} },
|
||||
{ status: 'st2', shape: {}, style:{ fill: 'blue', stroke: 'black'} }
|
||||
{ status: 'st1', visible: true, shape: {}, style:{ fill: 'yellow', stroke: 'black'} },
|
||||
{ status: 'st2', visible: true, shape: {}, style:{ fill: 'blue', stroke: 'black'} }
|
||||
]
|
||||
},
|
||||
{ name: 'b',
|
||||
@ -124,8 +124,8 @@ export default {
|
||||
stroke: 'black'
|
||||
},
|
||||
stateList: [
|
||||
{ status: 'st1', shape: {}, style:{ fill: 'yellow', stroke: 'black'} },
|
||||
{ status: 'st2', shape: {}, style:{ fill: 'blue', stroke: 'black'} }
|
||||
{ status: 'st1', visible: true, shape: {}, style:{ fill: 'yellow', stroke: 'black'} },
|
||||
{ status: 'st2', visible: true, shape: {}, style:{ fill: 'blue', stroke: 'black'} }
|
||||
]
|
||||
},
|
||||
],
|
||||
|
||||
Loading…
Reference in New Issue
Block a user