Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
x649585723
incubator-echarts
提交
b299a93a
I
incubator-echarts
项目概览
x649585723
/
incubator-echarts
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
I
incubator-echarts
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
b299a93a
编写于
12月 22, 2016
作者:
1
100pah
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
tweak pictorial animation and repeat direction and label position.
上级
acbb8281
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
49 addition
and
25 deletion
+49
-25
src/chart/bar/PictorialBarSeries.js
src/chart/bar/PictorialBarSeries.js
+4
-2
src/chart/bar/PictorialBarView.js
src/chart/bar/PictorialBarView.js
+39
-23
test/pictorial-repeat.html
test/pictorial-repeat.html
+6
-0
未找到文件。
src/chart/bar/PictorialBarSeries.js
浏览文件 @
b299a93a
...
@@ -15,8 +15,10 @@ define(function(require) {
...
@@ -15,8 +15,10 @@ define(function(require) {
symbolOffset
:
null
,
symbolOffset
:
null
,
symbolMargin
:
null
,
// start margin and end margin. Can be a number or a percent string.
symbolMargin
:
null
,
// start margin and end margin. Can be a number or a percent string.
// Auto margin by defualt.
// Auto margin by defualt.
symbolRepeat
:
false
,
// Can be a number, specifies repeat times.
symbolRepeat
:
false
,
// false/null/undefined, means no repeat.
// Or false/null/undefined, means no repeat.
// Can be a number, specifies repeat times.
symbolRepeatDirection
:
'
end
'
,
// 'end' means from 'start' to 'end'.
symbolClip
:
false
,
symbolClip
:
false
,
symbolBoundingData
:
null
,
symbolBoundingData
:
null
,
...
...
src/chart/bar/PictorialBarView.js
浏览文件 @
b299a93a
...
@@ -25,7 +25,7 @@ define(function (require) {
...
@@ -25,7 +25,7 @@ define(function (require) {
var
cartesian
=
seriesModel
.
coordinateSystem
;
var
cartesian
=
seriesModel
.
coordinateSystem
;
var
baseAxis
=
cartesian
.
getBaseAxis
();
var
baseAxis
=
cartesian
.
getBaseAxis
();
var
isHorizontal
=
baseAxis
.
isHorizontal
();
var
isHorizontal
=
!!
baseAxis
.
isHorizontal
();
var
coordSysRect
=
cartesian
.
grid
.
getRect
();
var
coordSysRect
=
cartesian
.
grid
.
getRect
();
var
opt
=
{
var
opt
=
{
...
@@ -137,6 +137,7 @@ define(function (require) {
...
@@ -137,6 +137,7 @@ define(function (require) {
color
:
data
.
getItemVisual
(
dataIndex
,
'
color
'
),
color
:
data
.
getItemVisual
(
dataIndex
,
'
color
'
),
symbolClip
:
symbolClip
,
symbolClip
:
symbolClip
,
symbolRepeat
:
symbolRepeat
,
symbolRepeat
:
symbolRepeat
,
symbolRepeatDirection
:
itemModel
.
get
(
'
symbolRepeatDirection
'
),
rotation
:
(
symbolRotate
||
0
)
*
Math
.
PI
/
180
||
0
rotation
:
(
symbolRotate
||
0
)
*
Math
.
PI
/
180
||
0
};
};
...
@@ -242,7 +243,9 @@ define(function (require) {
...
@@ -242,7 +243,9 @@ define(function (require) {
output
.
symbolMargin
=
symbolMargin
;
output
.
symbolMargin
=
symbolMargin
;
var
sizeFix
=
(
barFullLength
>
0
?
1
:
-
1
)
*
(
pathLength
/
2
);
var
pxSign
=
output
.
pxSign
=
barFullLength
>
0
?
1
:
barFullLength
<
0
?
-
1
:
0
;
var
sizeFix
=
pxSign
*
(
pathLength
/
2
);
var
pathPosition
=
output
.
pathPosition
=
[];
var
pathPosition
=
output
.
pathPosition
=
[];
pathPosition
[
categoryDim
.
index
]
=
layout
[
categoryDim
.
wh
]
/
2
;
pathPosition
[
categoryDim
.
index
]
=
layout
[
categoryDim
.
wh
]
/
2
;
pathPosition
[
valueDim
.
index
]
=
symbolPosition
===
'
start
'
pathPosition
[
valueDim
.
index
]
=
symbolPosition
===
'
start
'
...
@@ -260,7 +263,9 @@ define(function (require) {
...
@@ -260,7 +263,9 @@ define(function (require) {
bundlePosition
[
valueDim
.
index
]
=
layout
[
valueDim
.
xy
];
bundlePosition
[
valueDim
.
index
]
=
layout
[
valueDim
.
xy
];
var
barRectShape
=
output
.
barRectShape
=
zrUtil
.
extend
({},
layout
);
var
barRectShape
=
output
.
barRectShape
=
zrUtil
.
extend
({},
layout
);
barRectShape
[
valueDim
.
wh
]
=
barFullLength
;
barRectShape
[
valueDim
.
wh
]
=
pxSign
*
Math
.
max
(
Math
.
abs
(
layout
[
valueDim
.
wh
]),
Math
.
abs
(
pathPosition
[
valueDim
.
index
]
+
sizeFix
)
);
barRectShape
[
categoryDim
.
wh
]
=
layout
[
categoryDim
.
wh
];
barRectShape
[
categoryDim
.
wh
]
=
layout
[
categoryDim
.
wh
];
var
clipShape
=
output
.
clipShape
=
{
x
:
0
,
y
:
0
};
var
clipShape
=
output
.
clipShape
=
{
x
:
0
,
y
:
0
};
...
@@ -270,9 +275,7 @@ define(function (require) {
...
@@ -270,9 +275,7 @@ define(function (require) {
// If x or y is less than zero, show reversed shape.
// If x or y is less than zero, show reversed shape.
var
symbolScale
=
output
.
symbolScale
=
[
symbolSize
[
0
]
/
2
,
symbolSize
[
1
]
/
2
];
var
symbolScale
=
output
.
symbolScale
=
[
symbolSize
[
0
]
/
2
,
symbolSize
[
1
]
/
2
];
// Follow convention, 'right' and 'top' is the normal scale.
// Follow convention, 'right' and 'top' is the normal scale.
symbolScale
[
valueDim
.
index
]
*=
opt
.
isHorizontal
symbolScale
[
valueDim
.
index
]
*=
(
opt
.
isHorizontal
?
-
1
:
1
)
*
pxSign
;
?
(
barFullLength
>
0
?
-
1
:
1
)
:
(
barFullLength
>=
0
?
1
:
-
1
);
}
}
function
createPath
(
symbolMeta
)
{
function
createPath
(
symbolMeta
)
{
...
@@ -325,7 +328,14 @@ define(function (require) {
...
@@ -325,7 +328,14 @@ define(function (require) {
function
makeTarget
(
index
)
{
function
makeTarget
(
index
)
{
var
position
=
pathPosition
.
slice
();
var
position
=
pathPosition
.
slice
();
position
[
valueDim
.
index
]
=
unit
*
(
index
-
repeatTimes
/
2
+
0.5
)
+
pathPosition
[
valueDim
.
index
];
// (start && pxSign > 0) || (end && pxSign < 0): i = repeatTimes - index
// Otherwise: i = index;
var
pxSign
=
symbolMeta
.
pxSign
;
var
i
=
index
;
if
(
symbolMeta
.
symbolRepeatDirection
===
'
start
'
?
pxSign
>
0
:
pxSign
<
0
)
{
i
=
repeatTimes
-
index
;
}
position
[
valueDim
.
index
]
=
unit
*
(
i
-
repeatTimes
/
2
+
0.5
)
+
pathPosition
[
valueDim
.
index
];
return
{
return
{
position
:
position
,
position
:
position
,
scale
:
symbolMeta
.
symbolScale
.
slice
(),
scale
:
symbolMeta
.
symbolScale
.
slice
(),
...
@@ -385,42 +395,48 @@ define(function (require) {
...
@@ -385,42 +395,48 @@ define(function (require) {
bar
.
__pictorialBundle
=
bundle
;
bar
.
__pictorialBundle
=
bundle
;
bundle
.
attr
(
'
position
'
,
symbolMeta
.
bundlePosition
.
slice
());
bundle
.
attr
(
'
position
'
,
symbolMeta
.
bundlePosition
.
slice
());
var
updateMethod
=
isUpdate
?
'
updateProps
'
:
'
initProps
'
;
var
animationModel
=
opt
.
animationModel
;
if
(
symbolMeta
.
symbolRepeat
)
{
if
(
symbolMeta
.
symbolRepeat
)
{
updateRepeatSymbols
(
bar
,
dataIndex
,
opt
,
symbolMeta
);
updateRepeatSymbols
(
bar
,
dataIndex
,
opt
,
symbolMeta
);
}
}
else
{
else
{
var
p
ath
=
bar
.
__pictorialMainPath
=
createPath
(
symbolMeta
);
var
mainP
ath
=
bar
.
__pictorialMainPath
=
createPath
(
symbolMeta
);
bundle
.
add
(
p
ath
);
bundle
.
add
(
mainP
ath
);
p
ath
.
attr
({
mainP
ath
.
attr
({
position
:
symbolMeta
.
pathPosition
.
slice
(),
position
:
symbolMeta
.
pathPosition
.
slice
(),
scale
:
symbolMeta
.
symbolScale
.
slice
()
,
scale
:
[
0
,
0
]
,
rotation
:
symbolMeta
.
rotation
rotation
:
symbolMeta
.
rotation
});
});
graphic
[
updateMethod
](
mainPath
,
{
scale
:
symbolMeta
.
symbolScale
.
slice
()},
animationModel
,
dataIndex
);
}
}
var
clipPath
;
var
clipPath
;
if
(
symbolMeta
.
symbolClip
)
{
if
(
symbolMeta
.
symbolClip
)
{
var
clipShape
=
zrUtil
.
extend
({},
symbolMeta
.
clipShape
);
clipShape
[
valueDim
.
wh
]
=
0
;
clipPath
=
new
graphic
.
Rect
({
clipPath
=
new
graphic
.
Rect
({
shape
:
zrUtil
.
extend
({},
symbolMeta
.
clipShape
)
shape
:
clipShape
});
});
bundle
.
setClipPath
(
clipPath
);
bundle
.
setClipPath
(
clipPath
);
bar
.
__pictorialClipPath
=
clipPath
;
bar
.
__pictorialClipPath
=
clipPath
;
var
target
=
{};
target
[
valueDim
.
wh
]
=
symbolMeta
.
clipShape
[
valueDim
.
wh
];
graphic
[
updateMethod
](
clipPath
,
{
shape
:
target
},
animationModel
,
dataIndex
);
}
}
updateBarRect
(
bar
,
dataIndex
,
opt
,
symbolMeta
);
updateBarRect
(
bar
,
dataIndex
,
opt
,
symbolMeta
);
// Three animation types: clip, position, scale.
// Three animation types: clip, position, scale.
var
animationModel
=
opt
.
animationModel
;
var
updateMethod
=
isUpdate
?
'
updateProps
'
:
'
initProps
'
;
if
(
animationModel
)
{
// clipPath animation
// clipPath animation
if
(
clipPath
)
{
// if (clipPath) {
var
rectShape
=
clipPath
.
shape
;
// }
var
target
=
{};
target
[
valueDim
.
wh
]
=
rectShape
[
valueDim
.
wh
];
rectShape
[
valueDim
.
wh
]
=
0
;
graphic
[
updateMethod
](
clipPath
,
{
shape
:
target
},
animationModel
,
dataIndex
);
}
// FIXME
// FIXME
// animation clip path?
// animation clip path?
...
@@ -447,7 +463,7 @@ define(function (require) {
...
@@ -447,7 +463,7 @@ define(function (require) {
// // }
// // }
// graphic[updateMethod](path, target, animationModel, dataIndex);
// graphic[updateMethod](path, target, animationModel, dataIndex);
// });
// });
}
//
}
return
bar
;
return
bar
;
}
}
...
...
test/pictorial-repeat.html
浏览文件 @
b299a93a
...
@@ -109,6 +109,12 @@
...
@@ -109,6 +109,12 @@
series
:
[{
series
:
[{
name
:
'
data
'
,
name
:
'
data
'
,
type
:
'
pictorialBar
'
,
type
:
'
pictorialBar
'
,
label
:
{
normal
:
{
show
:
true
,
position
:
'
outside
'
},
},
symbol
:
shoppingCart
,
symbol
:
shoppingCart
,
symbolRepeat
:
true
,
symbolRepeat
:
true
,
symbolMargin
:
'
40%
'
,
symbolMargin
:
'
40%
'
,
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录