SHORTEST PATH CASH FLOW ALGORITHM USING

GRAPH AND HEAP

J component report

Submitted by:

NAME REG NO
E SIVASIDHARTH 19BEC0721
R S NAVIN 19BEC0224

In partial fulfilment for award of the degree of

B.TECH
in
ELECTRONICS AND COMMUNICATION ENGINEERING
Under the guidance of
Faculty: Dr. Delhi Babu R
School of Computer Science And Engineering

1
 DECLARATION

We hereby declare that the J Component report entitled

“SHORTEST PATH CASH FLOW ALGORITHM USING
GRAPH AND HEAP ” submitted by E.SIVASIDHARTH
(19BEC0721) and R S NAVIN (19BEC0224) to Vellore Institute of
Technology, Vellore- 14 in partial fulfillment of the requirement for
the award of the degree of B.Tech in Electronics And Communication
Engineering is a record of bonafide undertaken by me under the
supervision of Dr. R Delhi Babu I further declare that the work
reported in this report has not been submitted and will not be
submitted, either in part or in full, for the award of any other degree
or diploma in this institute or any other institute or university.

2
S.No Title Pg No.

1. Introduction and Flowchart 4

2. Algorithm 6
3. Programming Language 7
4. Code 8
5. Output 16
6. Reference 18

3
 INTRODUCTION
Finding the cheapest possible way of sending a certain amount of flow through
a flow network There may be situation where a person may give or get money
from someone and that person may indeed be giving or getting money from
some other let look at it visually without simplification

It looks bit complicated but it can simplified using an algorithm to something

like

This looks simple and it too represents the same situation

For example, if the following weighted directed graph represents some people
and the arrows represent debts between them (Alice owes Bob Rs.20 and
Charlie Rs.5, Bob owes Charlie Rs.10, etc.):

How to pick the first person? To pick the first person, calculate the net amount
for every person where net amount is obtained by subtracting all debts (amounts
to pay) from all credits (amounts to be paid). Once net amount for every person
is evaluated, find two persons with maximum and minimum net amounts. These
two persons are the most creditors and debtors. The person with minimum of

4
two is our first person to be settled and removed from list. Let the minimum of
two amounts be x. We pay ‘x’ amount from the maximum debtor to maximum
creditor and settle one person. If x is equal to the maximum debit, then
maximum debtor is settled, else maximum creditor is settled.

There’s no sense in Rs.10 making its way from Alice to Bob and then from Bob
to Charlie if Alice could just give it to Charlie directly.

The goal, then, in the general case is to take a debt graph and simplify it (i.e.
produce a new graph with the same nodes but different edges).

5
 ALGORITHM
THE ALGORITHM IS THAT WE TAKE A PERSON AND CALCULATE
HIS NET AMOUNT (CREDIT-DEBIT) AND ADD IT IN A MAX-HEAP
AND WE TAKE THE PERSON WITH HIGHEST DEBIT i.e(the last element
in heap) AND THE PERSON WITH HIGHEST CREDIT AND TRY TO
SETTLE THEM AND IF SETTLED WE POP THEM OR WE FUTHER
MOVE ON SETTLING IN SAME WAY AND ATLAST WE WILL GET
SHORT PATH CASH FLOW WE USE GRAPH TO REPRESENT THE
DATA FLOW

6
 PROGRAMMING LANGUAGE
JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled
programming language with first-class functions. While it is most well-known as
the scripting language for Web pages, many non-browser environments also use
it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is
a prototype-based, multi-paradigm, single-threaded, dynamic language,
supporting object-oriented, imperative, and declarative (e.g. functional
programming) styles.
HTML (HyperText Markup Language) is the most basic building block of the
Web. It defines the meaning and structure of web content. Other technologies
besides HTML are generally used to describe a web page's
appearance/presentation (CSS) or functionality/behavior (JavaScript).
"Hypertext" refers to links that connect web pages to one another, either within a
single website or between websites. Links are a fundamental aspect of the Web.
By uploading content to the Internet and linking it to pages created by other
people, you become an active participant in the World Wide Web.

Cascading Style Sheets (CSS) is a style sheet language used for describing
the presentation of a document written in a markup language such
as HTML.[1] CSS is a cornerstone technology of the World Wide Web,
alongside HTML and JavaScript.
CSS is designed to enable the separation of presentation and content,
including layout, colors, and fonts. This separation can improve
content accessibility, provide more flexibility and control in the specification of
presentation characteristics, enable multiple web pages to share formatting by
specifying the relevant CSS in a separate .css file which reduces complexity and
repetition in the structural content as well as enabling the .css file to
be cached to improve the page load speed between the pages that share the file
and its formatting.

7
 CODE
We have used React.js framework to build the project

Implementation of algorithm :
export default (allmembers, totalMembers, totalPrice) => {

let idealPrice = totalPrice / totalMembers;

console.log(idealPrice);
let idealMem = allmembers.map((item) => {
return {
name: item.name,
cost: item.cost - idealPrice,
};
});
let a = idealMem.sort((a, b) => {
return b.cost - a.cost;
});
let cnt = 0;
let graph = new Map();
while (a.length > 1 && totalPrice > 0) {
let high = a[0];
let low = a[a.length - 1];
let debit = low.cost;
let dname = low.name;
let credit = high.cost;
let cname = high.name;

a.splice(0, 1);
a.splice(a.length - 1, 1);

let settled = Math.min(-debit, credit);

debit += settled;
credit -= settled;

//console.log(dname, "will pay", settled, "to", cname);

let prev = graph.get(dname);
if (prev) {
graph.set(dname, [...prev, { to: cname, cost: settled }]);
} else {
graph.set(dname, [{ to: cname, cost: settled }]);
}

if (debit !== 0) {
let val = {

8
 name: dname,
cost: debit,
};
a.push(val);
}
if (credit !== 0) {
let val = {
name: cname,
cost: credit,
};
a.push(val);
}

a = a.sort((a, b) => {
return b.cost - a.cost;
});

cnt += 1;
}

return {
count: cnt,
transactions: graph,
};
};

The Front-end part of the WebPage:

App.js
import React from "react";
import Header from "./components/Header";
import Input from "./components/Input";
import Feedback from "./components/Feedback";
import Solution from "./components/Solution";
import "./App.css";

const App = () => {

return (
<div className="tot">
<Header />
<div className="flex-container">
<Input />
<Feedback />
<Solution />
</div>
</div>

9
 );
};

export default App;

Input.js
import React, { useState } from "react";

import { makeStyles } from "@material-ui/core/styles";

import TextField from "@material-ui/core/TextField";
import Button from "@material-ui/core/Button";
import Select from "@material-ui/core/Select";
import MenuItem from "@material-ui/core/MenuItem";
import FormControl from "@material-ui/core/FormControl";
import InputLabel from "@material-ui/core/InputLabel";
import { connect } from "react-redux";

const Input = (props) => {

const handleAddMember = (event) => {
event.preventDefault();
props.addMember({ name: newMember });
};

const menuList = props.allMembers.map((member) => (

<MenuItem value={member.name}>{member.name}</MenuItem>
));

const handleAddItem = (event) => {

event.preventDefault();
props.addItem({ item: item, member: member, price: parseInt(price) });
};

const classes = useStyles();

const [newMember, editNewMember] = useState("");
const [price, editPrice] = useState(0);
const [member, editMember] = useState("");
const [item, editItem] = useState("");
return (
<div className="flex-col">
<h2 className="head">Add New Roomate</h2>
<form className={classes.root} noValidate autoComplete="off">
<div className="flex-col">
<TextField

10
 className="mb"
id="roomate"
label="Name"
variant="outlined"
value={newMember}
onChange={(e) => {
editNewMember(e.target.value);
}}
/>
<Button
className="mb"
type="submit"
variant="contained"
color="primary"
onClick={handleAddMember}
>
ADD MEMBER
</Button>
</div>
</form>
<h2 className="head">Add New Transaction</h2>
<form className={classes.root} noValidate autoComplete="off">
<div className="flex-col">
<TextField
id="item"
label="Item Name"
variant="outlined"
value={item}
onChange={(e) => {
editItem(e.target.value);
}}
/>
<FormControl variant="outlined">
<InputLabel variant="filled" id="person">
Bought By
</InputLabel>
<Select
labelId="person"
id="person"
value={member}
onChange={(e) => {
editMember(e.target.value);
}}
>
{menuList}
</Select>
</FormControl>
<TextField

11
 id="Price"
label=""
variant="outlined"
value={price}
onChange={(e) => {
editPrice(e.target.value);
}}
/>
<Button
className="btn "
type="submit"
variant="contained"
color="primary"
onClick={handleAddItem}
>
ADD ITEM
</Button>
</div>
</form>
</div>
);
};

const mapStateToProps = (state) => {

return {
allMembers: state.allMembers,
};
};

const mapDispatchToProps = (dispatch) => {

return {
addItem: (payload) => {
dispatch({ type: "ADD_ITEM", payload: payload });
},
addMember: (payload) => {
dispatch({ type: "ADD_MEMBER", payload: payload });
},
};
};

export default connect(mapStateToProps, mapDispatchToProps)(Input);

Header.js
import React from "react";
import "./header.css";

12
const Header = () => {
return (
<div className="Title">
<header>
<h1>SHORTEST PATH CASH FLOW ALGORITHM</h1>
</header>
</div>
);
};

export default Header;

Feedback.js
import React from "react";
import { connect } from "react-redux";
import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";

const Feedback = (props) => {

console.log(props.allItems);
const list = props.allItems.map((transaction) => (
<Card className="list" key={transaction.price} variant="outlined">
<CardContent>
{transaction.member +
" bought " +
transaction.item +
" at an amount of " +
transaction.price}
</CardContent>
</Card>
));
const def = (
<Card>
<CardContent className="list">Add Transaction to Continue</CardContent>
</Card>
);
return (
<div>
<h2 className="head">Transactions Till Now</h2>
<div className="flex-col">{props.allItems.length > 0 ? list : def}</div>
</div>
);
};

const mapStateToProps = (state) => {

const { allItems } = state;

13
 return {
allItems: allItems,
};
};

export default connect(mapStateToProps)(Feedback);

Solution.js
import React from "react";
import { connect } from "react-redux";
import brain from "../brain";
import Card from "@material-ui/core/Card";
import CardContent from "@material-ui/core/CardContent";

const Solution = (props) => {

const { count, transactions } = brain(
props.allMembers,
props.totalMembers,
props.totalPrice
);
let list = [];
for (let entry of transactions) {
let name = entry[0];
let det = entry[1];
det.map((tran) => list.push({ payer: name, to: tran.to, cost: tran.cost })
);
}
let final = null;
const def = (
<Card>
<CardContent className="list">Add Transactions To continue</CardContent>
</Card>
);
if (list) {
final = list.map((transition) => (
<Card key={transition.payer} className="list">
<CardContent>
{transition.payer +
" pays " +
transition.to +
" an amount of " +
transition.cost.toFixed(1)}
</CardContent>
</Card>
));
}

14
 return (
<div>
<h2 className="head">Shortest Cash Flow</h2>
{count ? <p>Total of {count} transactions</p> : null}
<div className="flex-col">{count ? final : def}</div>
</div>
);
};

const mapStateToProps = (state) => {

const { allItems, totalPrice, totalMembers, allMembers } = state;
return {
allItems: allItems,
allMembers: allMembers,
totalPrice: totalPrice,
totalMembers: totalMembers,
};
};

export default connect(mapStateToProps)(Solution);

StateManagement:Redux

15
OUTPUT

16
17
 REFERENCE

• https://www.google.com/
• https://www.wikipedia.org/
• https://link.springer.com/article/10.1007/s12205-015-0588-5
• https://medium.com/@soumyasethy/shortest-path-or-minimum-cash-
flow-algorithm-using-java-5848d4148a76
• https://www.semanticscholar.org/paper/The-algorithm-of-cash-flow-
forecasting-in-planning-Kim-
Park/2fdc14451937cf1f4d7c4a44c89c2a52cd5d1645

18