# Subclass

Create your own class, that uses an instance of Victor::SVG.

# Target Image

In the example below, we are creating this grid with random colors.

Note

This class generates output identical to the Class Example.

# Usage Pattern

Create your own class and inherit from Victor::SVG.
In the #initialize method, call #super with any setup attributes.
Optionally, in the #initialize method, call an internal method to generate your SVG.

Tip

When you inherit from Victor::SVG, you can use SVG tags directly through method_missing (as shown in this example).

If you inherit from Victor::SVGBase, you'll need to use the #element method to create SVG tags.

# Code

require 'victor'
require 'debug'

class Grid < Victor::SVG

  attr_reader :cols, :rows, :cell_size, :width, :height, :colors

  def initialize(cols, rows, cell_size: 20)
    @cell_size = cell_size
    @cols = cols
    @rows = rows
    @width = cols * cell_size
    @height = rows * cell_size
    @colors = ['#FF6961', '#77DD77', '#FFD700']

    super viewBox: "0 0 #{width} #{height}"
    generate_grid
  end

private

  def generate_grid
    css['.cell'] = { stroke: :white, rx: (cell_size * 0.1).round }

    cols.times do |col|
      rows.times do |row|
        x = col * cell_size
        y = row * cell_size
        rect class: 'cell', x: x, y: y,
          width: cell_size, height: cell_size,
          fill: colors.sample
      end
    end
  end
end

grid = Grid.new 6, 2
puts grid
grid.save 'grid'

See this example on GitHub

# Subclass

# Target Image

Note

# Usage Pattern

Tip

# Code

# See Also