Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
半栈学徒
incubator-echarts
提交
0089d9b2
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,发现更多精彩内容 >>
提交
0089d9b2
编写于
6月 07, 2020
作者:
P
pissang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat(label): optimize label auto layout when aligned horizontally or vertically
上级
ca57e803
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
37 addition
and
29 deletion
+37
-29
src/label/labelLayoutHelper.ts
src/label/labelLayoutHelper.ts
+32
-27
test/label-layout.html
test/label-layout.html
+5
-2
未找到文件。
src/label/labelLayoutHelper.ts
浏览文件 @
0089d9b2
...
...
@@ -64,8 +64,7 @@ export function prepareLayoutList(input: LabelLayoutListPrepareInput[]): LabelLa
const
localRect
=
label
.
getBoundingRect
();
const
isAxisAligned
=
!
transform
||
(
transform
[
1
]
<
1
e
-
5
&&
transform
[
2
]
<
1
e
-
5
);
// Text has a default 1px stroke. Exclude this.
const
minMargin
=
(
layoutOption
.
minMargin
||
0
)
+
2.2
;
const
minMargin
=
layoutOption
.
minMargin
||
0
;
const
globalRect
=
localRect
.
clone
();
globalRect
.
applyTransform
(
transform
);
globalRect
.
x
-=
minMargin
/
2
;
...
...
@@ -98,14 +97,31 @@ function shiftLayout(
minBound
:
number
,
maxBound
:
number
)
{
if
(
!
list
.
length
)
{
const
len
=
list
.
length
;
if
(
!
len
)
{
return
;
}
list
.
sort
(
function
(
a
,
b
)
{
return
a
.
label
[
xyDim
]
-
b
.
label
[
xyDim
];
return
a
.
rect
[
xyDim
]
-
b
.
rect
[
xyDim
];
});
let
lastPos
=
0
;
let
delta
;
for
(
let
i
=
0
;
i
<
len
;
i
++
)
{
delta
=
list
[
i
].
rect
[
xyDim
]
-
lastPos
;
if
(
delta
<
0
)
{
shiftForward
(
i
,
len
,
-
delta
);
}
lastPos
=
list
[
i
].
rect
[
xyDim
]
+
list
[
i
].
rect
[
sizeDim
];
}
// TODO bleedMargin?
if
(
maxBound
<
lastPos
)
{
shiftBackward
(
len
-
1
,
lastPos
-
maxBound
);
}
function
shiftForward
(
start
:
number
,
end
:
number
,
delta
:
number
)
{
for
(
let
j
=
start
;
j
<
end
;
j
++
)
{
list
[
j
].
label
[
xyDim
]
+=
delta
;
...
...
@@ -113,10 +129,8 @@ function shiftLayout(
const
rect
=
list
[
j
].
rect
;
rect
[
xyDim
]
+=
delta
;
if
(
j
>
start
&&
j
+
1
<
end
&&
list
[
j
+
1
].
rect
[
xyDim
]
>
rect
[
xyDim
]
+
rect
[
sizeDim
]
)
{
// Shift up so it can be more equaly distributed.
if
(
j
>
start
&&
j
+
1
<
end
&&
!
list
[
j
+
1
].
rect
.
intersect
(
rect
))
{
// Shift the following so it can be more equaly distributed.
shiftBackward
(
j
,
delta
/
2
);
return
;
}
...
...
@@ -127,9 +141,8 @@ function shiftLayout(
function
shiftBackward
(
end
:
number
,
delta
:
number
)
{
for
(
let
j
=
end
;
j
>=
0
;
j
--
)
{
list
[
j
].
label
[
xyDim
]
-=
delta
;
const
rect
=
list
[
j
].
rect
;
list
[
j
].
label
[
xyDim
]
-=
delta
;
rect
[
xyDim
]
-=
delta
;
// const textSize = rect[sizeDim];
...
...
@@ -139,26 +152,11 @@ function shiftLayout(
list
[
j
].
label
[
xyDim
]
-=
diffToMinBound
;
}
if
(
j
>
0
&&
rect
[
xyDim
]
>
list
[
j
-
1
].
rect
[
xyDim
]
+
list
[
j
-
1
].
rect
[
sizeDim
]
)
{
if
(
j
>
0
&&
!
rect
.
intersect
(
list
[
j
-
1
].
rect
))
{
break
;
}
}
}
let
lastPos
=
0
;
let
delta
;
const
len
=
list
.
length
;
for
(
let
i
=
0
;
i
<
len
;
i
++
)
{
delta
=
list
[
i
].
label
[
xyDim
]
-
lastPos
;
if
(
delta
<
0
)
{
shiftForward
(
i
,
len
,
-
delta
);
}
lastPos
=
list
[
i
].
label
[
xyDim
]
+
list
[
i
].
rect
[
sizeDim
];
}
if
(
maxBound
-
lastPos
<
0
)
{
shiftBackward
(
len
-
1
,
lastPos
-
maxBound
);
}
}
/**
...
...
@@ -191,14 +189,21 @@ export function hideOverlap(labelList: LabelLayoutInfo[]) {
return
b
.
priority
-
a
.
priority
;
});
const
globalRect
=
new
BoundingRect
(
0
,
0
,
0
,
0
);
for
(
let
i
=
0
;
i
<
labelList
.
length
;
i
++
)
{
const
labelItem
=
labelList
[
i
];
const
globalRect
=
labelItem
.
rect
;
const
isAxisAligned
=
labelItem
.
axisAligned
;
const
localRect
=
labelItem
.
localRect
;
const
transform
=
labelItem
.
transform
;
const
label
=
labelItem
.
label
;
const
labelLine
=
labelItem
.
labelLine
;
globalRect
.
copy
(
labelItem
.
rect
);
// Add a threshold because layout may be aligned precisely.
globalRect
.
width
-=
0.1
;
globalRect
.
height
-=
0.1
;
globalRect
.
x
+=
0.05
;
globalRect
.
y
+=
0.05
;
let
obb
=
labelItem
.
obb
;
let
overlapped
=
false
;
...
...
test/label-layout.html
浏览文件 @
0089d9b2
...
...
@@ -413,11 +413,15 @@ under the License.
];
option
=
{
xAxis
:
{},
xAxis
:
{
splitLine
:
{
show
:
false
}
},
yAxis
:
{
splitLine
:
{
show
:
false
},
scale
:
true
},
grid
:
{
left
:
100
,
width
:
300
},
series
:
[{
...
...
@@ -430,7 +434,6 @@ under the License.
labelLayout
:
{
x
:
500
,
draggable
:
true
,
align
:
'
center
'
,
moveOverlap
:
'
shift-y
'
,
// hideOverlap: true,
minMargin
:
2
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录