This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 752f511ac660f784c6ccf419d6a0d12a3c55cbc5
Author: 100pah <sushuang0...@gmail.com>
AuthorDate: Wed Sep 9 17:06:40 2020 +0800
chore: fix eslint, add console warn, enhance example.
---
src/chart/custom.ts | 8 +-
src/chart/heatmap/HeatmapView.ts | 8 +-
test/custom-transition2.html | 296 ++-------------------------------------
test/data-transform-ecStat.html | 7 +-
4 files changed, 25 insertions(+), 294 deletions(-)
diff --git a/src/chart/custom.ts b/src/chart/custom.ts
index 5940580..6c9149b 100644
--- a/src/chart/custom.ts
+++ b/src/chart/custom.ts
@@ -18,7 +18,7 @@
*/
import {
- hasOwn, assert, isString, retrieve2, retrieve3, defaults, each, keys,
isArrayLike, bind
+ hasOwn, assert, isString, retrieve2, retrieve3, defaults, each, keys,
isArrayLike, bind, eqNaN
} from 'zrender/src/core/util';
import * as graphicUtil from '../util/graphic';
import { setDefaultStateProxy, enableHoverEmphasis } from '../util/states';
@@ -80,6 +80,7 @@ import {
import Transformable from 'zrender/src/core/Transformable';
import { ItemStyleProps } from '../model/mixin/itemStyle';
import { cloneValue } from 'zrender/src/animation/Animator';
+import { warn } from '../util/log';
const inner = makeInner<{
@@ -1004,6 +1005,11 @@ const customDuringAPI = {
}
const style = (tmpDuringScope.el as Displayable).style;
if (style) {
+ if (__DEV__) {
+ if (eqNaN(val)) {
+ warn('style.' + key + ' must not be assigned with NaN.');
+ }
+ }
style[key] = val;
tmpDuringScope.isStyleDirty = true;
}
diff --git a/src/chart/heatmap/HeatmapView.ts b/src/chart/heatmap/HeatmapView.ts
index c7c08c3..155e6b6 100644
--- a/src/chart/heatmap/HeatmapView.ts
+++ b/src/chart/heatmap/HeatmapView.ts
@@ -215,8 +215,12 @@ class HeatmapView extends ChartView {
const dataDimY = data.get(dataDims[1], idx);
// Ignore empty data and out of extent data
- if (isNaN(data.get(dataDims[2], idx) as number) || dataDimX <
xAxisExtent[0] || dataDimX > xAxisExtent[1]
- || dataDimY < yAxisExtent[0] || dataDimY > yAxisExtent[1])
{
+ if (isNaN(data.get(dataDims[2], idx) as number)
+ || dataDimX < xAxisExtent[0]
+ || dataDimX > xAxisExtent[1]
+ || dataDimY < yAxisExtent[0]
+ || dataDimY > yAxisExtent[1]
+ ) {
continue;
}
diff --git a/test/custom-transition2.html b/test/custom-transition2.html
index f9a8338..f67be44 100644
--- a/test/custom-transition2.html
+++ b/test/custom-transition2.html
@@ -37,7 +37,6 @@ under the License.
- <div id="main-cluster-step"></div>
<div id="during-case-continue"></div>
<div id="during-case-get-curr"></div>
<div id="during-case-partial-change"></div>
@@ -52,287 +51,6 @@ under the License.
- <script>
- require(['echarts'], function (echarts) {
-
- // output from echarts-stat
- var originalData = [[3.275154, 2.957587], [-3.344465, 2.603513],
[0.355083, -3.376585], [1.852435, 3.547351], [-2.078973, 2.552013], [-0.993756,
-0.884433], [2.682252, 4.007573], [-3.087776, 2.878713], [-1.565978,
-1.256985], [2.441611, 0.444826], [-0.659487, 3.111284], [-0.459601,
-2.618005], [2.17768, 2.387793], [-2.920969, 2.917485], [-0.028814, -4.168078],
[3.625746, 2.119041], [-3.912363, 1.325108], [-0.551694, -2.814223], [2.855808,
3.483301], [-3.594448, 2.856651], [0. [...]
- var allStepsData = [{
-
"clusterAssment":[[0,11.897518219790832],[1,0.6802138252635731],[0,13.390339526159327],[0,11.752691481115326],[1,1.3537646443055726],[0,6.098722748100828],[0,16.778555382575323],[1,0.2201162719580729],[0,9.90729312281183],[0,1.523748448197578],[1,5.280700404231374],[0,10.67860098859633],[0,5.781994590986328],[1,0.16789088367317268],[0,20.463190272942075],[0,9.485661047651329],[1,4.936282405816574],[0,12.13409250050333],[0,13.56634178686933],[1,0.6393460451944728],[0,7.153
[...]
-
"centroids":[[1.23710375,0.17480612499999998],[-2.94737575,3.3263781000000003]],
-
"pointsInCluster":[[[3.275154,2.957587],[0.355083,-3.376585],[1.852435,3.547351],[-0.993756,-0.884433],[2.682252,4.007573],[-1.565978,-1.256985],[2.441611,0.444826],[-0.459601,-2.618005],[2.17768,2.387793],[-0.028814,-4.168078],[3.625746,2.119041],[-0.551694,-2.814223],[2.855808,3.483301],[0.421993,-2.372646],[1.650821,3.407572],[-0.718809,-2.492514],[4.513623,3.841029],[-0.656297,-1.449872],[1.919901,4.439368],[-1.576936,-2.977622],[3.598143,1.97597],[-1.79108,-2.184517]
[...]
- }, {
-
"clusterAssment":[[0,0.14546105001184495],[1,0.6802138252635731],[2,1.0218458213990822],[0,1.3454875984267451],[1,1.3537646443055726],[2,3.871675185832783],[0,0.8372599513642446],[1,0.2201162719580729],[2,3.538090574163784],[0,7.440811598535447],[1,5.280700404231374],[2,0.025667439393882528],[0,1.1194652917418453],[1,0.16789088367317268],[2,2.117342449150383],[0,1.4963520949744444],[1,4.936282405816574],[2,0.00976749868738251],[0,0.13245384486784495],[1,0.6393460451944728
[...]
-
"centroids":[[2.93386365,3.12782785],[-2.94737575,3.3263781000000003],[-0.45965614999999993,-2.7782156000000002]],
-
"pointsInCluster":[[[3.275154,2.957587],[1.852435,3.547351],[2.682252,4.007573],[2.441611,0.444826],[2.17768,2.387793],[3.625746,2.119041],[2.855808,3.483301],[1.650821,3.407572],[4.513623,3.841029],[1.919901,4.439368],[3.598143,1.97597],[3.914654,3.559303],[1.148946,3.345138],[2.629062,3.535831],[4.606999,3.510312],[3.121904,2.173988],[4.376754,4.863579],[3.997787,2.518662],[1.327224,3.358778],[2.960769,3.079555]],[[-3.344465,2.603513],[-2.078973,2.552013],[-3.087776,2.8
[...]
- }, {
-
"clusterAssment":[[0,0.14546105001184495],[1,0.6802138252635731],[3,0.00026405916653086725],[0,1.3454875984267451],[1,1.3537646443055726],[2,2.0268449766387184],[0,0.8372599513642446],[1,0.2201162719580729],[2,1.2853602661590824],[0,7.440811598535447],[1,5.280700404231374],[2,0.544202924578992],[0,1.1194652917418453],[1,0.16789088367317268],[3,0.7997316188825317],[0,1.4963520949744444],[1,4.936282405816574],[2,0.5924514081707193],[0,0.13245384486784495],[1,0.6393460451944
[...]
-
"centroids":[[2.93386365,3.12782785],[-2.94737575,3.3263781000000003],[-1.1261616363636364,-2.3019356363636363],[0.3549616666666667,-3.3603355555555554]],
-
"pointsInCluster":[[[3.275154,2.957587],[1.852435,3.547351],[2.682252,4.007573],[2.441611,0.444826],[2.17768,2.387793],[3.625746,2.119041],[2.855808,3.483301],[1.650821,3.407572],[4.513623,3.841029],[1.919901,4.439368],[3.598143,1.97597],[3.914654,3.559303],[1.148946,3.345138],[2.629062,3.535831],[4.606999,3.510312],[3.121904,2.173988],[4.376754,4.863579],[3.997787,2.518662],[1.327224,3.358778],[2.960769,3.079555]],[[-3.344465,2.603513],[-2.078973,2.552013],[-3.087776,2.8
[...]
- }, {
-
"clusterAssment":[[4,0.7351095338720867],[1,0.6802138252635731],[3,0.00026405916653086725],[4,0.6574887550938013],[1,1.3537646443055726],[2,2.0268449766387184],[4,0.20236519991694363],[1,0.2201162719580729],[2,1.2853602661590824],[0,4.081776185534029],[1,5.280700404231374],[2,0.544202924578992],[4,1.6054276274352302],[1,0.16789088367317268],[3,0.7997316188825317],[0,0.003668511655694446],[1,4.936282405816574],[2,0.5924514081707193],[4,0.04268877169580105],[1,0.63934604519
[...]
-
"centroids":[[3.565365,2.1237998333333334],[-2.94737575,3.3263781000000003],[-1.1261616363636364,-2.3019356363636363],[0.3549616666666667,-3.3603355555555554],[2.6632202142857144,3.5581255714285716]],
-
"pointsInCluster":[[[2.441611,0.444826],[3.625746,2.119041],[3.598143,1.97597],[4.606999,3.510312],[3.121904,2.173988],[3.997787,2.518662]],[[-3.344465,2.603513],[-2.078973,2.552013],[-3.087776,2.878713],[-0.659487,3.111284],[-2.920969,2.917485],[-3.912363,1.325108],[-3.594448,2.856651],[-2.082902,3.384412],[-4.822011,4.607049],[-3.287749,3.918836],[-3.977329,4.900932],[-1.910108,4.166946],[-2.113864,3.548172],[-1.640717,2.990517],[-4.366462,4.023316],[-4.025139,4.65231],
[...]
- }, {
-
"clusterAssment":[[4,0.7351095338720867],[5,0.5255085113116279],[3,0.00026405916653086725],[4,0.6574887550938013],[1,0.8136916243347753],[2,2.0268449766387184],[4,0.20236519991694363],[5,0.41325733727555103],[2,1.2853602661590824],[0,4.081776185534029],[1,1.3060240218397752],[2,0.544202924578992],[4,1.6054276274352302],[5,0.57628243638732],[3,0.7997316188825317],[0,0.003668511655694446],[5,3.9604024281532437],[2,0.5924514081707193],[4,0.04268877169580105],[5,0.18604508600
[...]
-
"centroids":[[3.565365,2.1237998333333334],[-1.7657655714285714,3.3979401428571427],[-1.1261616363636364,-2.3019356363636363],[0.3549616666666667,-3.3603355555555554],[2.6632202142857144,3.5581255714285716],[-3.5836273846153848,3.2878446923076927]],
-
"pointsInCluster":[[[2.441611,0.444826],[3.625746,2.119041],[3.598143,1.97597],[4.606999,3.510312],[3.121904,2.173988],[3.997787,2.518662]],[[-2.078973,2.552013],[-0.659487,3.111284],[-2.082902,3.384412],[-1.910108,4.166946],[-2.113864,3.548172],[-1.640717,2.990517],[-1.874308,4.032237]],[[-0.993756,-0.884433],[-1.565978,-1.256985],[-0.459601,-2.618005],[-0.551694,-2.814223],[-0.718809,-2.492514],[-0.656297,-1.449872],[-1.576936,-2.977622],[-1.79108,-2.184517],[-1.226597,
[...]
- }];
-
- var colorAll = [
- '#bbb', '#37A2DA', '#e06343', '#37a354', '#b55dba', '#b5bd48',
'#8378EA', '#96BFFF'
- ];
- var ANIMATION_DURATION_UPDATE = 1500;
-
- // probably we should PR to echarts-stat to make the result
directly.
- function preprocessRawData(originalData, allStepsData) {
- var pointIdxMap = {};
- var result = [];
-
- function getKey(point) {
- return point[0] + '_' + point[1];
- }
-
- var stepResult = {
- points: []
- };
- result.push(stepResult);
- for (var i = 0; i < originalData.length; i++) {
- var point = originalData[i];
- var key = getKey(point);
- if (pointIdxMap[key] != null) {
- // It's not correct to throw error but for
- // simplicit in this certain data we just do it.
- throw Error(key);
- }
- var ptsIdx = pointIdxMap[key] = stepResult.points.length;
- stepResult.points[ptsIdx] = [point[0], point[1], 0];
- }
-
- for (var stepIdx = 0; stepIdx < allStepsData.length;
stepIdx++) {
- var stepData = allStepsData[stepIdx];
- var ptsInCluster = stepData.pointsInCluster;
- var newestClusterIdx = ptsInCluster.length - 1;
-
- var stepResult = {
- centroids: stepData.centroids,
- points: [],
- newestClusterIndex: newestClusterIdx,
- newestClusterMaxDistance: -Infinity
- };
- result.push(stepResult);
-
- var newestCenter = stepData.centroids[newestClusterIdx];
- var newestClusterPoints = ptsInCluster[newestClusterIdx];
-
- for (var cIdx = 0; cIdx < ptsInCluster.length; cIdx++) {
- var clusterPoints = ptsInCluster[cIdx];
- for (var i = 0; i < clusterPoints.length; i++) {
- var point = clusterPoints[i];
- var key = getKey(point);
- var ptsIdx = pointIdxMap[key];
- if (ptsIdx == null) {
- throw Error(key);
- }
- stepResult.points[ptsIdx] = [point[0], point[1],
cIdx, newestClusterIdx];
-
- if (cIdx === newestClusterIdx) {
- var dx = newestCenter[0] - point[0];
- var dy = newestCenter[1] - point[1];
- var dist = Math.pow(dx * dx + dy * dy, 0.5);
- if (dist >
stepResult.newestClusterMaxDistance) {
- stepResult.newestClusterMaxDistance = dist;
- }
- }
- }
- }
- }
- return result;
- }
-
- function renderItemPoint(params, api) {
- var coord = api.coord([api.value(0), api.value(1)]);
- var clusterIdx = api.value(2);
- var isNewCluster = clusterIdx === api.value(3);
-
- var extra = {
- transition: []
- };
-
- var contentColor = colorAll[clusterIdx];
- addColorTransition(extra, contentColor, 'content');
-
- return {
- type: 'circle',
- x: coord[0],
- y: coord[1],
- shape: {
- cx: 0,
- cy: 0,
- r: 10
- },
- extra: extra,
- style: {
- fill: contentColor,
- stroke: '#333',
- lineWidth: 1,
- shadowColor: contentColor,
- shadowBlur: isNewCluster ? 12 : 0,
- transition: 'shadowBlur'
- },
- during: function (apiDuring) {
- var currContentColor = getColorInTransition(apiDuring,
'content');
- apiDuring.setStyle('fill', currContentColor);
- }
- };
- }
-
- function addColorTransition(shape, targetColor, key) {
- var colorRGBA = echarts.color.parse(targetColor);
- shape[key + 'R'] = colorRGBA[0];
- shape[key + 'G'] = colorRGBA[1];
- shape[key + 'B'] = colorRGBA[2];
- shape[key + 'A'] = colorRGBA[3];
- var transition = shape.transition || (shape.transition = []);
- transition.push(key + 'R', key + 'G', key + 'B', key + 'A');
- }
-
- function getColorInTransition(apiDuring, key) {
- var colorArr = [
- apiDuring.getExtra(key + 'R'),
- apiDuring.getExtra(key + 'G'),
- apiDuring.getExtra(key + 'B'),
- apiDuring.getExtra(key + 'A')
- ];
- return echarts.color.stringify(colorArr, 'rgba');
- }
-
- function renderBoundary(params, api) {
- var xVal = api.value(0);
- var yVal = api.value(1);
- var maxDist = api.value(2);
- var center = api.coord([xVal, yVal]);
- var size = api.size([maxDist, maxDist]);
- var renderNumberStar;
-
- return {
- type: 'ellipse',
- shape: {
- cx: isNaN(center[0]) ? 0 : center[0],
- cy: isNaN(center[1]) ? 0 : center[1],
- rx: isNaN(size[0]) ? 0 : size[0] + 15,
- ry: isNaN(size[1]) ? 0 : size[1] + 15
- },
- extra: {
- renderNumber: ++renderNumber,
- transition: 'renderNumber'
- },
- style: {
- fill: null,
- stroke: 'rgba(0,0,0,0.2)',
- lineDash: [4, 4],
- lineWidth: 4
- },
- during: function (apiDuring) {
- var currNum = apiDuring.getExtra('renderNumber');
- !renderNumberStar && (renderNumberStar = currNum);
- apiDuring.setStyle('opacity', (currNum -
renderNumberStar) / (renderNumber - renderNumberStar));
- }
- };
- }
-
- function makeStepOption(option, stepResult) {
- var centroids = stepResult.centroids || [];
- var points = stepResult.points;
- var maxDist = stepResult.newestClusterMaxDistance;
- var newCluIdx = stepResult.newestClusterIndex;
-
- option.options.push({
- series: [{
- type: 'custom',
- encode: {
- tooltip: [0, 1]
- },
- renderItem: renderItemPoint,
- data: points
- }, {
- type: 'custom',
- renderItem: renderBoundary,
- animationDuration: 3000,
- silent: true,
- data: [
- [
- (centroids[newCluIdx] || [])[0],
- (centroids[newCluIdx] || [])[1],
- maxDist
- ]
- ]
- }]
- });
- }
-
- var renderNumber = 0;
-
- var option = {
- timeline: {
- top: 'center',
- right: 50,
- height: 300,
- width: 10,
- inverse: true,
- autoPlay: false,
- playInterval: 2500,
- symbol: 'none',
- orient: 'vertical',
- axisType: 'category',
- label: {
- formatter: 'step {value}',
- position: 10
- },
- checkpointStyle: {
- color: '#555',
- borderWidth: 0,
- animationDuration: ANIMATION_DURATION_UPDATE
- },
- data: []
- },
- baseOption: {
- animationDurationUpdate: ANIMATION_DURATION_UPDATE,
- tooltip: {
- },
- xAxis: {
- type: 'value'
- },
- yAxis: {
- type: 'value'
- },
- series: [{
- type: 'scatter'
- }]
- },
- options: []
- };
-
- var processedData = preprocessRawData(originalData, allStepsData);
- for (var i = 0; i < processedData.length; i++) {
- var stepResult = processedData[i];
- makeStepOption(option, stepResult);
- option.timeline.data.push(i + '');
- }
-
- var chart = testHelper.create(echarts, 'main-cluster-step', {
- title: [
- 'Cluster algorithm visualization'
- ],
- height: 600,
- option: option
- });
- });
- </script>
-
-
-
-
@@ -368,7 +86,7 @@ under the License.
coordinateSystem: 'none',
renderItem: renderItem,
animationDuration: 3000,
- animationDurationUpdate: 6000,
+ animationDurationUpdate: 3000,
data: [[baseX, baseY]]
}]
};
@@ -411,7 +129,7 @@ under the License.
require(['echarts'], function (echarts) {
function renderItem(params, api) {
- var renderNumberStar;
+ var renderNumberStart;
return {
type: 'circle',
shape: {
@@ -428,8 +146,10 @@ under the License.
},
during: function (apiDuring) {
var currNum = apiDuring.getExtra('renderNumber');
- !renderNumberStar && (renderNumberStar = currNum);
- apiDuring.setStyle('opacity', (currNum -
renderNumberStar) / (renderNumber - renderNumberStar));
+ !renderNumberStart && (renderNumberStart = currNum);
+ var opacity = (currNum - renderNumberStart) /
(renderNumber - renderNumberStart);
+ isNaN(opacity) && (opacity = 1);
+ apiDuring.setStyle('opacity', opacity);
}
};
}
@@ -445,7 +165,7 @@ under the License.
coordinateSystem: 'none',
renderItem: renderItem,
animationDuration: 3000,
- animationDurationUpdate: 10000,
+ animationDurationUpdate: 1000,
data: [[baseX, baseY]]
}]
};
@@ -464,7 +184,7 @@ under the License.
chart.setOption({
series: {
id: 'a',
- data: [[baseX += 20, baseY]]
+ data: [[baseX += 40, baseY]]
}
});
}
diff --git a/test/data-transform-ecStat.html b/test/data-transform-ecStat.html
index e05ddbc..7663e3b 100644
--- a/test/data-transform-ecStat.html
+++ b/test/data-transform-ecStat.html
@@ -27,8 +27,9 @@ under the License.
<script src="lib/facePrint.js"></script>
<script src="lib/testHelper.js"></script>
<script src="../dist/echarts.js"></script>
- <script src="lib/ecStat-1.1.1.min.js"></script>
- <script src="lib/ecStatTransform.js"></script>
+ <script src="../../echarts-stat/dist/ecStat.js"></script>
+ <!-- <script src="lib/ecStat-1.1.1.min.js"></script> -->
+ <!-- <script src="lib/ecStatTransform.js"></script> -->
<!-- <script src="ut/lib/canteen.js"></script> -->
<link rel="stylesheet" href="lib/reset.css" />
</head>
@@ -45,7 +46,7 @@ under the License.
<script>
- echarts.registerTransform(ecStatTransform(ecStat).regression);
+ echarts.registerTransform(ecStat.transform.regression);
var rawData = [
[1, 4862.4],
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org
