Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
x649585723
incubator-echarts
提交
0da06d8f
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,体验更适合开发者的 AI 搜索 >>
提交
0da06d8f
编写于
7月 26, 2017
作者:
P
pah100
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
tweak tooltip confine.
上级
dae94c92
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
90 addition
and
4 deletion
+90
-4
src/component/tooltip/TooltipView.js
src/component/tooltip/TooltipView.js
+25
-4
test/tooltip.html
test/tooltip.html
+65
-0
未找到文件。
src/component/tooltip/TooltipView.js
浏览文件 @
0da06d8f
...
...
@@ -699,8 +699,9 @@ define(function (require) {
}
function
refixTooltipPosition
(
x
,
y
,
el
,
viewWidth
,
viewHeight
,
gapH
,
gapV
)
{
var
width
=
el
.
offsetWidth
;
var
height
=
el
.
offsetHeight
;
var
size
=
getOuterSize
(
el
);
var
width
=
size
.
width
;
var
height
=
size
.
height
;
if
(
gapH
!=
null
)
{
if
(
x
+
width
+
gapH
>
viewWidth
)
{
...
...
@@ -722,8 +723,9 @@ define(function (require) {
}
function
confineTooltipPosition
(
x
,
y
,
el
,
viewWidth
,
viewHeight
)
{
var
width
=
el
.
clientWidth
;
var
height
=
el
.
clientHeight
;
var
size
=
getOuterSize
(
el
);
var
width
=
size
.
width
;
var
height
=
size
.
height
;
x
=
Math
.
min
(
x
+
width
,
viewWidth
)
-
width
;
y
=
Math
.
min
(
y
+
height
,
viewHeight
)
-
height
;
...
...
@@ -733,6 +735,25 @@ define(function (require) {
return
[
x
,
y
];
}
function
getOuterSize
(
el
)
{
var
width
=
el
.
clientWidth
;
var
height
=
el
.
clientHeight
;
// Consider browser compatibility.
// IE8 does not support getComputedStyle.
if
(
document
.
defaultView
.
getComputedStyle
)
{
var
stl
=
document
.
defaultView
.
getComputedStyle
(
el
);
if
(
stl
)
{
width
+=
parseInt
(
stl
.
paddingLeft
,
10
)
+
parseInt
(
stl
.
paddingRight
,
10
)
+
parseInt
(
stl
.
borderLeftWidth
,
10
)
+
parseInt
(
stl
.
borderRightWidth
,
10
);
height
+=
parseInt
(
stl
.
paddingTop
,
10
)
+
parseInt
(
stl
.
paddingBottom
,
10
)
+
parseInt
(
stl
.
borderTopWidth
,
10
)
+
parseInt
(
stl
.
borderBottomWidth
,
10
);
}
}
return
{
width
:
width
,
height
:
height
};
}
function
calcTooltipPosition
(
position
,
rect
,
contentSize
)
{
var
domWidth
=
contentSize
[
0
];
var
domHeight
=
contentSize
[
1
];
...
...
test/tooltip.html
浏览文件 @
0da06d8f
...
...
@@ -38,6 +38,8 @@
<div
class=
"chart"
id=
"main"
></div>
<h1>
set position
</h1>
<div
class=
"chart"
id=
"position"
></div>
<h1>
confine
</h1>
<div
class=
"chart"
id=
"confine"
></div>
<h1>
triggerOn click
</h1>
<div
class=
"chart"
id=
"click"
></div>
<h1>
dispatchAciton manually with `position` specified (postion: [10,10])
</h1>
...
...
@@ -602,6 +604,69 @@
<script>
require
([
'
echarts
'
,
'
echarts/chart/pie
'
,
'
echarts/component/legend
'
,
'
echarts/component/grid
'
,
'
echarts/component/tooltip
'
,
'
zrender/vml/vml
'
],
function
(
echarts
)
{
var
option
=
{
tooltip
:
{
confine
:
true
,
borderWidth
:
10
,
borderColor
:
'
green
'
,
padding
:
20
,
formatter
:
"
{a} <br/>{b} : {c} ({d}%)
"
},
series
:
{
name
:
'
访问来源
'
,
type
:
'
pie
'
,
radius
:
1180
,
data
:[
{
value
:
335
,
name
:
'
position: [300, 100]
'
,
},
{
value
:
310
,
name
:
'
position: function [p[0] + 10, p[1] - 50]
'
,
},
{
value
:
234
,
name
:
'
position: inside
'
,
},
{
value
:
135
,
name
:
'
align: right; verticalAlign: bottom
'
,
tooltip
:
{
align
:
'
right
'
,
verticalAlign
:
'
bottom
'
}
},
{
value
:
548
,
name
:
'
position: [30, 140], verticalAlign: bottom
'
,
}
],
itemStyle
:
{
emphasis
:
{
shadowBlur
:
10
,
shadowOffsetX
:
0
,
shadowColor
:
'
rgba(0, 0, 0, 0.5)
'
}
}
}
};
createChart
(
'
confine
'
,
echarts
,
option
,
500
);
})
</script>
<script>
require
([
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录