Skip to content

Commit 84940d6

Browse files
committed
[fix]: resolved conflicts
1 parent 0e31443 commit 84940d6

File tree

4 files changed

+689
-681
lines changed

4 files changed

+689
-681
lines changed

src/chart/graph/GraphSeries.ts

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,6 @@ import { LineDataVisual } from '../../visual/commonVisualTypes';
5555
import { createTooltipMarkup } from '../../component/tooltip/tooltipMarkup';
5656
import { defaultSeriesFormatTooltip } from '../../component/tooltip/seriesFormatTooltip';
5757
import {initCurvenessList, createEdgeMapForCurveness} from '../helper/multipleGraphEdgeHelper';
58-
import { PathStyleProps } from 'zrender/src/graphic/Path';
5958

6059

6160
type GraphDataValue = OptionDataValue | OptionDataValue[];
@@ -69,10 +68,6 @@ export interface GraphNodeStateOption<TCbParams = never> {
6968
label?: SeriesLabelOption
7069
}
7170

72-
interface ThumbnailItemStyleOption extends ItemStyleOption {
73-
backgroundColor?: ZRColor
74-
}
75-
7671
interface ExtraEmphasisState {
7772
focus?: DefaultEmphasisFocus | 'adjacency'
7873
}
@@ -238,9 +233,9 @@ export interface GraphSeriesOption
238233
thumbnail?: BoxLayoutOptionMixin & {
239234
show?: boolean,
240235

241-
itemStyle?: ThumbnailItemStyleOption
236+
itemStyle?: ItemStyleOption
242237

243-
selectedDataBackgroundStyle?: PathStyleProps
238+
selectedAreaStyle?: ItemStyleOption
244239
}
245240
}
246241

@@ -534,12 +529,14 @@ class GraphSeriesModel extends SeriesModel<GraphSeriesOption> {
534529
width: '25%',
535530

536531
itemStyle: {
537-
backgroundColor: 'white',
532+
color: 'white',
538533
borderColor: 'black'
539534
},
540535

541-
selectedDataBackgroundStyle: {
542-
fill: 'white',
536+
selectedAreaStyle: {
537+
color: 'white',
538+
borderColor: 'black',
539+
borderWidth: 1,
543540
opacity: 0.5
544541
}
545542
}

src/chart/graph/GraphView.ts

Lines changed: 49 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@
1717
* under the License.
1818
*/
1919

20-
import * as zrUtil from 'zrender/src/core/util';
2120
import SymbolDraw, { ListForSymbolDraw } from '../helper/SymbolDraw';
2221
import LineDraw from '../helper/LineDraw';
2322
import RoamController, { RoamControllerHost } from '../../component/helper/RoamController';
@@ -38,6 +37,9 @@ import Line from '../helper/Line';
3837
import { getECData } from '../../util/innerStore';
3938
import Thumbnail from './Thumbnail';
4039

40+
import { simpleLayoutEdge } from './simpleLayoutHelper';
41+
import { circularLayout, rotateNodeLabel } from './circularLayoutHelper';
42+
4143
function isViewCoordSys(coordSys: CoordinateSystem): coordSys is View {
4244
return coordSys.type === 'view';
4345
}
@@ -61,9 +63,7 @@ class GraphView extends ChartView {
6163

6264
private _layouting: boolean;
6365

64-
private _thumbanil: Thumbnail;
65-
66-
private _isForceLayout = false;
66+
private _thumbnail: Thumbnail;
6767

6868
private _mainGroup: graphic.Group;
6969

@@ -91,6 +91,7 @@ class GraphView extends ChartView {
9191

9292
render(seriesModel: GraphSeriesModel, ecModel: GlobalModel, api: ExtensionAPI) {
9393
const coordSys = seriesModel.coordinateSystem;
94+
let isForceLayout = false;
9495

9596
this._model = seriesModel;
9697

@@ -126,10 +127,12 @@ class GraphView extends ChartView {
126127
const forceLayout = seriesModel.forceLayout;
127128
const layoutAnimation = seriesModel.get(['force', 'layoutAnimation']);
128129
if (forceLayout) {
129-
this._isForceLayout = true;
130+
isForceLayout = true;
130131
this._startForceLayoutIteration(forceLayout, api, layoutAnimation);
131132
}
132133

134+
const layout = seriesModel.get('layout');
135+
133136
data.graph.eachNode((node) => {
134137
const idx = node.dataIndex;
135138
const el = node.getGraphicEl() as Symbol;
@@ -143,14 +146,31 @@ class GraphView extends ChartView {
143146
el.off('drag').off('dragend');
144147
const draggable = itemModel.get('draggable');
145148
if (draggable) {
146-
el.on('drag', () => {
147-
if (forceLayout) {
148-
forceLayout.warmUp();
149-
!this._layouting
150-
&& this._startForceLayoutIteration(forceLayout, api, layoutAnimation);
151-
forceLayout.setFixed(idx);
152-
// Write position back to layout
153-
data.setItemLayout(idx, [el.x, el.y]);
149+
el.on('drag', (e) => {
150+
switch (layout) {
151+
case 'force':
152+
forceLayout.warmUp();
153+
!this._layouting
154+
&& this._startForceLayoutIteration(forceLayout, api, layoutAnimation);
155+
forceLayout.setFixed(idx);
156+
// Write position back to layout
157+
data.setItemLayout(idx, [el.x, el.y]);
158+
break;
159+
case 'circular':
160+
data.setItemLayout(idx, [el.x, el.y]);
161+
// mark node fixed
162+
node.setLayout({ fixed: true }, true);
163+
// recalculate circular layout
164+
circularLayout(seriesModel, 'symbolSize', node, [e.offsetX, e.offsetY]);
165+
this.updateLayout(seriesModel);
166+
break;
167+
case 'none':
168+
default:
169+
data.setItemLayout(idx, [el.x, el.y]);
170+
// update edge
171+
simpleLayoutEdge(seriesModel.getGraph(), seriesModel);
172+
this.updateLayout(seriesModel);
173+
break;
154174
}
155175
}).on('dragend', () => {
156176
if (forceLayout) {
@@ -187,41 +207,12 @@ class GraphView extends ChartView {
187207
&& seriesModel.get(['circular', 'rotateLabel']);
188208
const cx = data.getLayout('cx');
189209
const cy = data.getLayout('cy');
190-
data.eachItemGraphicEl(function (el: Symbol, idx) {
191-
const itemModel = data.getItemModel<GraphNodeItemOption>(idx);
192-
let labelRotate = itemModel.get(['label', 'rotate']) || 0;
193-
const symbolPath = el.getSymbolPath();
194-
if (circularRotateLabel) {
195-
const pos = data.getItemLayout(idx);
196-
let rad = Math.atan2(pos[1] - cy, pos[0] - cx);
197-
if (rad < 0) {
198-
rad = Math.PI * 2 + rad;
199-
}
200-
const isLeft = pos[0] < cx;
201-
if (isLeft) {
202-
rad = rad - Math.PI;
203-
}
204-
const textPosition = isLeft ? 'left' as const : 'right' as const;
205-
206-
symbolPath.setTextConfig({
207-
rotation: -rad,
208-
position: textPosition,
209-
origin: 'center'
210-
});
211-
const emphasisState = symbolPath.ensureState('emphasis');
212-
zrUtil.extend(emphasisState.textConfig || (emphasisState.textConfig = {}), {
213-
position: textPosition
214-
});
215-
}
216-
else {
217-
symbolPath.setTextConfig({
218-
rotation: labelRotate *= Math.PI / 180
219-
});
220-
}
210+
data.graph.eachNode((node) => {
211+
rotateNodeLabel(node, circularRotateLabel, cx, cy);
221212
});
222213

223214
this._firstRender = false;
224-
this._isForceLayout || this._renderThumbnail(seriesModel, api);
215+
isForceLayout || this._renderThumbnail(seriesModel, api, this._symbolDraw, this._lineDraw);
225216
}
226217

227218
dispose() {
@@ -238,8 +229,7 @@ class GraphView extends ChartView {
238229
(function step() {
239230
forceLayout.step(function (stopped) {
240231
if (stopped) {
241-
self._isForceLayout = false;
242-
self._renderThumbnail(self._model, api);
232+
self._renderThumbnail(self._model, api, self._symbolDraw, self._lineDraw);
243233
}
244234
self.updateLayout(self._model);
245235
(self._layouting = !stopped) && (
@@ -286,7 +276,7 @@ class GraphView extends ChartView {
286276
dx: e.dx,
287277
dy: e.dy
288278
});
289-
this._thumbanil._updateSelectedRect('pan');
279+
this._thumbnail._updateSelectedRect('pan');
290280
})
291281
.on('zoom', (e) => {
292282
roamHelper.updateViewOnZoom(controllerHost, e.scale, e.originX, e.originY);
@@ -302,7 +292,7 @@ class GraphView extends ChartView {
302292
this._lineDraw.updateLayout();
303293
// Only update label layout on zoom
304294
api.updateLabelLayout();
305-
this._thumbanil._updateSelectedRect('zoom');
295+
this._thumbnail._updateSelectedRect('zoom');
306296
});
307297
}
308298

@@ -327,14 +317,19 @@ class GraphView extends ChartView {
327317
remove(ecModel: GlobalModel, api: ExtensionAPI) {
328318
this._symbolDraw && this._symbolDraw.remove();
329319
this._lineDraw && this._lineDraw.remove();
330-
this._thumbanil && this.group.remove(this._thumbanil.group);
320+
this._thumbnail && this.group.remove(this._thumbnail.group);
331321
}
332322

333-
private _renderThumbnail(seriesModel: GraphSeriesModel, api: ExtensionAPI) {
334-
if (this._thumbanil) {
335-
this._thumbanil.remove();
323+
private _renderThumbnail(
324+
seriesModel: GraphSeriesModel,
325+
api: ExtensionAPI,
326+
symbolDraw: SymbolDraw,
327+
lineDraw: LineDraw
328+
) {
329+
if (this._thumbnail) {
330+
this.group.remove(this._thumbnail.group);
336331
}
337-
(this._thumbanil = new Thumbnail(this.group)).render(seriesModel, api);
332+
(this._thumbnail = new Thumbnail(this.group)).render(seriesModel, api, symbolDraw, lineDraw, this._mainGroup);
338333
}
339334
}
340335

0 commit comments

Comments
 (0)