GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-12 10:09:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

calculate zoom px based on screen size

Browse Source
This commit is contained in:
dhrubesh 2021-05-15 18:23:29 +05:30
parent fcc248ddf6
commit 2482e91348
2 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/modules/Servicemap/ServiceMap.tsx
View File

@ -10,7 +10,7 @@ import {
import { Spin } from "antd"; import { Spin } from "antd";
import styled from "styled-components"; import styled from "styled-components";
import { StoreState } from "../../store/reducers"; import { StoreState } from "../../store/reducers";
import { getGraphData } from "./utils"; import { getZoomPx, getGraphData } from "./utils";
import SelectService from "./SelectService"; import SelectService from "./SelectService";
import { ForceGraph2D } from "react-force-graph"; import { ForceGraph2D } from "react-force-graph";
@ -72,7 +72,7 @@ const ServiceMap = (props: ServiceMapProps) => {
} }
const zoomToService = (value: string) => { const zoomToService = (value: string) => {
fgRef && fgRef.current.zoomToFit(700, 380, (e) => e.id === value); fgRef && fgRef.current.zoomToFit(700, getZoomPx(), (e) => e.id === value);
}; };
const { nodes, links } = getGraphData(serviceMap); const { nodes, links } = getGraphData(serviceMap);

11
frontend/src/modules/Servicemap/utils.ts
View File

@ -73,3 +73,14 @@ export const getGraphData = (serviceMap: serviceMapStore): graphDataType => {
links, links,
}; };
}; };
export const getZoomPx = (): number => {
const width = window.screen.width;
if (width < 1400) {
return 190;
} else if (width > 1400 && width < 2500) {
return 380;
} else if (width > 2500) {
return 360;
}
};