mirror of
https://github.com/apache/skywalking-booster-ui.git
synced 2025-07-18 11:05:24 +00:00
62 lines
2.2 KiB
TypeScript
62 lines
2.2 KiB
TypeScript
/**
|
|
* Licensed to the Apache Software Foundation (ASF) under one or more
|
|
* contributor license agreements. See the NOTICE file distributed with
|
|
* this work for additional information regarding copyright ownership.
|
|
* The ASF licenses this file to You under the Apache License, Version 2.0
|
|
* (the "License"); you may not use this file except in compliance with
|
|
* the License. You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
import icons from "@/assets/img/icons";
|
|
import { Node } from "@/types/topology";
|
|
|
|
const Hexagon = (side: number, r: number, cx: number, cy: number) => {
|
|
let path = "";
|
|
for (let i = 0; i < side; i += 1) {
|
|
const x = Math.cos(((2 / side) * i + 1 / side) * Math.PI) * r + cx;
|
|
const y = -Math.sin(((2 / side) * i + 1 / side) * Math.PI) * r + cy;
|
|
path += !i ? `M${x},${y} ` : `L${x},${y} `;
|
|
if (i == side - 1) path += "Z";
|
|
}
|
|
return path;
|
|
};
|
|
|
|
export default (graph: any, tip: any, data: any) => {
|
|
const tool = graph.append("g").attr("class", "topo-tool");
|
|
const side = 6;
|
|
for (let i = 0; i < data.length; i += 1) {
|
|
const x = Math.cos((2 / side) * i * Math.PI) * 34;
|
|
const y = -Math.sin((2 / side) * i * Math.PI) * 34;
|
|
const tool_g = tool
|
|
.append("g")
|
|
.attr("class", "topo-tool-i")
|
|
.on("mouseover", function (event: any, d: Node) {
|
|
tip.html(() => data[i].title).show(d, this);
|
|
})
|
|
.on("mouseout", function () {
|
|
tip.hide(this);
|
|
})
|
|
.on("click", data[i].func);
|
|
tool_g
|
|
.append("path")
|
|
.attr("class", "tool-hexagon")
|
|
.attr("d", Hexagon(6, 17, x, y));
|
|
tool_g
|
|
.append("svg:image")
|
|
.attr("width", 14)
|
|
.attr("height", 14)
|
|
.attr("x", x - 7)
|
|
.attr("y", y - 7)
|
|
.attr("style", "opacity: 0.8")
|
|
.attr("xlink:href", icons[data[i].icon]);
|
|
}
|
|
return tool;
|
|
};
|