cosmetic updates

This commit is contained in:
dhrubesh 2021-05-09 23:45:42 +05:30
parent 45f1c2ec11
commit 36ad8987dd
2 changed files with 9 additions and 4 deletions

View File

@ -64,12 +64,15 @@ const ServiceMap = (props: ServiceMapProps) => {
getDetailedServiceMapItems(globalTime);
}, []);
useEffect(() => {
fgRef.current && fgRef.current.d3Force("charge").strength(-400);
});
if (!serviceMap.items.length || !serviceMap.services.length) {
return <Spin />;
}
const zoomToService = (value: string) => {
fgRef && fgRef.current.zoomToFit(700, 390, (e) => e.id === value);
fgRef && fgRef.current.zoomToFit(700, 399, (e) => e.id === value);
};
const { nodes, links } = getGraphData(serviceMap);
@ -83,7 +86,9 @@ const ServiceMap = (props: ServiceMapProps) => {
<ForceGraph2D
ref={fgRef}
cooldownTicks={100}
onEngineStop={() => fgRef.current.zoomToFit(100, 120)}
onEngineStop={() => {
fgRef.current.zoomToFit(100, 120);
}}
graphData={graphData}
nodeLabel="id"
linkAutoColorBy={(d) => d.target}
@ -111,7 +116,7 @@ const ServiceMap = (props: ServiceMapProps) => {
<div style="font-weight:bold; margin-bottom:16px;">${node.id}</div>
<div class="keyval">
<div class="key">P99 latency:</div>
<div class="val">${node.p99 / 1000000}</div>
<div class="val">${node.p99 / 1000000}ms</div>
</div>
<div class="keyval">
<div class="key">Request:</div>

View File

@ -63,7 +63,7 @@ export const getGraphData = (serviceMap: serviceMapStore): graphDataType => {
width,
color,
nodeVal: width,
callRate: service.callRate,
callRate: service.callRate.toFixed(2),
errorRate: service.errorRate,
p99: service.p99,
};