You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by wa...@apache.org on 2022/11/06 16:43:08 UTC
[echarts] branch fix-heatmap created (now 0f86a100b)
This is an automated email from the ASF dual-hosted git repository.
wangzx pushed a change to branch fix-heatmap
in repository https://gitbox.apache.org/repos/asf/echarts.git
at 0f86a100b fix(heatmap): fix heatmap label may overlap when the dataZoom is enabled
This branch includes the following new commits:
new 0f86a100b fix(heatmap): fix heatmap label may overlap when the dataZoom is enabled
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[echarts] 01/01: fix(heatmap): fix heatmap label may overlap when the dataZoom is enabled
Posted by wa...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
wangzx pushed a commit to branch fix-heatmap
in repository https://gitbox.apache.org/repos/asf/echarts.git
commit 0f86a100b838fc19ade0962cef6cd5591a8013a2
Author: plainheart <yh...@all-my-life.cn>
AuthorDate: Mon Nov 7 00:37:07 2022 +0800
fix(heatmap): fix heatmap label may overlap when the dataZoom is enabled
---
src/chart/heatmap/HeatmapView.ts | 8 ++-
test/heatmap.html | 112 ++++++++++++++++++++++++++++++++++++-
test/runTest/actions/__meta__.json | 2 +-
test/runTest/actions/heatmap.json | 2 +-
4 files changed, 118 insertions(+), 6 deletions(-)
diff --git a/src/chart/heatmap/HeatmapView.ts b/src/chart/heatmap/HeatmapView.ts
index 88933e278..d0de889ba 100644
--- a/src/chart/heatmap/HeatmapView.ts
+++ b/src/chart/heatmap/HeatmapView.ts
@@ -33,7 +33,7 @@ import { StageHandlerProgressParams, Dictionary, OptionDataValue } from '../../u
import type Cartesian2D from '../../coord/cartesian/Cartesian2D';
import type Calendar from '../../coord/calendar/Calendar';
import { setLabelStyle, getLabelStatesModels } from '../../label/labelStyle';
-import Element from 'zrender/src/Element';
+import type Element from 'zrender/src/Element';
// Coord can be 'geo' 'bmap' 'amap' 'leaflet'...
interface GeoLikeCoordSys extends CoordinateSystem {
@@ -94,7 +94,7 @@ function getIsInContinuousRange(dataExtent: number[], range: number[]) {
function isGeoCoordSys(coordSys: CoordinateSystem): coordSys is GeoLikeCoordSys {
const dimensions = coordSys.dimensions;
- // Not use coorSys.type === 'geo' because coordSys maybe extended
+ // Not use coordSys.type === 'geo' because coordSys maybe extended
return dimensions[0] === 'lng' && dimensions[1] === 'lat';
}
@@ -235,6 +235,8 @@ class HeatmapView extends ChartView {
// Ignore empty data and out of extent data
if (isNaN(data.get(dataDims[2], idx) as number)
+ || isNaN(dataDimX as number)
+ || isNaN(dataDimY as number)
|| dataDimX < xAxisExtent[0]
|| dataDimX > xAxisExtent[1]
|| dataDimY < yAxisExtent[0]
@@ -271,7 +273,7 @@ class HeatmapView extends ChartView {
});
}
- // Optimization for large datset
+ // Optimization for large dataset
if (data.hasItemOption) {
const itemModel = data.getItemModel<HeatmapDataItemOption>(idx);
const emphasisModel = itemModel.getModel('emphasis');
diff --git a/test/heatmap.html b/test/heatmap.html
index 36276aad4..a4cacdecd 100644
--- a/test/heatmap.html
+++ b/test/heatmap.html
@@ -23,6 +23,8 @@ under the License.
<meta charset="utf-8">
<script src="lib/simpleRequire.js"></script>
<script src="lib/config.js"></script>
+ <script src="lib/testHelper.js"></script>
+ <link rel="stylesheet" href="lib/reset.css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
@@ -39,6 +41,7 @@ under the License.
</style>
<div id="main"></div>
<div id="main2"></div>
+ <div id="main3"></div>
<script>
require([
@@ -162,6 +165,113 @@ under the License.
});
</script>
+
+ <script>
+ require(['echarts'], function (echarts) {
+ var data = [[0, 0, 5], [0, 1, 1], [0, 2, 0], [0, 3, 0], [0, 4, 0], [0, 5, 0], [0, 6, 0], [0, 7, 0], [0, 8, 0], [0, 9, 0], [0, 10, 0], [0, 11, 2], [0, 12, 4], [0, 13, 1], [0, 14, 1], [0, 15, 3], [0, 16, 4], [0, 17, 6], [0, 18, 4], [0, 19, 4], [0, 20, 3], [0, 21, 3], [0, 22, 2], [0, 23, 5], [1, 0, 7], [1, 1, 0], [1, 2, 0], [1, 3, 0], [1, 4, 0], [1, 5, 0], [1, 6, 0], [1, 7, 0], [1, 8, 0], [1, 9, 0], [1, 10, 5], [1, 11, 2], [1, 12, 2], [1, 13, 6], [1, 14, 9], [1, 15, 11], [1, 16, [...]
+ .map(function (item) {
+ return [item[1], item[0], item[2] || '-'];
+ });
+ var hours = [
+ '12a',
+ '1a',
+ '2a',
+ '3a',
+ '4a',
+ '5a',
+ '6a',
+ '7a',
+ '8a',
+ '9a',
+ '10a',
+ '11a',
+ '12p',
+ '1p',
+ '2p',
+ '3p',
+ '4p',
+ '5p',
+ '6p',
+ '7p',
+ '8p',
+ '9p',
+ '10p',
+ '11p'
+ ];
+ var days = ['Saturday', 'Friday', 'Thursday', 'Wednesday', 'Tuesday', 'Monday', 'Sunday'];
+ var option = {
+ tooltip: {
+ position: 'top'
+ },
+ grid: {
+ height: '50%',
+ top: '10%'
+ },
+ xAxis: {
+ type: 'category',
+ data: hours,
+ splitArea: {
+ show: true
+ }
+ },
+ yAxis: {
+ type: 'category',
+ data: days,
+ splitArea: {
+ show: true
+ }
+ },
+ visualMap: {
+ min: 0,
+ max: 10,
+ calculable: true,
+ orient: 'horizontal',
+ left: 'center',
+ bottom: '15%'
+ },
+ series: [
+ {
+ name: 'Punch Card',
+ type: 'heatmap',
+ data: data,
+ label: {
+ show: true
+ },
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ],
+ animation: false,
+ dataZoom: [
+ {
+ type: 'slider',
+ yAxisIndex: 0,
+ filterMode: 'empty',
+ start: 0,
+ end: 15,
+ right: 25
+ },
+ {
+ type: 'slider',
+ xAxisIndex: 0,
+ filterMode: 'empty',
+ start: 0,
+ end: 50
+ }
+ ]
+ };
+ var chart = testHelper.create(echarts, 'main3', {
+ title: [
+ 'Operate the slider, heatmap label shouldn\'t overlap'
+ ],
+ option: option
+ });
+ });
+ </script>
</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json
index a72207f78..fa5ae814f 100644
--- a/test/runTest/actions/__meta__.json
+++ b/test/runTest/actions/__meta__.json
@@ -105,7 +105,7 @@
"graphic-cases": 2,
"graphic-draggable": 1,
"graphic-transition": 3,
- "heatmap": 1,
+ "heatmap": 2,
"heatmap-gap-bug": 1,
"heatmap-map": 1,
"homepage3": 1,
diff --git a/test/runTest/actions/heatmap.json b/test/runTest/actions/heatmap.json
index 671b155d2..d8b1813dd 100644
--- a/test/runTest/actions/heatmap.json
+++ b/test/runTest/actions/heatmap.json
@@ -1 +1 @@
-[{"name":"Action 1","ops":[{"type":"mousedown","time":264,"x":12,"y":447},{"type":"mousemove","time":324,"x":12,"y":447},{"type":"mousemove","time":535,"x":13,"y":491},{"type":"mouseup","time":703,"x":13,"y":491},{"time":704,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":740,"x":13,"y":491},{"type":"mousemove","time":941,"x":12,"y":583},{"type":"mousemove","time":1142,"x":12,"y":584},{"type":"mousemove","time":1358,"x":13,"y":589},{"type":"mousedown","time":1366,"x":13, [...]
\ No newline at end of file
+[{"name":"Action 1","ops":[{"type":"mousedown","time":264,"x":12,"y":447},{"type":"mousemove","time":324,"x":12,"y":447},{"type":"mousemove","time":535,"x":13,"y":491},{"type":"mouseup","time":703,"x":13,"y":491},{"time":704,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":740,"x":13,"y":491},{"type":"mousemove","time":941,"x":12,"y":583},{"type":"mousemove","time":1142,"x":12,"y":584},{"type":"mousemove","time":1358,"x":13,"y":589},{"type":"mousedown","time":1366,"x":13, [...]
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org