Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
半栈学徒
incubator-echarts
提交
c980c6c0
I
incubator-echarts
项目概览
半栈学徒
/
incubator-echarts
与 Fork 源项目一致
从无法访问的项目Fork
通知
5
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,发现更多精彩内容 >>
提交
c980c6c0
编写于
12月 05, 2017
作者:
O
Ovilia
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat(sunburst): support levels config
上级
c80bb99c
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
126 addition
and
69 deletion
+126
-69
src/chart/sunburst/SunburstPiece.js
src/chart/sunburst/SunburstPiece.js
+37
-34
src/chart/sunburst/SunburstSeries.js
src/chart/sunburst/SunburstSeries.js
+3
-1
test/sunburst.html
test/sunburst.html
+86
-34
未找到文件。
src/chart/sunburst/SunburstPiece.js
浏览文件 @
c980c6c0
import
*
as
zrUtil
from
'
zrender/src/core/util
'
;
import
*
as
graphic
from
'
../../util/graphic
'
;
import
Model
from
'
../../model/Model
'
;
var
NodeHighlightPolicy
=
{
NONE
:
'
none
'
,
// not downplay others
...
...
@@ -90,7 +91,7 @@ SunburstPieceProto.updateData = function (
// Update common style
var
itemStyleModel
=
itemModel
.
getModel
(
'
itemStyle
'
);
var
visualColor
=
getNodeColor
(
node
,
ecModel
);
var
visualColor
=
getNodeColor
(
node
,
seriesModel
,
ecModel
);
sector
.
useStyle
(
zrUtil
.
defaults
(
...
...
@@ -109,7 +110,7 @@ SunburstPieceProto.updateData = function (
var
highlightPolicy
=
seriesModel
.
getShallow
(
'
highlightPolicy
'
);
this
.
_initEvents
(
sector
,
node
,
seriesModel
,
highlightPolicy
);
this
.
_updateLabel
(
seriesModel
,
ecModel
);
this
.
_updateLabel
(
seriesModel
,
ecModel
,
visualColor
);
graphic
.
setHoverStyle
(
this
);
};
...
...
@@ -131,26 +132,20 @@ SunburstPieceProto.onEmphasis = function (highlightPolicy) {
SunburstPieceProto
.
onNormal
=
function
()
{
this
.
node
.
hostTree
.
root
.
eachNode
(
function
(
n
)
{
if
(
n
.
piece
)
{
var
itemStyleModel
=
n
.
getModel
(
'
itemStyle.normal
'
);
var
style
=
itemStyleModel
.
getItemStyle
();
updatePiece
(
n
.
piece
,
false
,
style
.
opacity
,
style
.
z
);
updatePiece
(
n
,
'
normal
'
);
}
});
};
SunburstPieceProto
.
onHighlight
=
function
()
{
var
itemStyleModel
=
this
.
node
.
getModel
(
'
itemStyle.highlight
'
);
var
style
=
itemStyleModel
.
getItemStyle
();
updatePiece
(
this
,
true
,
style
.
opacity
,
style
.
z
);
updatePiece
(
this
.
node
,
'
highlight
'
);
};
SunburstPieceProto
.
onDownplay
=
function
()
{
var
itemStyleModel
=
this
.
node
.
getModel
(
'
itemStyle.downplay
'
);
var
style
=
itemStyleModel
.
getItemStyle
();
updatePiece
(
this
,
false
,
style
.
opacity
,
style
.
z
);
updatePiece
(
this
.
node
,
'
downplay
'
);
};
SunburstPieceProto
.
_updateLabel
=
function
(
seriesModel
,
ecModel
)
{
SunburstPieceProto
.
_updateLabel
=
function
(
seriesModel
,
ecModel
,
visualColor
)
{
var
itemModel
=
this
.
node
.
getModel
();
var
labelModel
=
itemModel
.
getModel
(
'
label.normal
'
);
var
labelHoverModel
=
itemModel
.
getModel
(
'
label.emphasis
'
);
...
...
@@ -168,14 +163,15 @@ SunburstPieceProto._updateLabel = function (seriesModel, ecModel) {
label
.
style
,
label
.
hoverStyle
=
{},
labelModel
,
labelHoverModel
,
{
defaultText
:
labelModel
.
getShallow
(
'
show
'
)
?
text
:
null
,
autoColor
:
getNodeColor
(
this
.
node
,
ecModel
)
,
autoColor
:
visualColor
,
useInsideStyle
:
true
}
);
label
.
attr
(
'
style
'
,
{
text
:
text
,
textAlign
:
'
center
'
,
textVerticalAlign
:
'
middle
'
textVerticalAlign
:
'
middle
'
,
opacity
:
labelModel
.
get
(
'
opacity
'
)
});
var
layout
=
this
.
node
.
getLayout
();
...
...
@@ -244,23 +240,19 @@ export default SunburstPiece;
* Get node color
*
* @param {TreeNode} node the node to get color
* @param {module:echarts/model/Series} seriesModel series
* @param {module:echarts/model/Global} ecModel echarts defaults
*/
function
getNodeColor
(
node
,
ecModel
)
{
function
getNodeColor
(
node
,
seriesModel
,
ecModel
)
{
if
(
node
.
depth
===
0
)
{
// Virtual root node
return
'
transparent
'
;
}
else
{
// Use color of the first generation
var
ancestor
=
node
;
var
color
=
ancestor
.
getModel
(
'
itemStyle.normal
'
).
get
(
'
color
'
);
while
(
ancestor
.
parentNode
&&
!
color
)
{
ancestor
=
ancestor
.
parentNode
;
color
=
ancestor
.
getModel
(
'
itemStyle.normal
'
).
get
(
'
color
'
);
}
// Self color or level color
var
color
=
node
.
getModel
(
'
itemStyle.normal
'
).
get
(
'
color
'
);
if
(
!
color
)
{
// First-generation color
color
=
ecModel
.
option
.
color
[
getRootId
(
node
)];
}
...
...
@@ -299,27 +291,38 @@ function isNodeHighlighted(node, activeNode, policy) {
}
}
function
updatePiece
(
piece
,
isHighlight
,
opacity
,
z
)
{
var
sector
=
piece
.
childAt
(
0
);
var
sectorZ
=
z
!=
null
?
z
function
updatePiece
(
node
,
state
)
{
var
isHighlight
=
state
===
'
highlight
'
;
// Update sector
var
itemModel
=
node
.
getModel
(
'
itemStyle.
'
+
state
);
var
itemZ
=
itemModel
.
get
(
'
z
'
);
var
sector
=
node
.
piece
.
childAt
(
0
);
var
sectorZ
=
itemZ
!=
null
?
itemZ
:
(
isHighlight
?
DEFAULT_SECTOR_HIGHLIGHT_Z
:
DEFAULT_SECTOR_Z
);
sector
.
attr
(
'
z
'
,
sectorZ
);
sector
.
animateTo
({
style
:
{
opacity
:
opacity
||
1
opacity
:
itemModel
.
get
(
'
opacity
'
)
||
1
}
});
var
text
=
piece
.
childAt
(
1
);
var
textZ
=
z
!=
null
?
z
// Update text
var
labelModel
=
node
.
getModel
(
'
label.
'
+
state
);
var
labelZ
=
labelModel
.
get
(
'
z
'
);
var
text
=
node
.
piece
.
childAt
(
1
);
var
textZ
=
labelZ
!=
null
?
labelZ
:
(
isHighlight
?
DEFAULT_TEXT_HIGHLIGHT_Z
:
DEFAULT_TEXT_Z
);
text
.
attr
(
'
z
'
,
textZ
);
text
.
animateTo
({
style
:
{
opacity
:
opacity
||
1
},
z
:
textZ
opacity
:
labelModel
.
get
(
'
opacity
'
)
||
1
}
});
}
src/chart/sunburst/SunburstSeries.js
浏览文件 @
c980c6c0
...
...
@@ -101,7 +101,9 @@ export default SeriesModel.extend({
animationEasing
:
'
quadraticInOut
'
,
data
:
[]
data
:
[],
levels
:
[]
},
getViewRoot
:
function
()
{
...
...
test/sunburst.html
浏览文件 @
c980c6c0
...
...
@@ -39,7 +39,11 @@
normal
:
{
opacity
:
0.2
}
}
},
children
:
[{
name
:
'
Jackson
'
,
value
:
2
}]
},
{
name
:
'
Cousin Ben
'
,
value
:
4
...
...
@@ -82,7 +86,7 @@
}
}
},
{
name
:
'
Grandpa
\'
s friend
Mike
'
,
name
:
'
Mike
'
,
children
:
[{
name
:
'
Uncle Dan
'
,
children
:
[{
...
...
@@ -90,18 +94,22 @@
value
:
3
},
{
name
:
'
Cousin Luck
'
,
value
:
4
value
:
4
,
children
:
[{
name
:
'
Nephew
'
,
value
:
2
}]
}]
}]
},
{
name
:
'
Grandpa
\'
s friend
Nancy
'
,
name
:
'
Nancy
'
,
children
:
[{
name
:
'
Uncle
Dan
'
,
name
:
'
Uncle
Nike
'
,
children
:
[{
name
:
'
Cousin
Luc
y
'
,
name
:
'
Cousin
Bett
y
'
,
value
:
1
},
{
name
:
'
Cousin
Luck
'
,
name
:
'
Cousin
Jenny
'
,
value
:
2
}]
}]
...
...
@@ -111,37 +119,81 @@
series
:
{
type
:
'
sunburst
'
,
// highlightPolicy: 'ancestor',
data
:
data
data
:
data
,
radius
:
[
0
,
'
90%
'
],
label
:
{
normal
:
{
rotate
:
'
radial
'
}
},
levels
:
[{
itemStyle
:
{
normal
:
{
opacity
:
1
}
}
},
{
itemStyle
:
{
normal
:
{
opacity
:
0.8
,
color
:
'
#f0f
'
}
},
label
:
{
normal
:
{
opacity
:
0.8
,
formatter
:
'
{a}: {b}
'
}
}
},
{
itemStyle
:
{
normal
:
{
opacity
:
0.6
,
color
:
'
#00f
'
}
},
label
:
{
normal
:
{
opacity
:
0.6
}
}
},
{
itemStyle
:
{
normal
:
{
opacity
:
0.4
}
}
}]
}
});
setTimeout
(
function
()
{
data
.
push
({
name
:
'
Stranger
'
,
children
:
[{
name
:
'
S1
'
,
value
:
4
},
{
name
:
'
S2
'
,
value
:
1
}]
});
chart
.
setOption
({
series
:
{
data
:
data
}
});
},
3000
);
//
setTimeout(function () {
//
data.push({
//
name: 'Stranger',
//
children: [{
//
name: 'S1',
//
value: 4
//
}, {
//
name: 'S2',
//
value: 1
//
}]
//
});
//
chart.setOption({
//
series: {
//
data: data
//
}
//
});
//
}, 3000);
setTimeout
(
function
()
{
data
.
splice
(
1
,
1
);
data
[
0
].
value
=
32
;
chart
.
setOption
({
series
:
{
data
:
data
}
});
},
6000
);
//
setTimeout(function () {
//
data.splice(1, 1);
//
data[0].value = 32;
//
chart.setOption({
//
series: {
//
data: data
//
}
//
});
//
}, 6000);
});
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录