You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/09/29 07:11:25 UTC

[GitHub] [echarts] 100pah commented on a change in pull request #15428: feat(graph): simple graph draggable. close #14510

100pah commented on a change in pull request #15428:
URL: https://github.com/apache/echarts/pull/15428#discussion_r718202547



##########
File path: src/chart/graph/circularLayoutHelper.ts
##########
@@ -163,11 +177,58 @@ const _layoutNodesBasedOn: Record<'value' | 'symbolSize', LayoutNode> = {
             const radianHalf = halfRemainRadian + _symbolRadiansHalf[node.dataIndex];
 
             angle += radianHalf;
-            node.setLayout([
+            // init circular layout for
+            // 1. layout undefined node
+            // 2. not fixed node
+            (!node.getLayout() || !node.getModel<GraphNodeItemOption>().get('fixed'))

Review comment:
       should better be `.get('fixed', true)`

##########
File path: src/chart/graph/circularLayoutHelper.ts
##########
@@ -163,11 +177,58 @@ const _layoutNodesBasedOn: Record<'value' | 'symbolSize', LayoutNode> = {
             const radianHalf = halfRemainRadian + _symbolRadiansHalf[node.dataIndex];
 
             angle += radianHalf;
-            node.setLayout([
+            // init circular layout for
+            // 1. layout undefined node
+            // 2. not fixed node
+            (!node.getLayout() || !node.getModel<GraphNodeItemOption>().get('fixed'))
+            && node.setLayout([
                 r * Math.cos(angle) + cx,
                 r * Math.sin(angle) + cy
             ]);
             angle += radianHalf;
         });
     }
 };
+
+export function rotateNodeLabel(
+    node: GraphNode,
+    circularRotateLabel: boolean,
+    cx: number,
+    cy: number
+) {
+    const el = node.getGraphicEl() as Symbol;
+    // need to check if el exists. '-' value may not create node element.
+    if (!el) {
+        return;
+    }
+    const nodeModel = node.getModel<GraphNodeItemOption>();
+    let labelRotate = nodeModel.get(['label', 'rotate']) || 0;
+    const symbolPath = el.getSymbolPath();
+    if (circularRotateLabel) {
+        const pos = node.getLayout();
+        let rad = Math.atan2(pos[1] - cy, pos[0] - cx);
+        if (rad < 0) {
+            rad = Math.PI * 2 + rad;
+        }
+        const isLeft = pos[0] < cx;
+        if (isLeft) {
+            rad = rad - Math.PI;
+        }
+        const textPosition = isLeft ? 'left' as const : 'right' as const;
+
+        symbolPath.setTextConfig({
+            rotation: -rad,
+            position: textPosition,
+            origin: 'center'
+        });
+        const emphasisState = symbolPath.ensureState('emphasis');
+        zrUtil.extend(emphasisState.textConfig || (emphasisState.textConfig = {}), {
+            position: textPosition
+        });
+    }
+    else {

Review comment:
       This logic do not only related to 'circular layout'. All other layout use it.
   Should we put this logic in file `circularLayoutHelper.ts`? 




-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org