github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-10 03:55:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: types

Browse Source
This commit is contained in:
Fine 2023-03-22 16:37:26 +08:00
parent 2a62cf5bcf
commit 4cdc087a9d
3 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/mock/index.ts
View File

@ -17,7 +17,7 @@
import Mock from "mockjs"; import Mock from "mockjs";
const Random = Mock.Random; const Random = Mock.Random;
const nodes: any = Mock.mock({ const nodes = Mock.mock({
"nodes|500": [ "nodes|500": [
{ {
//id //id
@ -28,7 +28,7 @@ const nodes: any = Mock.mock({
}, },
], ],
}); });
const calls: any = Mock.mock({ const calls = Mock.mock({
"links|500": [ "links|500": [
{ {
//id //id

8
src/types/topology.d.ts vendored
View File

@ -26,6 +26,10 @@ export interface Call {
lowerArc?: boolean; lowerArc?: boolean;
sourceComponents: string[]; sourceComponents: string[];
targetComponents: string[]; targetComponents: string[];
sourceX?: number;
sourceY?: number;
targetY?: number;
targetX?: number;
} }
export interface Node { export interface Node {
id: string; id: string;
@ -34,4 +38,8 @@ export interface Node {
isReal: boolean; isReal: boolean;
layer?: string; layer?: string;
serviceName?: string; serviceName?: string;
height?: number;
x?: number;
y?: number;
level?: number;
} }

16
src/views/dashboard/related/topology/components/utils/layout.ts
View File

@ -15,13 +15,13 @@
* limitations under the License. * limitations under the License.
*/ */
import * as d3 from "d3"; import * as d3 from "d3";
import type { Node } from "@/types/topology"; import type { Node, Call } from "@/types/topology";
export function layout(levels: Node[][], calls: any[], radius: number) { export function layout(levels: Node[][], calls: Call[], radius: number) {
// precompute level depth // precompute level depth
levels.forEach((l: any, i: any) => l.forEach((n: any) => (n.level = i))); levels.forEach((l: Node[], i: number) => l.forEach((n: any) => (n.level = i)));
const nodes = levels.reduce((a: any, x: any) => a.concat(x), []); const nodes: Node[] = levels.reduce((a, x) => a.concat(x), []);
// layout // layout
const padding = 30; const padding = 30;
const node_height = 120; const node_height = 120;
@ -53,14 +53,14 @@ export function layout(levels: Node[][], calls: any[], radius: number) {
} }
} }
const layout = { const layout = {
width: d3.max(nodes, (n: { x: number }) => n.x) || 0 + node_width + 2 * padding, width: d3.max(nodes as any, (n: { x: number }) => n.x) || 0 + node_width + 2 * padding,
height: d3.max(nodes, (n: { y: number }) => n.y) || 0 + node_height / 2 + 2 * padding, height: d3.max(nodes as any, (n: { y: number }) => n.y) || 0 + node_height / 2 + 2 * padding,
}; };
return { nodes, layout, calls: computeCallPos(calls, radius) }; return { nodes, layout, calls: computeCallPos(calls, radius) };
} }
export function computeCallPos(calls: any[], radius: number) { export function computeCallPos(calls: Call[], radius: number) {
for (const [index, call] of calls.entries()) { for (const [index, call] of calls.entries()) {
const centrePoints = [call.sourceObj.x, call.sourceObj.y, call.targetObj.x, call.targetObj.y]; const centrePoints = [call.sourceObj.x, call.sourceObj.y, call.targetObj.x, call.targetObj.y];
for (const [idx, link] of calls.entries()) { for (const [idx, link] of calls.entries()) {
@ -86,7 +86,7 @@ export function computeCallPos(calls: any[], radius: number) {
} }
} }
} }
const pos: any = circleIntersection( const pos: { x: number; y: number }[] = circleIntersection(
centrePoints[0], centrePoints[0],
centrePoints[1], centrePoints[1],
radius, radius,