Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
ml065787
echarts
提交
565535fc
E
echarts
项目概览
ml065787
/
echarts
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
E
echarts
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
565535fc
编写于
5月 27, 2020
作者:
1
100pah
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
compat: compat `barBorderColor` `barBorderWidth` `barBorderRadius`.
上级
670ae045
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
141 addition
and
15 deletion
+141
-15
src/chart/bar/BarSeries.ts
src/chart/bar/BarSeries.ts
+6
-4
src/chart/bar/BarView.ts
src/chart/bar/BarView.ts
+13
-10
src/chart/bar/barItemStyle.ts
src/chart/bar/barItemStyle.ts
+121
-0
src/model/mixin/itemStyle.ts
src/model/mixin/itemStyle.ts
+1
-1
未找到文件。
src/chart/bar/BarSeries.ts
浏览文件 @
565535fc
...
...
@@ -19,7 +19,7 @@
import
BaseBarSeriesModel
,
{
BaseBarSeriesOption
}
from
'
./BaseBarSeries
'
;
import
SeriesModel
from
'
../../model/Series
'
;
import
{
ItemStyleOption
,
OptionDataValue
,
LabelOption
,
SeriesStackOptionMixin
}
from
'
../../util/types
'
;
import
{
ItemStyleOption
,
OptionDataValue
,
LabelOption
,
SeriesStackOptionMixin
,
ZRColor
}
from
'
../../util/types
'
;
import
type
Cartesian2D
from
'
../../coord/cartesian/Cartesian2D
'
;
import
type
Polar
from
'
../../coord/polar/Polar
'
;
import
{
inheritDefaultOption
}
from
'
../../util/component
'
;
...
...
@@ -29,10 +29,12 @@ import { BrushCommonSelectorsForSeries } from '../../component/brush/selector';
type
BarDataValue
=
OptionDataValue
|
OptionDataValue
[];
export
interface
BarItemStyleOption
extends
ItemStyleOption
{
/
**
* Border radius is not supported for bar on polar
*/
/
/ Border radius is not supported for bar on polar
borderRadius
?:
number
|
number
[]
// Compat. See `src/chart/bar/barItemStyle`.
barBorderRadius
?:
number
|
number
[]
barBorderColor
?:
ItemStyleOption
[
'
borderColor
'
]
barBorderWidth
?:
ItemStyleOption
[
'
borderWidth
'
]
}
export
interface
BarDataItemOption
{
name
?:
string
...
...
src/chart/bar/BarView.ts
浏览文件 @
565535fc
...
...
@@ -46,8 +46,11 @@ import type { RectLike } from 'zrender/src/core/BoundingRect';
import
type
Model
from
'
../../model/Model
'
;
import
{
isCoordinateSystemType
}
from
'
../../coord/CoordinateSystem
'
;
import
{
getDefaultLabel
}
from
'
../helper/labelHelper
'
;
import
{
getBarItemStyle
,
fixBarItemStyle
,
getBarItemModelBorderWidth
,
getBarBorderColor
,
getBarBorderRadius
,
getBarItemModelBorderRadius
}
from
'
./barItemStyle
'
;
const
BAR_BORDER_WIDTH_QUERY
=
[
'
itemStyle
'
,
'
borderWidth
'
]
as
const
;
const
_eventPos
=
[
0
,
0
];
const
mathMax
=
Math
.
max
;
...
...
@@ -166,7 +169,7 @@ class BarView extends ChartView {
const
drawBackground
=
seriesModel
.
get
(
'
showBackground
'
,
true
);
const
backgroundModel
=
seriesModel
.
getModel
(
'
backgroundStyle
'
);
const
barBorderRadius
=
backgroundModel
.
get
(
'
barBorderRadius
'
)
||
0
;
const
barBorderRadius
=
getBarBorderRadius
(
backgroundModel
)
||
0
;
const
bgEls
:
BarView
[
'
_backgroundEls
'
]
=
[];
const
oldBgEls
=
this
.
_backgroundEls
;
...
...
@@ -179,7 +182,7 @@ class BarView extends ChartView {
if
(
drawBackground
)
{
const
bgLayout
=
getLayout
[
coord
.
type
](
data
,
dataIndex
);
const
bgEl
=
createBackgroundEl
(
coord
,
isHorizontalOrRadial
,
bgLayout
);
bgEl
.
useStyle
(
backgroundModel
.
getItemStyle
(
));
bgEl
.
useStyle
(
getBarItemStyle
(
backgroundModel
));
// Only cartesian2d support borderRadius.
if
(
coord
.
type
===
'
cartesian2d
'
)
{
(
bgEl
as
Rect
).
setShape
(
'
r
'
,
barBorderRadius
);
...
...
@@ -219,7 +222,7 @@ class BarView extends ChartView {
if
(
drawBackground
)
{
const
bgEl
=
oldBgEls
[
oldIndex
];
bgEl
.
useStyle
(
backgroundModel
.
getItemStyle
(
));
bgEl
.
useStyle
(
getBarItemStyle
(
backgroundModel
));
// Only cartesian2d support borderRadius.
if
(
coord
.
type
===
'
cartesian2d
'
)
{
(
bgEl
as
Rect
).
setShape
(
'
r
'
,
barBorderRadius
);
...
...
@@ -553,13 +556,13 @@ function updateStyle(
isPolar
:
boolean
)
{
const
style
=
data
.
getItemVisual
(
dataIndex
,
'
style
'
);
const
hoverStyle
=
itemModel
.
getModel
([
'
emphasis
'
,
'
itemStyle
'
]).
getItemStyle
(
);
const
hoverStyle
=
getBarItemStyle
(
itemModel
.
getModel
([
'
emphasis
'
,
'
itemStyle
'
])
);
if
(
!
isPolar
)
{
(
el
as
Rect
).
setShape
(
'
r
'
,
itemModel
.
get
([
'
itemStyle
'
,
'
barBorderRadius
'
]
)
||
0
);
(
el
as
Rect
).
setShape
(
'
r
'
,
getBarItemModelBorderRadius
(
itemModel
)
||
0
);
}
el
.
useStyle
(
style
);
el
.
useStyle
(
fixBarItemStyle
(
itemModel
,
style
)
);
el
.
ignore
=
isZeroOnPolar
(
layout
as
SectorLayout
);
...
...
@@ -595,7 +598,7 @@ function getLineWidth(
itemModel
:
Model
<
BarSeriesOption
>
,
rawLayout
:
RectLayout
)
{
const
lineWidth
=
itemModel
.
get
(
BAR_BORDER_WIDTH_QUERY
)
||
0
;
const
lineWidth
=
getBarItemModelBorderWidth
(
itemModel
)
||
0
;
// width or height may be NaN for empty data
const
width
=
isNaN
(
rawLayout
.
width
)
?
Number
.
MAX_VALUE
:
Math
.
abs
(
rawLayout
.
width
);
const
height
=
isNaN
(
rawLayout
.
height
)
?
Number
.
MAX_VALUE
:
Math
.
abs
(
rawLayout
.
height
);
...
...
@@ -757,8 +760,8 @@ function setLargeBackgroundStyle(
backgroundModel
:
Model
<
BarSeriesOption
[
'
backgroundStyle
'
]
>
,
data
:
List
)
{
const
borderColor
=
backgroundModel
.
get
(
'
borderColor
'
)
||
backgroundModel
.
get
(
'
color
'
);
const
itemStyle
=
backgroundModel
.
getItemStyle
([
'
color
'
,
'
borderColor
'
]
);
const
borderColor
=
getBarBorderColor
(
backgroundModel
)
||
backgroundModel
.
get
(
'
color
'
);
const
itemStyle
=
getBarItemStyle
(
backgroundModel
);
el
.
useStyle
(
itemStyle
);
el
.
style
.
fill
=
null
;
...
...
src/chart/bar/barItemStyle.ts
0 → 100644
浏览文件 @
565535fc
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import
makeStyleMapper
from
'
../../model/mixin/makeStyleMapper
'
;
import
*
as
zrUtil
from
'
zrender/src/core/util
'
;
import
Model
from
'
../../model/Model
'
;
import
{
ItemStyleOption
,
Dictionary
}
from
'
../../util/types
'
;
import
{
PathStyleProps
}
from
'
zrender/src/graphic/Path
'
;
import
{
BarDataItemOption
,
BarItemStyleOption
}
from
'
./BarSeries
'
;
const
ITEM_STYLE_BAR_BORDER_COLOR
=
[
'
itemStyle
'
,
'
barBorderColor
'
]
as
const
;
const
ITEM_STYLE_BAR_BORDER_WIDTH
=
[
'
itemStyle
'
,
'
barBorderWidth
'
]
as
const
;
const
ITEM_STYLE_BORDER_WIDTH
=
[
'
itemStyle
'
,
'
borderWidth
'
]
as
const
;
const
ITEM_STYLE_BAR_BORDER_RADIUS
=
[
'
itemStyle
'
,
'
barBorderRadius
'
]
as
const
;
const
ITEM_STYLE_BORDER_RADIUS
=
[
'
itemStyle
'
,
'
borderRadius
'
]
as
const
;
const
getBarItemStyleInner
=
makeStyleMapper
(
[
[
'
fill
'
,
'
color
'
],
[
'
stroke
'
,
'
borderColor
'
],
[
'
lineWidth
'
,
'
borderWidth
'
],
// Previously echarts2 use 'barBorderXxx' to distinguish
// with `borderXxx` for "magic type" feature. That seams
// not a neat strategy. We should better unify the name
// of those props to `borderXxx` rather than `barBorderXxx`.
// But the echarts-doc has been describing it as `barBorderXxx`
// until echarts4. So we still compat that settings to reduce
// the break change.
[
'
stroke
'
,
'
barBorderColor
'
],
[
'
lineWidth
'
,
'
barBorderWidth
'
],
[
'
opacity
'
],
[
'
shadowBlur
'
],
[
'
shadowOffsetX
'
],
[
'
shadowOffsetY
'
],
[
'
shadowColor
'
]
]
);
export
function
getBarItemStyle
(
model
:
Model
,
excludes
?:
readonly
(
keyof
ItemStyleOption
)[]
)
{
const
style
=
getBarItemStyleInner
(
model
,
excludes
);
if
(
model
.
getBorderLineDash
)
{
const
lineDash
=
model
.
getBorderLineDash
();
lineDash
&&
(
style
.
lineDash
=
lineDash
);
}
return
style
;
}
/**
* If has `barBorderColor` or `barBorderWidth`, return a new style.
* Otherwise return the input style.
*/
export
function
fixBarItemStyle
(
itemModel
:
Model
<
BarDataItemOption
>
,
style
:
PathStyleProps
):
PathStyleProps
{
const
barBorderColor
=
itemModel
.
get
(
ITEM_STYLE_BAR_BORDER_COLOR
);
const
barBorderWidth
=
itemModel
.
get
(
ITEM_STYLE_BAR_BORDER_WIDTH
);
let
newProps
:
Dictionary
<
unknown
>
;
if
(
barBorderColor
!=
null
)
{
newProps
=
newProps
||
{};
newProps
.
barBorderColor
=
barBorderColor
;
}
if
(
barBorderWidth
!=
null
)
{
newProps
=
newProps
||
{};
newProps
.
barBorderColor
=
barBorderWidth
;
}
if
(
newProps
)
{
style
=
zrUtil
.
createObject
(
style
,
newProps
);
}
return
style
;
}
export
function
getBarBorderColor
(
styleModel
:
Model
<
BarItemStyleOption
>
):
BarItemStyleOption
[
'
borderColor
'
]
{
return
zrUtil
.
retrieve2
(
styleModel
.
get
(
'
borderColor
'
),
styleModel
.
get
(
'
barBorderColor
'
)
);
}
export
function
getBarBorderRadius
(
styleModel
:
Model
<
BarItemStyleOption
>
):
BarItemStyleOption
[
'
borderRadius
'
]
{
return
zrUtil
.
retrieve2
(
styleModel
.
get
(
'
borderRadius
'
),
styleModel
.
get
(
'
barBorderRadius
'
)
);
}
export
function
getBarItemModelBorderWidth
(
itemModel
:
Model
<
BarDataItemOption
>
):
BarItemStyleOption
[
'
borderWidth
'
]
{
return
zrUtil
.
retrieve2
(
itemModel
.
get
(
ITEM_STYLE_BORDER_WIDTH
),
itemModel
.
get
(
ITEM_STYLE_BAR_BORDER_WIDTH
)
);
}
export
function
getBarItemModelBorderRadius
(
itemModel
:
Model
<
BarDataItemOption
>
):
BarItemStyleOption
[
'
borderRadius
'
]
{
return
zrUtil
.
retrieve2
(
itemModel
.
get
(
ITEM_STYLE_BORDER_RADIUS
),
itemModel
.
get
(
ITEM_STYLE_BAR_BORDER_RADIUS
)
);
}
src/model/mixin/itemStyle.ts
浏览文件 @
565535fc
...
...
@@ -55,7 +55,7 @@ class ItemStyleMixin {
):
ItemStyleProps
{
const
style
=
getItemStyle
(
this
,
excludes
,
includes
);
const
lineDash
=
this
.
getBorderLineDash
();
lineDash
&&
(
(
style
as
any
)
.
lineDash
=
lineDash
);
lineDash
&&
(
style
.
lineDash
=
lineDash
);
return
style
;
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录