Working on a way of showing flow

app/controllers/graphs_controller.rb

@@ -17,7 +17,7 @@ class GraphsController < ApplicationController
         sql << " left join journal_details as jd on j.id = jd.journal_id"
         sql << " left join issue_statuses as is1 on jd.old_value = is1.id"
         sql << " left join issue_statuses as is2 on jd.value = is2.id"
-        sql << " where journalized_type = 'issue' and prop_key = 'status_id' and  DATE_SUB(CURRENT_TIMESTAMP, INTERVAL 10 DAY) <= created_on"
+        sql << " where journalized_type = 'issue' and prop_key = 'status_id' and  DATE_SUB(CURRENT_TIMESTAMP, INTERVAL 15 DAY) <= created_on"
         sql << " group by old_value, value"
         sql << " order by is1.position, is2.position"
         @status_changes = ActiveRecord::Base.connection.select_all(sql)

app/views/graphs/issue_status_flow.html.erb

@@ -13,14 +13,24 @@
 %>
 
 <svg xmlns="http://www.w3.org/2000/svg" version="1.0" width="400" height="744">
-  <g stroke="black" stroke-width="10">
+  <g fill-opacity="0.5">
     <% @status_changes.each do |status_change| %>
-        <line
-            y2="<%= points[status_change["old_status"].to_i]["y"] %>"
-            x2="<%= points[status_change["old_status"].to_i]["x"] %>"
-            y1="<%= points[status_change["new_status"].to_i]["y"] %>"
-            x1="<%= points[status_change["new_status"].to_i]["x"] %>"
-            stroke-width="<%= status_change["changes_count"].to_i %>"
+        <%
+            changes_count = status_change["changes_count"].to_i
+            
+            x1 = points[status_change["old_status"].to_i]["x"]
+            y1 = points[status_change["old_status"].to_i]["y"]
+            
+            x2 = points[status_change["new_status"].to_i]["x"]
+            y2 = points[status_change["new_status"].to_i]["y"]
+            
+            x1a = x1 # f(changes_count)
+            y1a = y1 # f(changes_count)
+            x1b = x1 # f(changes_count)
+            y1b = y1 # f(changes_count)
+        %>
+        <polygon
+            points="<%= x1a %>,<%= y1a %> <%= x1b %>,<%= y1b %> <%= x2 %>,<%= y2 %>"
         />
     <% end %>
   </g>
@@ -29,7 +39,7 @@
         <circle cx="<%= point["x"] %>" cy="<%= point["y"] %>" r="40" />
     <% end %>
   </g>
-  <g font-family="Arial" font-size="13" font-weight="700" text-anchor="middle">
+  <g font-family="Helvetica, Arial" font-size="13" text-anchor="middle">
     <% points.each do |status_id, point| %>
         <text x="<%= point["x"] %>" y="<%= point["y"] %>"><%= issue_statuses_by_id[status_id] %></text>
     <% end %>