glimmer-libui-cc-graphs_and_charts 0.2.1 → 0.2.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 263ed1c13a5130568949ac82714104e494a4e8ffd1ded95fec7d14110d5fc364
-  data.tar.gz: 2eea70d52135a1381d2ae30c2fb03dac37f5a07c0f74ba94875ea8a5fb82b867
+  metadata.gz: 6b1c01b4d2bd5df0119a5da0969ea0f8697880f5e82b951df8fb11e7ff64cef5
+  data.tar.gz: 277fd2a3c47009ae872f84393c2f59700c099ea5da6ad472307c4d581fac8b2f
 SHA512:
-  metadata.gz: 8cf72862f552c4d9de06163653465ea4cf4779f371080b8fb4a345fa1bce9315ad190e12c8cdffaf71ae546d43510804d1574e12a7080e30a35901e3e842d947
-  data.tar.gz: cff63fd75943908ee9084e821c7a6a32d517c729796cbdc705f4928431f27540d904c0ea1080c9248a0542a43cbc660e652d07b0cb69e8e641153956d1354e47
+  metadata.gz: 3bc2bb802a8a058bf9ffb4fb65c5fa2afa9a3fc0578a0956c9ea4e1d2ab1ddc47fe1f2f89ba3afa2e16500c6f4c28a7154caa541d7961075c56c5d8976f4e06f
+  data.tar.gz: bc82a867fa5ee64776a724d46db62c7039c353cbfaaebabb9e822901faea7e3371fe8ca9c8b1324b96decd880c52e46637dc1c871a4a98175c33abe19ee977d3

data/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 0.2.2
+
+- Display `bar_chart` axis labels `x_axis_label` and `y_axis_label`
+- Display `bar_chart` x-axis values below the chart
+- Fix issue with `bar_chart` vertical scaling of grid markers when numbers are larger than 1000 and have `K` in them by disabling `K` formatting for now (the issue was seeing the same marker number twice because two consecutive markers were calculated with similar shortened values; e.g. both 10K when one is 10100 and the other is 10750).
+
 ## 0.2.1
 
 - Fix clipped text of grid markers when they include 1000 displayed as 1K

data/LICENSE.txt

@@ -1,4 +1,4 @@
-Copyright (c) 2023 Andy Maleh
+Copyright (c) 2023-2024 Andy Maleh
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

data/README.md

@@ -1,4 +1,4 @@
-# Graphs and Charts 0.2.1 (Alpha)
+# Graphs and Charts 0.2.2 (Alpha)
 ## [Glimmer DSL for LibUI](https://github.com/AndyObtiva/glimmer-dsl-libui) Custom Controls
 [![Gem Version](https://badge.fury.io/rb/glimmer-libui-cc-graphs_and_charts.svg)](http://badge.fury.io/rb/glimmer-libui-cc-graphs_and_charts)
 [![Join the chat at https://gitter.im/AndyObtiva/glimmer](https://badges.gitter.im/AndyObtiva/glimmer.svg)](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
@@ -14,7 +14,7 @@ Graphs and Charts (Custom Controls) for [Glimmer DSL for LibUI](https://github.c
 Add this line to Bundler `Gemfile`:
 
 ```ruby
-gem 'glimmer-libui-cc-graphs_and_charts', '~> 0.2.1'
+gem 'glimmer-libui-cc-graphs_and_charts', '~> 0.2.2'
 ```
 
 Run:
@@ -332,5 +332,5 @@ Copyright
 
 [MIT](LICENSE.txt)
 
-Copyright (c) 2023 Andy Maleh. See
+Copyright (c) 2023-2024 Andy Maleh. See
 [LICENSE.txt](LICENSE.txt) for further details.

data/VERSION

@@ -1 +1 @@
-0.2.1
+0.2.2

data/examples/graphs_and_charts/basic_bar_chart.rb

@@ -12,6 +12,8 @@ class BasicBarChart
       @bar_chart = bar_chart(
         width: 900,
         height: 300,
+        x_axis_label: 'Month',
+        y_axis_label: 'New Customer Accounts',
         values: {
           'Jan' => 30,
           'Feb' => 49,
@@ -25,7 +27,7 @@ class BasicBarChart
           'Oct' => 68,
           'Nov' => 52,
           'Dec' => 36,
-        }
+        },
       )
       
       on_content_size_changed do

data/glimmer-libui-cc-graphs_and_charts.gemspec

@@ -2,16 +2,16 @@
 # DO NOT EDIT THIS FILE DIRECTLY
 # Instead, edit Juwelier::Tasks in Rakefile, and run 'rake gemspec'
 # -*- encoding: utf-8 -*-
-# stub: glimmer-libui-cc-graphs_and_charts 0.2.1 ruby lib
+# stub: glimmer-libui-cc-graphs_and_charts 0.2.2 ruby lib
 
 Gem::Specification.new do |s|
   s.name = "glimmer-libui-cc-graphs_and_charts".freeze
-  s.version = "0.2.1".freeze
+  s.version = "0.2.2".freeze
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0".freeze) if s.respond_to? :required_rubygems_version=
   s.require_paths = ["lib".freeze]
   s.authors = ["Andy Maleh".freeze]
-  s.date = "2023-12-29"
+  s.date = "2024-01-01"
   s.description = "Graphs and Charts (Custom Controls) for Glimmer DSL for LibUI, like Line Graph.".freeze
   s.email = "andy.am@gmail.com".freeze
   s.extra_rdoc_files = [
@@ -39,7 +39,7 @@ Gem::Specification.new do |s|
 
   s.specification_version = 4
 
-  s.add_runtime_dependency(%q<glimmer-dsl-libui>.freeze, ["~> 0.11".freeze])
+  s.add_runtime_dependency(%q<glimmer-dsl-libui>.freeze, [">= 0.11.8".freeze, "< 2.0.0".freeze])
   s.add_development_dependency(%q<rspec>.freeze, ["~> 3.5.0".freeze])
   s.add_development_dependency(%q<juwelier>.freeze, ["= 2.4.9".freeze])
   s.add_development_dependency(%q<simplecov>.freeze, [">= 0".freeze])

data/lib/glimmer/view/bar_chart.rb

@@ -16,9 +16,19 @@ module Glimmer
       
       DEFAULT_CHART_PADDING_WIDTH = 5.0
       DEFAULT_CHART_PADDING_HEIGHT = 5.0
-      DEFAULT_CHART_GRID_MARKER_PADDING_WIDTH = 37.0
       DEFAULT_CHART_BAR_PADDING_WIDTH_PERCENTAGE = 30.0
       
+      # This is y-axis grid marker padding that is to the left of the bar chart
+      DEFAULT_CHART_GRID_MARKER_PADDING_WIDTH = 37.0
+      # This is x-axis grid marker padding that is below the bar chart
+      DEFAULT_CHART_GRID_MARKER_PADDING_HEIGHT = 30.0
+      
+      # This is y-axis label padding that is to the left of the bar chart
+      DEFAULT_CHART_Y_AXIS_LABEL_PADDING_WIDTH = 25.0
+      
+      # This is x-axis label padding that is below the bar chart
+      DEFAULT_CHART_X_AXIS_LABEL_PADDING_HEIGHT = 25.0
+      
       DEFAULT_CHART_STROKE_GRID = [185, 184, 185]
       DEFAULT_CHART_STROKE_MARKER = [185, 184, 185]
       DEFAULT_CHART_STROKE_MARKER_LINE = [217, 217, 217, thickness: 1, dashes: [1, 1]]
@@ -33,9 +43,20 @@ module Glimmer
       
       option :chart_padding_width, default: DEFAULT_CHART_PADDING_WIDTH
       option :chart_padding_height, default: DEFAULT_CHART_PADDING_HEIGHT
-      option :chart_grid_marker_padding_width, default: DEFAULT_CHART_GRID_MARKER_PADDING_WIDTH
       option :chart_bar_padding_width_percentage, default: DEFAULT_CHART_BAR_PADDING_WIDTH_PERCENTAGE
       
+      # This is y-axis grid marker padding that is to the left of the bar chart
+      option :chart_grid_marker_padding_width, default: DEFAULT_CHART_GRID_MARKER_PADDING_WIDTH
+      
+      # This is x-axis grid marker padding that is below the bar chart
+      option :chart_grid_marker_padding_height, default: DEFAULT_CHART_GRID_MARKER_PADDING_HEIGHT
+      
+      # This is y-axis label padding that is to the left of the bar chart
+      option :chart_y_axis_label_padding_width, default: DEFAULT_CHART_Y_AXIS_LABEL_PADDING_WIDTH
+      
+      # This is x-axis label padding that is below the bar chart
+      option :chart_x_axis_label_padding_height, default: DEFAULT_CHART_X_AXIS_LABEL_PADDING_HEIGHT
+      
       option :chart_stroke_grid, default: DEFAULT_CHART_STROKE_GRID
       option :chart_stroke_marker, default: DEFAULT_CHART_STROKE_MARKER
       option :chart_stroke_marker_line, default: DEFAULT_CHART_STROKE_MARKER_LINE
@@ -57,9 +78,16 @@ module Glimmer
       #   '7' => 03,
       # }
       option :values, default: {}
+      option :x_axis_label, default: nil
+      option :y_axis_label, default: nil
       
       attr_reader :bar_width_including_padding
       
+      before_body do
+        self.chart_y_axis_label_padding_width = 0 if y_axis_label.to_s.empty?
+        self.chart_x_axis_label_padding_height = 0 if x_axis_label.to_s.empty?
+      end
+      
       after_body do
         observe(self, :values) do
           clear_drawing_cache
@@ -89,11 +117,12 @@ module Glimmer
       def clear_drawing_cache
         @y_resolution = nil
         @bar_width_including_padding = nil
-        @grid_marker_points = nil
+        @y_axis_grid_marker_points = nil
         @grid_marker_number_values = nil
         @grid_marker_numbers = nil
         @chart_stroke_marker_values = nil
         @mod_values = nil
+        @y_value_max = nil
       end
       
       def calculate_dynamic_options
@@ -118,11 +147,11 @@ module Glimmer
       end
       
       def width_drawable
-        width - 2.0*chart_padding_width - chart_grid_marker_padding_width
+        width - 2.0*chart_padding_width - chart_grid_marker_padding_width - chart_y_axis_label_padding_width
       end
       
       def height_drawable
-        height - 2.0*chart_padding_height
+        height - 2.0*chart_padding_height - chart_grid_marker_padding_height - chart_x_axis_label_padding_height
       end
       
       def chart_background
@@ -130,34 +159,48 @@ module Glimmer
           fill 255, 255, 255
         }
       end
-  
+      
       def grid_lines
-        line(chart_padding_width, chart_padding_height, chart_padding_width, height - chart_padding_height) {
+        x_axis_grid_lines
+        y_axis_grid_lines
+        x_axis_label_text
+        y_axis_label_text
+      end
+  
+      def x_axis_grid_lines
+        line_y = height - chart_padding_height - chart_grid_marker_padding_height - chart_x_axis_label_padding_height
+        line(chart_x_axis_label_padding_height + chart_padding_width, line_y, width - chart_padding_width, line_y) {
           stroke chart_stroke_grid
         }
-        line(chart_padding_width, height - chart_padding_height, width - chart_padding_width, height - chart_padding_height) {
+      end
+  
+      def y_axis_grid_lines
+        line_x = chart_y_axis_label_padding_width + chart_padding_width
+        line(line_x, chart_padding_height, line_x, height - chart_padding_height - chart_grid_marker_padding_height - chart_x_axis_label_padding_height) {
           stroke chart_stroke_grid
         }
-        grid_marker_number_font = chart_font_marker_text.merge(size: 11)
+        grid_marker_number_font = marker_font
         @grid_marker_number_values ||= []
-        @grid_marker_numbers ||= []
+#         @grid_marker_numbers ||= []
         @chart_stroke_marker_values ||= []
         @mod_values ||= []
-        grid_marker_points.each_with_index do |marker_point, index|
+        y_axis_grid_marker_points.each_with_index do |marker_point, index|
           @grid_marker_number_values[index] ||= begin
-            value = (grid_marker_points.size - index).to_i
+            value = (y_axis_grid_marker_points.size - index).to_i
             value = y_value_max if !y_value_max.nil? && y_value_max.to_i != y_value_max && index == 0
             value
           end
           grid_marker_number_value = @grid_marker_number_values[index]
-          @grid_marker_numbers[index] ||= (grid_marker_number_value >= 1000) ? "#{grid_marker_number_value / 1000}K" : grid_marker_number_value.to_s
-          grid_marker_number = @grid_marker_numbers[index]
+# figuring out how to setup 1K numbers without repeating a number twice is more complicated than just enabling this code
+# disabling for now
+#           @grid_marker_numbers[index] ||= (grid_marker_number_value >= 1000) ? "#{grid_marker_number_value / 1000}K" : grid_marker_number_value.to_s
+          grid_marker_number = grid_marker_number_value.to_s
           @chart_stroke_marker_values[index] ||= BarChart.interpret_color(chart_stroke_marker).tap do |color_hash|
-            color_hash[:thickness] = (index != grid_marker_points.size - 1 ? 2 : 1) if color_hash[:thickness].nil?
+            color_hash[:thickness] = (index != y_axis_grid_marker_points.size - 1 ? 2 : 1) if color_hash[:thickness].nil?
           end
           chart_stroke_marker_value = @chart_stroke_marker_values[index]
           @mod_values[index] ||= begin
-            mod_value_multiplier = ((grid_marker_points.size / max_marker_count) + 1)
+            mod_value_multiplier = ((y_axis_grid_marker_points.size / max_marker_count) + 1)
             [(5 * mod_value_multiplier), 1].max
           end
           mod_value = @mod_values[index]
@@ -173,7 +216,7 @@ module Glimmer
               stroke chart_stroke_marker_value
             }
           end
-          if grid_marker_number_value % mod_value == comparison_value && grid_marker_number_value != grid_marker_points.size
+          if grid_marker_number_value % mod_value == comparison_value && grid_marker_number_value != y_axis_grid_marker_points.size
             line(marker_point[:x], marker_point[:y], marker_point[:x] + width - chart_padding_width, marker_point[:y]) {
               stroke chart_stroke_marker_line
             }
@@ -190,40 +233,90 @@ module Glimmer
         end
       end
       
-      def grid_marker_points
-        if @grid_marker_points.nil?
+      def y_axis_grid_marker_points
+        if @y_axis_grid_marker_points.nil?
           if values.any?
             chart_y_max = [y_value_max, 1].max
-            current_chart_height = (height - chart_padding_height * 2)
+            current_chart_height = (height - chart_padding_height * 2 - chart_grid_marker_padding_height - chart_x_axis_label_padding_height)
             y_value_count = chart_y_max.ceil
-            @grid_marker_points = chart_y_max.to_i.times.map do |marker_index|
-              x = chart_padding_width
+            @y_axis_grid_marker_points = chart_y_max.to_i.times.map do |marker_index|
+              x = chart_y_axis_label_padding_width + chart_padding_width
               y_value = y_value_count - marker_index
               scaled_y_value = y_value.to_f * y_resolution.to_f
-              y = height - chart_padding_height - scaled_y_value
+              y = height - chart_padding_height - chart_grid_marker_padding_height - chart_x_axis_label_padding_height - scaled_y_value
               {x: x, y: y}
             end
           end
         end
 
-        @grid_marker_points
+        @y_axis_grid_marker_points
+      end
+      
+      def x_axis_label_text
+        x_axis_label_font = marker_font
+        x_axis_label_width = estimate_width_of_text(x_axis_label, x_axis_label_font)
+        middle_of_x_axis_label_padding_x = chart_y_axis_label_padding_width + (width - chart_y_axis_label_padding_width)/2.0
+        x_axis_label_x = middle_of_x_axis_label_padding_x - x_axis_label_width/2.0
+        middle_of_x_axis_label_padding_y = height - (chart_x_axis_label_padding_height/2.0)
+        x_axis_label_y = middle_of_x_axis_label_padding_y - x_axis_label_font[:size]/2.0 - 7.0
+        text(x_axis_label_x, x_axis_label_y, x_axis_label_width) {
+          string(x_axis_label) {
+            font x_axis_label_font
+            color chart_color_marker_text
+          }
+        }
       end
       
+      def y_axis_label_text
+        y_axis_label_font = marker_font
+        y_axis_label_width = estimate_width_of_text(y_axis_label, y_axis_label_font)
+        middle_of_y_axis_label_padding_x = chart_y_axis_label_padding_width/2.0
+        y_axis_label_x = middle_of_y_axis_label_padding_x - y_axis_label_width/2.0
+        middle_of_y_axis_label_padding_y = (height - chart_x_axis_label_padding_height)/2.0
+        y_axis_label_y = middle_of_y_axis_label_padding_y - y_axis_label_font[:size]/2.0
+        text(y_axis_label_x, y_axis_label_y, y_axis_label_width) {
+          string(y_axis_label) {
+            font y_axis_label_font
+            color chart_color_marker_text
+          }
+          transform {
+            rotate(middle_of_y_axis_label_padding_x, middle_of_y_axis_label_padding_y, -90)
+          }
+        }
+      end
       def max_marker_count
         [(0.15*height).to_i, 1].max
       end
       
       def bars
         values.each_with_index do |(x_value, y_value), index|
-          x = chart_grid_marker_padding_width + chart_padding_width + (index * bar_width_including_padding) + bar_padding_width
+          x = chart_y_axis_label_padding_width + chart_grid_marker_padding_width + chart_padding_width + (index * bar_width_including_padding) + bar_padding_width
           bar_height = y_value * y_resolution
-          y = height - chart_padding_height - bar_height
+          y = height - chart_grid_marker_padding_height - chart_x_axis_label_padding_height - chart_padding_height - bar_height
           rectangle(x, y, bar_width, bar_height) {
             fill chart_color_bar
           }
+          
+          x_axis_grid_marker_text = x_value.to_s
+          grid_marker_number_font = marker_font
+          x_axis_grid_marker_text_size = estimate_width_of_text(x_axis_grid_marker_text, grid_marker_number_font)
+          middle_of_bar_x = x + bar_width/2.0
+          x_axis_grid_marker_x = middle_of_bar_x - x_axis_grid_marker_text_size/2.0
+          middle_of_x_axis_grid_marker_padding = height - chart_grid_marker_padding_height/2.0 - chart_x_axis_label_padding_height
+          x_axis_grid_marker_y = middle_of_x_axis_grid_marker_padding - chart_font_marker_text[:size]/2.0 - 7.0
+          text(x_axis_grid_marker_x, x_axis_grid_marker_y, x_axis_grid_marker_text_size) {
+            string(x_axis_grid_marker_text) {
+              font grid_marker_number_font
+              color chart_color_marker_text
+            }
+          }
         end
       end
       
+      def marker_font
+        chart_font_marker_text.merge(size: 11)
+      end
+      
       # this is the multiplier that we must multiply by the relative y value
       def y_resolution
         # TODO in the future, we will use the y range, but today, we assume it starts at 0
@@ -238,9 +331,10 @@ module Glimmer
       end
       
       def estimate_width_of_text(text_string, font_properties)
+        return 0 if text_string.to_s.empty?
         # TODO refactor move this method to somewhere common like Glimmer module
         font_size = font_properties[:size] || 16
-        estimated_font_width = 0.62 * font_size
+        estimated_font_width = 0.63 * font_size
         text_string.chars.size * estimated_font_width
       end
       

data/lib/glimmer/view/line_graph.rb

@@ -195,6 +195,7 @@ module Glimmer
             value
           end
           grid_marker_number_value = @grid_marker_number_values[index]
+          # TODO consider not caching the following line as that might save memory and run faster without caching
           @grid_marker_numbers[index] ||= (grid_marker_number_value >= 1000) ? "#{grid_marker_number_value / 1000}K" : grid_marker_number_value.to_s
           grid_marker_number = @grid_marker_numbers[index]
           @graph_stroke_marker_values[index] ||= LineGraph.interpret_color(graph_stroke_marker).tap do |color_hash|
@@ -552,8 +553,9 @@ module Glimmer
       end
       
       def estimate_width_of_text(text_string, font_properties)
+        return 0 if text_string.to_s.empty?
         font_size = font_properties[:size] || 16
-        estimated_font_width = 0.62 * font_size
+        estimated_font_width = 0.63 * font_size
         text_string.chars.size * estimated_font_width
       end
       

metadata

@@ -1,29 +1,35 @@
 --- !ruby/object:Gem::Specification
 name: glimmer-libui-cc-graphs_and_charts
 version: !ruby/object:Gem::Version
-  version: 0.2.1
+  version: 0.2.2
 platform: ruby
 authors:
 - Andy Maleh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-12-29 00:00:00.000000000 Z
+date: 2024-01-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: glimmer-dsl-libui
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.11.8
+    - - "<"
       - !ruby/object:Gem::Version
-        version: '0.11'
+        version: 2.0.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.11.8
+    - - "<"
       - !ruby/object:Gem::Version
-        version: '0.11'
+        version: 2.0.0
 - !ruby/object:Gem::Dependency
   name: rspec
   requirement: !ruby/object:Gem::Requirement