Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
x649585723
incubator-echarts
提交
d8ebb5fd
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,发现更多精彩内容 >>
提交
d8ebb5fd
编写于
4月 06, 2021
作者:
1
100pah
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix: [geo] svg fix converter and add test case.
上级
dfb58adc
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
106 addition
and
9 deletion
+106
-9
src/coord/geo/Geo.ts
src/coord/geo/Geo.ts
+1
-1
src/coord/geo/Region.ts
src/coord/geo/Region.ts
+3
-3
test/geo-svg.html
test/geo-svg.html
+102
-5
未找到文件。
src/coord/geo/Geo.ts
浏览文件 @
d8ebb5fd
...
...
@@ -56,7 +56,7 @@ class Geo extends View {
readonly
resourceType
:
GeoResource
[
'
type
'
];
// Only store specified name coord via `addGeoCoord`.
private
_nameCoordMap
:
zrUtil
.
HashMap
<
number
[]
>
;
private
_nameCoordMap
:
zrUtil
.
HashMap
<
number
[]
>
=
zrUtil
.
createHashMap
<
number
[],
string
>
()
;
private
_regionsMap
:
zrUtil
.
HashMap
<
Region
>
;
private
_invertLongitute
:
boolean
;
readonly
regions
:
Region
[];
...
...
src/coord/geo/Region.ts
浏览文件 @
d8ebb5fd
...
...
@@ -42,7 +42,7 @@ export class Region {
/**
* Get center point in data unit. That is,
* for GeoJSONRegion, the unit is lat/lng,
* for GeoSVGRegion, the unit is
pixel but based on root
.
* for GeoSVGRegion, the unit is
SVG local coord
.
*/
getCenter
():
number
[]
{
return
;
...
...
@@ -239,8 +239,8 @@ export class GeoSVGRegion extends Region {
const
el
=
this
.
_elOnlyForCalculate
;
const
rect
=
el
.
getBoundingRect
();
const
center
=
[
rect
.
x
+
rect
.
width
,
rect
.
y
+
rect
.
height
rect
.
x
+
rect
.
width
/
2
,
rect
.
y
+
rect
.
height
/
2
];
const
mat
=
matrix
.
identity
(
TMP_TRANSFORM
);
...
...
test/geo-svg.html
浏览文件 @
d8ebb5fd
...
...
@@ -39,6 +39,7 @@ under the License.
<div
id=
"main_simple_geo_json"
></div>
<div
id=
"main_simple_geo_svg"
></div>
<div
id=
"main_simple_geo_svg_coord"
></div>
<div
id=
"main_geo_json_focus_blur"
></div>
<div
id=
"main_geo_svg_emphasis_select"
></div>
<div
id=
"main_pure_geo_svg"
></div>
...
...
@@ -174,14 +175,13 @@ under the License.
// layoutCenter: ['30%', 40],
// layoutSize: 40,
// boundingCoords
zoom
:
1
,
aspectScale
:
1
//
zoom: 1,
//
aspectScale: 1
}
};
var
chart
=
testHelper
.
create
(
echarts
,
'
main_simple_geo_svg
'
,
{
title
:
[
'
simple geo geoSVG location:
'
,
'
Should be a square and 80% of canvas height.
'
,
'
At the center of the canvas.
'
],
...
...
@@ -202,6 +202,101 @@ under the License.
<script>
require
([
'
echarts
'
/*, 'map/js/china' */
],
function
(
echarts
)
{
const
svg
=
[
'
<?xml version="1.0" encoding="utf-8"?>
'
,
'
<svg xmlns="http://www.w3.org/2000/svg" xmlns:ooo="http://xml.openoffice.org/svg/export" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.2" fill-rule="evenodd" xml:space="preserve">
'
,
'
<path name="left_rect" d="M 0,0 L 0,100 100,100 100,0 Z" fill="#765" stroke="rgb(56,93,138)" stroke-width="0" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
'
<path name="right_rect" d="M 150,0 L 150,100 250,100 250,0 Z" fill="#567" stroke="rgb(56,93,138)" stroke-width="0" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
'
</svg>
'
].
join
(
''
)
echarts
.
registerMap
(
'
testGeoSVG_coord
'
,
{
svg
:
svg
});
option
=
{
animation
:
false
,
tooltip
:
{
},
geo
:
{
map
:
'
testGeoSVG_coord
'
,
roam
:
true
,
top
:
0
,
bottom
:
0
,
left
:
0
,
right
:
0
,
},
series
:
[{
type
:
'
scatter
'
,
geoIndex
:
0
,
coordinateSystem
:
'
geo
'
,
symbolSize
:
30
,
data
:
[{
value
:
[
200
,
50
],
itemStyle
:
{
color
:
'
blue
'
}
}]
}]
};
var
chart
=
testHelper
.
create
(
echarts
,
'
main_simple_geo_svg_coord
'
,
{
title
:
[
'
A **blue circle** should be in the center of the right rect.
'
,
'
**Click** inside the rect or outside the rect.
'
,
'
Check SVG coord displayed (via convertFromPixel).
'
,
'
(The left rect is 100*100 and left-top corner is (0,0))
'
,
'
**Click btn1**, check Pixel.point[1] should be around 100
'
,
'
**Click btn2**, check Pixel.point[1] should be around 200
'
],
option
:
option
,
infoKey
:
'
SVG coord
'
,
info
:
{},
height
:
200
,
buttons
:
[{
text
:
'
converToPixel({ geoIndex: 0 }, "left_rect")
'
,
onclick
:
function
()
{
var
point
=
chart
.
convertToPixel
({
geoIndex
:
0
},
'
left_rect
'
);
console
.
log
(
point
);
chart
.
__testHelper
.
updateInfo
(
{
point
:
point
},
'
Pixel
'
);
}
},
{
text
:
'
convertToPixel({ geoIndex: 0 }, [100, 100])
'
,
onclick
:
function
()
{
var
point
=
chart
.
convertToPixel
({
geoIndex
:
0
},
[
100
,
100
]);
console
.
log
(
point
);
chart
.
__testHelper
.
updateInfo
(
{
point
:
point
},
'
Pixel
'
);
}
}]
});
if
(
chart
)
{
chart
.
getZr
().
on
(
'
click
'
,
function
(
event
)
{
var
x
=
event
.
offsetX
;
var
y
=
event
.
offsetY
;
console
.
log
(
x
,
y
);
var
svgCoord
=
chart
.
convertFromPixel
({
geoIndex
:
0
},
[
x
,
y
]);
console
.
log
(
svgCoord
);
chart
.
__testHelper
.
updateInfo
(
{
x
:
svgCoord
[
0
],
y
:
svgCoord
[
1
]
},
'
SVG coord
'
);
});
}
});
</script>
<script>
require
([
'
echarts
'
/*, 'map/js/china' */
],
function
(
echarts
)
{
...
...
@@ -263,6 +358,7 @@ under the License.
var
chart
=
testHelper
.
create
(
echarts
,
'
main_geo_json_focus_blur
'
,
{
title
:
[
'
check geoJSON focus-blur
'
,
'
**Click** them, check click info
'
],
option
:
option
,
info
:
{},
...
...
@@ -285,7 +381,7 @@ under the License.
const
svg
=
[
'
<?xml version="1.0" encoding="utf-8"?>
'
,
'
<svg xmlns="http://www.w3.org/2000/svg" xmlns:ooo="http://xml.openoffice.org/svg/export" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.2" fill-rule="evenodd" xml:space="preserve">
'
,
'
<path name="a" d="M 0,0 L 0,100 100,100 100,0 Z" fill="rgb(16,193,138)" stroke="green" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
'
<path name="a" d="M 0,0 L 0,100 100,100 100,0 Z"
transform="rotate(45)"
fill="rgb(16,193,138)" stroke="green" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
'
<path name="a" d="M 110,0 L 110,100 210,100 210,0 Z" fill="rgb(16,193,138)" stroke="green" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
'
<g name="b">
'
,
'
<path d="M 0,110 L 0,210 100,110 Z" fill="rgb(16,193,138)" stroke="green" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"/>
'
,
...
...
@@ -342,7 +438,8 @@ under the License.
title
:
[
'
click buttons
'
,
'
hover check
'
,
'
check focus-blur
'
'
check focus-blur
'
,
'
check label no scale/rotate
'
],
option
:
option
,
info
:
{},
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录