Data in Graph

This weekend I was wokring on a replication study where I had to deal with data of mulitple repos. Somewhere in the process I encountered a csv which had two columns, release version and last pull request associated with that. I needed to figure out on average how many pull requests the repo used per release. When I sat of the IM assignment I thought by not display that csv on a graph using p5. This was the motivation for my work.

Initialy I wanted to make a tree on which branches represent the version number and the leaves represent the pull requests. But after some hassle I figured out that the data I have is not as hieracial and evenly distributed to create a presentable tree. After which I settled down on a graph represenation of the data.

First and the hardest part was to figure out how to represent it. cuz the amount of value was alot. I decided to group the major and minor version togather and make bins of the of the numbers of Pull requests. Even though it gave less information, the output was at least readable and understandable. In coding the grouping was the hardest part, because I had to read the array and keep track of the of what I have read and match it with the next coming value. and that is also the part I am most proud of figuring it out. The AI assitance for that is mentioned in the end.

// Loop through data row by row
  let lastGroup = "";   // keep track of the last major.minor group
  let y = paddingY;     // starting from Y position
  let groupCount = 0;   // how many PRs in the current group
  let maxBins = 0;      // track maximum number of bins for X-axis

  for (let r = 0; r < data.getRowCount(); r++) {
    let pr = int(data.getString(r, 0));
    let version = data.getString(r, 1);

    // Major.Minor for grouping
    let parts = version.replace("v", "").split(".");
    let group = `v${parts[0]}.${parts[1]}`;

    // New group  discovery
    if (group !== lastGroup) {
      y += yStep;
      groupCount = 0;
      lastGroup = group;

Sketch

AI Assistance

I asked for functions like replace() and split(), to manipulate the data values. I also asked AI to help me tidy up the code in terms of formating and variable names. The most major contribution which is not mine is the following line of code

// Update maxBins if needed
let bins = groupCount / binSize;
if (bins > maxBins) maxBins = bins;

this was didn’t change anything in the ouput but it is useful if the file size is increased significantly. I let it be there as I deem it “Nice to have” or “Good COding practice”.

Leave a Reply