Skip to content

fixed traffic visualization of pinged servers properly #30

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 11, 2020
Merged

fixed traffic visualization of pinged servers properly #30

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 13 additions & 10 deletions app/charts/microservice-traffic.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ const MicroServiceTraffic = (props) => {
}

else {

for (let i = communicationsData.length-1; i >= 0; i--) {
const element = communicationsData[i];
if (resObj[element.correlatingid]) resObj[element.correlatingid].push(element.currentmicroservice);
Expand All @@ -40,26 +39,30 @@ const MicroServiceTraffic = (props) => {

//use object values to destructure locations
const tracePoints = Object.values(resObj);
let position = communicationsData[0].correlatingid ? 0 : tracePoints.length-1;


// Declare Micro-server-count dictinary to capture the amount of times a particular server is hit
const microServiceCountdictionary = {};

//array logging every ping present in communications table ---> flat used to flatten multidimensional array and return 1d array
const tracePointLog = tracePoints.flat(Infinity);

// iterate over Trace Points
for (let i = 0; i < tracePoints[position].length; i+=1) {
for (let i = 0; i < tracePointLog.length; i+=1) {

// populate Micro-count dictionary
if (!microServiceCountdictionary[tracePoints[position][i]]) {
microServiceCountdictionary[tracePoints[position][i]] = 1;
if (!microServiceCountdictionary[tracePointLog[i]]) {
microServiceCountdictionary[tracePointLog[i]] = 1;
} else {
microServiceCountdictionary[tracePoints[position][i]]+=1
microServiceCountdictionary[tracePointLog[i]]+=1
}
};

// capture values of microServiceCountdictionary to use as data to populate chart object
const serverPingCount = Object.values(microServiceCountdictionary);


// variable 10 points higher than max number in microservicesDictionary aggregation --> variable allows for top level spacing on bar graph
const yAxisHeadRoom = (Math.max(...serverPingCount) + 10);

// Create chart object data to feed into bar component
const myChart = {
//spread dictionary keys inorder to properly label chart x axis
Expand All @@ -70,9 +73,9 @@ const MicroServiceTraffic = (props) => {
backgroundColor: 'rgba(241, 207, 70,1)',
borderColor: 'rgba(0,0,0,1)',
borderWidth: 1,
data: [...serverPingCount, 0] // spread ping count array into data array to have chart populate the Y axis
data: [...serverPingCount, 0, yAxisHeadRoom] // spread ping count array into data array to have chart populate the Y axis
}
]
],
}


Expand Down
4 changes: 1 addition & 3 deletions app/components/Modal.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,7 @@ const Modal = (props) => {

// event.stopPropogation allows the user to interact with the chart as opposed to a click on the
// chart bubbling out and closing the Modal.

console.log('Modal Props: ', props);
console.log('Modal props.modalChart: ', modalChart);

return (
<div id="modalWindow" onClick={() => toggleModalDisplay(!toggleModalDisplay)}>
<div id="modalContent" onClick={(event) => event.stopPropagation()}>
Expand Down