image_paradise 0.1.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Potentially problematic release.


This version of image_paradise might be problematic. Click here for more details.

Files changed (115) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.md +38 -0
  3. data/README.md +179 -0
  4. data/USAGE.md +10 -0
  5. data/bin/black_white +10 -0
  6. data/bin/display_text_from_this_image +7 -0
  7. data/bin/image_paradise +7 -0
  8. data/bin/image_paradise_shell +7 -0
  9. data/bin/image_to_ascii +54 -0
  10. data/bin/image_to_pdf +7 -0
  11. data/bin/make_this_image_transparent +7 -0
  12. data/bin/rotate_left +7 -0
  13. data/bin/rotate_right +7 -0
  14. data/doc/README.gen +162 -0
  15. data/doc/TODO_FOR_THE_GTK_GUI.md +1 -0
  16. data/image_paradise.gemspec +50 -0
  17. data/lib/image_paradise.rb +5 -0
  18. data/lib/image_paradise/base/base.rb +91 -0
  19. data/lib/image_paradise/black_white.rb +89 -0
  20. data/lib/image_paradise/confree_generator/class.rb +614 -0
  21. data/lib/image_paradise/confree_generator/constants.rb +61 -0
  22. data/lib/image_paradise/confree_generator/gui/gtk_confree_generator.rb +752 -0
  23. data/lib/image_paradise/confree_generator/gui/insert_button.rb +78 -0
  24. data/lib/image_paradise/confree_generator/reset.rb +61 -0
  25. data/lib/image_paradise/confree_generator/shared/shared.rb +100 -0
  26. data/lib/image_paradise/constants.rb +43 -0
  27. data/lib/image_paradise/constants/image_file_types.rb +21 -0
  28. data/lib/image_paradise/create_animated_gif.rb +47 -0
  29. data/lib/image_paradise/crop/crop.rb +302 -0
  30. data/lib/image_paradise/gm_support.rb +34 -0
  31. data/lib/image_paradise/graphs.rb +36 -0
  32. data/lib/image_paradise/graphs/accumulator_bar.rb +29 -0
  33. data/lib/image_paradise/graphs/area.rb +64 -0
  34. data/lib/image_paradise/graphs/bar.rb +117 -0
  35. data/lib/image_paradise/graphs/bar_conversion.rb +53 -0
  36. data/lib/image_paradise/graphs/base.rb +1392 -0
  37. data/lib/image_paradise/graphs/bezier.rb +45 -0
  38. data/lib/image_paradise/graphs/bullet.rb +115 -0
  39. data/lib/image_paradise/graphs/deprecated.rb +42 -0
  40. data/lib/image_paradise/graphs/dot.rb +129 -0
  41. data/lib/image_paradise/graphs/line.rb +328 -0
  42. data/lib/image_paradise/graphs/mini/bar.rb +42 -0
  43. data/lib/image_paradise/graphs/mini/legend.rb +109 -0
  44. data/lib/image_paradise/graphs/mini/pie.rb +42 -0
  45. data/lib/image_paradise/graphs/mini/side_bar.rb +41 -0
  46. data/lib/image_paradise/graphs/net.rb +133 -0
  47. data/lib/image_paradise/graphs/photo_bar.rb +106 -0
  48. data/lib/image_paradise/graphs/pie.rb +139 -0
  49. data/lib/image_paradise/graphs/scatter.rb +264 -0
  50. data/lib/image_paradise/graphs/scene.rb +216 -0
  51. data/lib/image_paradise/graphs/side_bar.rb +144 -0
  52. data/lib/image_paradise/graphs/side_stacked_bar.rb +116 -0
  53. data/lib/image_paradise/graphs/spider.rb +163 -0
  54. data/lib/image_paradise/graphs/stacked_area.rb +73 -0
  55. data/lib/image_paradise/graphs/stacked_bar.rb +68 -0
  56. data/lib/image_paradise/graphs/stacked_mixin.rb +30 -0
  57. data/lib/image_paradise/graphs/themes.rb +117 -0
  58. data/lib/image_paradise/graphviz/README.md +2 -0
  59. data/lib/image_paradise/graphviz/generate_graphviz_image.rb +274 -0
  60. data/lib/image_paradise/gui/gtk/control_panel.rb +126 -0
  61. data/lib/image_paradise/identify.rb +145 -0
  62. data/lib/image_paradise/image_border.rb +231 -0
  63. data/lib/image_paradise/image_manipulations.rb +320 -0
  64. data/lib/image_paradise/image_paradise.rb +150 -0
  65. data/lib/image_paradise/image_to_ascii/image_to_ascii.rb +187 -0
  66. data/lib/image_paradise/image_to_pdf/image_to_pdf.rb +99 -0
  67. data/lib/image_paradise/label/README.md +2 -0
  68. data/lib/image_paradise/label/simple_label.rb +206 -0
  69. data/lib/image_paradise/optimizer.rb +483 -0
  70. data/lib/image_paradise/project/project.rb +29 -0
  71. data/lib/image_paradise/random_text_to_image.rb +363 -0
  72. data/lib/image_paradise/requires/common_base_requires.rb +17 -0
  73. data/lib/image_paradise/requires/require_colours.rb +9 -0
  74. data/lib/image_paradise/requires/require_gtk_components.rb +8 -0
  75. data/lib/image_paradise/requires/require_image_to_ascii.rb +7 -0
  76. data/lib/image_paradise/requires/require_the_image_paradise_project.rb +24 -0
  77. data/lib/image_paradise/requires/require_toplevel_methods.rb +21 -0
  78. data/lib/image_paradise/rotate/README.md +2 -0
  79. data/lib/image_paradise/rotate/rotate.rb +98 -0
  80. data/lib/image_paradise/shell/interactive.rb +156 -0
  81. data/lib/image_paradise/svg/README.md +5 -0
  82. data/lib/image_paradise/svg/circle.rb +106 -0
  83. data/lib/image_paradise/svg/feature.rb +48 -0
  84. data/lib/image_paradise/svg/rectangle.rb +154 -0
  85. data/lib/image_paradise/svg/svg.rb +102 -0
  86. data/lib/image_paradise/to_gif.rb +91 -0
  87. data/lib/image_paradise/to_jpg.rb +90 -0
  88. data/lib/image_paradise/toplevel_methods/add_black_border_to_this_image.rb +56 -0
  89. data/lib/image_paradise/toplevel_methods/crop.rb +28 -0
  90. data/lib/image_paradise/toplevel_methods/e.rb +16 -0
  91. data/lib/image_paradise/toplevel_methods/esystem.rb +19 -0
  92. data/lib/image_paradise/toplevel_methods/extract_text_from_this_image.rb +56 -0
  93. data/lib/image_paradise/toplevel_methods/file_related_code.rb +25 -0
  94. data/lib/image_paradise/toplevel_methods/flip_image_left_right.rb +32 -0
  95. data/lib/image_paradise/toplevel_methods/greyscale_this_image.rb +59 -0
  96. data/lib/image_paradise/toplevel_methods/help.rb +30 -0
  97. data/lib/image_paradise/toplevel_methods/make_this_image_transparent.rb +30 -0
  98. data/lib/image_paradise/toplevel_methods/menu.rb +92 -0
  99. data/lib/image_paradise/toplevel_methods/merge_these_images.rb +49 -0
  100. data/lib/image_paradise/toplevel_methods/mirror_image.rb +28 -0
  101. data/lib/image_paradise/toplevel_methods/misc.rb +31 -0
  102. data/lib/image_paradise/toplevel_methods/png_to_svg.rb +34 -0
  103. data/lib/image_paradise/toplevel_methods/roebe.rb +17 -0
  104. data/lib/image_paradise/toplevel_methods/to_png.rb +105 -0
  105. data/lib/image_paradise/toplevel_methods/wallpaper.rb +37 -0
  106. data/lib/image_paradise/toplevel_methods/write_this_text.rb +76 -0
  107. data/lib/image_paradise/version/version.rb +19 -0
  108. data/test/16x16_red_square_image_for_testing.png +0 -0
  109. data/test/testing_confree_generator.rb +8 -0
  110. data/test/testing_crop.rb +19 -0
  111. data/test/testing_image_magick_commands.rb +39 -0
  112. data/test/testing_image_paradise.rb +49 -0
  113. data/test/testing_the_svg_component.html +261 -0
  114. data/test/testing_the_svg_component.rb +106 -0
  115. metadata +217 -0
@@ -0,0 +1,37 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ # === ImageParadise::SimpleLabel
6
+ #
7
+ # This class will create a simple label.
8
+ # =========================================================================== #
9
+ require 'image_paradise/requires/common_base_requires.rb'
10
+
11
+ module ImageParadise
12
+
13
+ # ========================================================================= #
14
+ # === ImageParadise.wallpaper
15
+ #
16
+ # Use this method if you need to create a wallpaper.
17
+ # ========================================================================= #
18
+ def self.wallpaper(
19
+ colour_to_use = 'black',
20
+ width = '1980',
21
+ height = '1020'
22
+ )
23
+ if colour_to_use.is_a? Hash
24
+ if colour_to_use.has_key? :colour
25
+ colour_to_use = colour_to_use[:colour]
26
+ end
27
+ end
28
+ _ = "convert -size #{width}x#{height} xc:#{colour_to_use} "\
29
+ "#{colour_to_use}image.png"
30
+ esystem _
31
+ end
32
+
33
+ end
34
+
35
+ if __FILE__ == $PROGRAM_NAME
36
+ ImageParadise.wallpaper
37
+ end
@@ -0,0 +1,76 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ # require 'image_paradise/toplevel_methods/write_this_text.rb'
6
+ # =========================================================================== #
7
+ require 'image_paradise/toplevel_methods/misc.rb'
8
+
9
+ module ImageParadise
10
+
11
+ # ========================================================================= #
12
+ # === ImageParadise.write_this_text
13
+ #
14
+ # This will write to an image file.
15
+ #
16
+ # Invocation example:
17
+ #
18
+ # ImageParadise.write_this_text('Bachelor', {colour: 'red', height: 80, width: 250})
19
+ #
20
+ # ========================================================================= #
21
+ def self.write_this_text(
22
+ text = DEFAULT_TEXT,
23
+ hash_options = {}
24
+ )
25
+ hash = hash_options # Shorter pointer.
26
+ height = hash[:height].to_s
27
+ width = hash[:width].to_s
28
+ # use_this_font = ' -font Rekha'
29
+ # use_this_font = " -font 'Nimbus Mono L'"
30
+ use_this_font = " -font 'Luxi-Serif-Bold'"
31
+ _ = 'convert '
32
+ if hash.has_key? :colour
33
+ _ << ' -fill '+hash[:colour].to_s
34
+ else
35
+ _ << ' -fill white'
36
+ end
37
+ _ << use_this_font
38
+ _ << ' -background white'
39
+ # ======================================================================= #
40
+ # If the user supplied the value for :pointsize, then we will use it.
41
+ # ======================================================================= #
42
+ if hash.has_key? :pointsize
43
+ _ << ' -pointsize '+hash[:pointsize].to_s
44
+ else # Otherwise we will use a default value.
45
+ _ << ' -pointsize 28'
46
+ end
47
+ _ << " label:'"+text+"'"
48
+ _ << ' -weight 600'
49
+ _ << ' -gravity center' # Align into the middle.
50
+ # ======================================================================= #
51
+ # width-height setting.
52
+ # See:
53
+ # https://www.imagemagick.org/script/command-line-options.php#size
54
+ # ======================================================================= #
55
+ _ << ' -size '+width+'x'+height
56
+ _ << ' -extent '+width+'x'+height
57
+ # ======================================================================= #
58
+ # Add a border.
59
+ # ======================================================================= #
60
+ _ << ' -bordercolor black -border 1'
61
+ sanitized_text = text.tr(' ','_').dup
62
+ if hash[:upcase_filename]
63
+ sanitized_text.upcase!
64
+ end
65
+ # ======================================================================= #
66
+ # Next, decide where to store the image file.
67
+ # ======================================================================= #
68
+ store_here = sanitized_text+'.png'
69
+ if ImageParadise.store_image_files_in_this_directory?
70
+ store_here.prepend(ImageParadise.store_image_files_in_this_directory?)
71
+ end
72
+ _ << ' '+store_here
73
+ esystem _
74
+ end
75
+
76
+ end
@@ -0,0 +1,19 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ # require 'image_paradise/version/version.rb'
6
+ # =========================================================================== #
7
+ module ImageParadise
8
+
9
+ # ========================================================================= #
10
+ # === VERSION
11
+ # ========================================================================= #
12
+ VERSION = '0.1.12'
13
+
14
+ # ========================================================================= #
15
+ # === LAST_UPDATE
16
+ # ========================================================================= #
17
+ LAST_UPDATE = '25.12.2020'
18
+
19
+ end
@@ -0,0 +1,8 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ require 'image_paradise'
6
+ require 'colours/autoinclude'
7
+
8
+ e 'Now testing the project called '+sfancy('image_paradise')+'.'
@@ -0,0 +1,19 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ require 'fileutils'
6
+ require 'image_paradise'
7
+ require 'colours/autoinclude'
8
+
9
+ e 'Now testing the project called '+sfancy('image_paradise')+', '\
10
+ 'the crop() functionality.'
11
+
12
+ image_file = '/Depot/j/test.png'
13
+ FileUtils.cp('/home/x/DATA/IMG/NJOY/Cute_Biker.png', image_file)
14
+ e 'First testing ImageParadise::Crop[]'
15
+ ImageParadise::Crop[image_file]
16
+ e 'Next testing ImageParadise::Crop.new'
17
+ ImageParadise::Crop.new(image_file)
18
+ e 'Finally testing ImageParadise::Crop.crop'
19
+ ImageParadise::Crop.crop(image_file)
@@ -0,0 +1,39 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ require 'image_paradise'
6
+ require 'colours/autoinclude'
7
+
8
+ e
9
+ e "Next testing the project called `#{sfancy('image_paradise')}`."
10
+ e
11
+
12
+ USE_THIS_FILE = '/Depot/j/test.png'
13
+
14
+ Dir.chdir('/Depot/j/') # <- Directory must exist if you wish to run the tests here.
15
+
16
+ e 'Will put the images into '+sdir('/Depot/j')
17
+
18
+ image = ImageParadise::ImageManipulations.new(USE_THIS_FILE)
19
+ e image.identify # => "image.png PNG 500x500 500x500+0+0 8-bit DirectClass 236KB 0.010u 0:00.010\n"
20
+ e ImageParadise.identify(USE_THIS_FILE)
21
+ image.shrink '80%'
22
+ e image.dimensions # => { x: 250, y: 250 }
23
+ image.convert('thumbnail.png', quality: 80, crop: '250x250>') # => true
24
+
25
+ image = ImageParadise::ImageManipulations.new('multi-page.pdf')
26
+ image.filename_changed? # => false
27
+ image.manipulate!(format: "png", layer: 0) # => true
28
+ image.filename_changed? # => true
29
+ image.file # => "multi-page.png"
30
+
31
+ image = ImageParadise::ImageManipulations.new('multi-page.pdf')
32
+ image.manipulate!(format: "png") # => true
33
+ image.filename_changed? # => true
34
+
35
+ # on ImageMagick it returns all layers as a single file
36
+ image.file # => "multi-page-*.png"
37
+
38
+ # on GrapicksMagick it returns only the fist layer
39
+ image.file # => "multi-page.png"
@@ -0,0 +1,49 @@
1
+ #!/usr/bin/ruby -w
2
+ # Encoding: UTF-8
3
+ # frozen_string_literal: true
4
+ # =========================================================================== #
5
+ require 'colours/autoinclude'
6
+ require 'fileutils'
7
+ require 'image_paradise'
8
+ require 'opn'
9
+ input_file = '/home/x/DATA/IMG/NJOY/RandomBeachGal.jpg'
10
+ opn; e 'The main image file will be '+sfile(input_file)+' for now.'
11
+ name_of_the_file = File.basename(input_file)
12
+ _ = '/Depot/j/'+name_of_the_file
13
+ opn; e 'We will first copy '+sfile(input_file)+' to '+sfile(_)
14
+ FileUtils.cp(input_file, _)
15
+ # =========================================================================== #
16
+ # Ok, we copied stuff - now it is time to test ImageParadise directly.
17
+ # =========================================================================== #
18
+ cliner {
19
+ e
20
+ opn; e 'Now testing '+sfancy('crop()')+' functionality for the input `'+sfancy(_)+'`:'
21
+ ImageParadise.crop(_, '350x250+5', store_in_this_directory: '/Depot/Images/')
22
+ e
23
+ opn; e 'Now testing '+sfancy('crop()')+' functionality with 50% cropping:'
24
+ ImageParadise.crop(_, '55%', store_in_this_directory: '/Depot/Images/')
25
+ e
26
+ }; e
27
+ # =========================================================================== #
28
+ # Next we test font_tiled.
29
+ # =========================================================================== #
30
+ cliner {
31
+ ImageParadise.font_tiled
32
+ ImageParadise.font_tiled 'How do you do?'
33
+ }; e # test_image
34
+ # =========================================================================== #
35
+ # Next we use identify.
36
+ # =========================================================================== #
37
+ cliner {
38
+ e 'Next we will identify the image at '+sfile(_)
39
+ ImageParadise::Identify.new(_).report_internal_attributes
40
+ }; e
41
+ # =========================================================================== #
42
+ # Next we can create animated gifs, but we will do so when we have
43
+ # gif files to work with.
44
+ # =========================================================================== #
45
+ # ImageParadise.create_animated_gif
46
+ cliner {
47
+ e 'Next we will test the graphs.'
48
+ e 'Not yet done ...'
49
+ }
@@ -0,0 +1,261 @@
1
+ <html><svg height="100" width="100">
2
+ <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" /></svg>
3
+
4
+ <svg height="150" width="150">
5
+ <circle cx="50" cy="50" r="5" stroke="black" stroke-width="blue" fill="150" /></svg>
6
+
7
+ <svg height="250" width="250">
8
+ <circle cx="50" cy="50" r="5" stroke="black" stroke-width="blue" fill="250" /></svg>
9
+
10
+ <svg height="100" width="100">
11
+ <circle cx="50" cy="50" r="10" stroke="black" stroke-width="3" fill="grey" /></svg>
12
+
13
+ <svg height="100" width="100">
14
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="slateblue" /></svg>
15
+
16
+ <svg height="100" width="100">
17
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="grey" /></svg>
18
+
19
+ <svg height="100" width="100">
20
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="brown" /></svg>
21
+
22
+ <svg height="100" width="100">
23
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="cyan" /></svg>
24
+
25
+ <svg height="100" width="100">
26
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="darksalmon" /></svg>
27
+
28
+ <svg height="100" width="100">
29
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="darkslateblue" /></svg>
30
+
31
+ <svg height="100" width="100">
32
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="darkgoldenrod" /></svg>
33
+
34
+ <svg height="100" width="100">
35
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="darksalmon" /></svg>
36
+
37
+ <svg height="100" width="100">
38
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="blanchedalmond" /></svg>
39
+
40
+ <br>
41
+ <svg height="100" width="100">
42
+ <circle cx="50" cy="50" r="1" stroke="black" stroke-width="3" fill="peachpuff" /></svg>
43
+
44
+ <svg height="100" width="100">
45
+ <circle cx="50" cy="50" r="2" stroke="black" stroke-width="3" fill="lightcoral" /></svg>
46
+
47
+ <svg height="100" width="100">
48
+ <circle cx="50" cy="50" r="3" stroke="black" stroke-width="3" fill="ivory" /></svg>
49
+
50
+ <svg height="100" width="100">
51
+ <circle cx="50" cy="50" r="4" stroke="black" stroke-width="3" fill="lightsalmon" /></svg>
52
+
53
+ <svg height="100" width="100">
54
+ <circle cx="50" cy="50" r="5" stroke="black" stroke-width="3" fill="darkslategrey" /></svg>
55
+
56
+ <svg height="100" width="100">
57
+ <circle cx="50" cy="50" r="6" stroke="black" stroke-width="3" fill="lightcoral" /></svg>
58
+
59
+ <svg height="100" width="100">
60
+ <circle cx="50" cy="50" r="7" stroke="black" stroke-width="3" fill="darkslateblue" /></svg>
61
+
62
+ <svg height="100" width="100">
63
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="snow" /></svg>
64
+
65
+ <svg height="100" width="100">
66
+ <circle cx="50" cy="50" r="9" stroke="black" stroke-width="3" fill="palevioletred" /></svg>
67
+
68
+ <svg height="100" width="100">
69
+ <circle cx="50" cy="50" r="10" stroke="black" stroke-width="3" fill="maroon" /></svg>
70
+
71
+ <br>
72
+ <svg height="100" width="100">
73
+ <circle cx="50" cy="50" r="1" stroke="black" stroke-width="3" fill="chocolate" /></svg>
74
+
75
+ <svg height="100" width="100">
76
+ <circle cx="50" cy="50" r="2" stroke="black" stroke-width="3" fill="chocolate" /></svg>
77
+
78
+ <svg height="100" width="100">
79
+ <circle cx="50" cy="50" r="3" stroke="black" stroke-width="3" fill="chocolate" /></svg>
80
+
81
+ <svg height="100" width="100">
82
+ <circle cx="50" cy="50" r="4" stroke="black" stroke-width="3" fill="chocolate" /></svg>
83
+
84
+ <svg height="100" width="100">
85
+ <circle cx="50" cy="50" r="5" stroke="black" stroke-width="3" fill="chocolate" /></svg>
86
+
87
+ <svg height="100" width="100">
88
+ <circle cx="50" cy="50" r="6" stroke="black" stroke-width="3" fill="chocolate" /></svg>
89
+
90
+ <svg height="100" width="100">
91
+ <circle cx="50" cy="50" r="7" stroke="black" stroke-width="3" fill="chocolate" /></svg>
92
+
93
+ <svg height="100" width="100">
94
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="3" fill="chocolate" /></svg>
95
+
96
+ <svg height="100" width="100">
97
+ <circle cx="50" cy="50" r="9" stroke="black" stroke-width="3" fill="chocolate" /></svg>
98
+
99
+ <svg height="100" width="100">
100
+ <circle cx="50" cy="50" r="10" stroke="black" stroke-width="3" fill="chocolate" /></svg>
101
+
102
+ <svg height="100" width="100">
103
+ <circle cx="50" cy="50" r="11" stroke="black" stroke-width="3" fill="chocolate" /></svg>
104
+
105
+ <svg height="100" width="100">
106
+ <circle cx="50" cy="50" r="12" stroke="black" stroke-width="3" fill="chocolate" /></svg>
107
+
108
+ <svg height="100" width="100">
109
+ <circle cx="50" cy="50" r="13" stroke="black" stroke-width="3" fill="chocolate" /></svg>
110
+
111
+ <svg height="100" width="100">
112
+ <circle cx="50" cy="50" r="14" stroke="black" stroke-width="3" fill="chocolate" /></svg>
113
+
114
+ <svg height="100" width="100">
115
+ <circle cx="50" cy="50" r="15" stroke="black" stroke-width="3" fill="chocolate" /></svg>
116
+
117
+ <br>
118
+ <svg height="100" width="100">
119
+ <circle cx="50" cy="50" r="3" stroke="black" stroke-width="8" fill="royalblue" /></svg>
120
+
121
+ <svg height="100" width="100">
122
+ <circle cx="50" cy="50" r="4" stroke="black" stroke-width="9" fill="royalblue" /></svg>
123
+
124
+ <svg height="100" width="100">
125
+ <circle cx="50" cy="50" r="5" stroke="black" stroke-width="9" fill="royalblue" /></svg>
126
+
127
+ <svg height="100" width="100">
128
+ <circle cx="50" cy="50" r="6" stroke="black" stroke-width="6" fill="royalblue" /></svg>
129
+
130
+ <svg height="100" width="100">
131
+ <circle cx="50" cy="50" r="7" stroke="black" stroke-width="9" fill="royalblue" /></svg>
132
+
133
+ <svg height="100" width="100">
134
+ <circle cx="50" cy="50" r="8" stroke="black" stroke-width="7" fill="royalblue" /></svg>
135
+
136
+ <svg height="100" width="100">
137
+ <circle cx="50" cy="50" r="9" stroke="black" stroke-width="7" fill="royalblue" /></svg>
138
+
139
+ <svg height="100" width="100">
140
+ <circle cx="50" cy="50" r="10" stroke="black" stroke-width="5" fill="royalblue" /></svg>
141
+
142
+ <svg height="100" width="100">
143
+ <circle cx="50" cy="50" r="11" stroke="black" stroke-width="9" fill="royalblue" /></svg>
144
+
145
+ <svg height="100" width="100">
146
+ <circle cx="50" cy="50" r="12" stroke="black" stroke-width="8" fill="royalblue" /></svg>
147
+
148
+ <svg height="100" width="100">
149
+ <circle cx="50" cy="50" r="13" stroke="black" stroke-width="9" fill="royalblue" /></svg>
150
+
151
+ <svg height="100" width="100">
152
+ <circle cx="50" cy="50" r="14" stroke="black" stroke-width="9" fill="royalblue" /></svg>
153
+
154
+ <svg height="100" width="100">
155
+ <circle cx="50" cy="50" r="15" stroke="black" stroke-width="5" fill="royalblue" /></svg>
156
+
157
+ <svg height="100" width="100">
158
+ <circle cx="50" cy="50" r="16" stroke="black" stroke-width="7" fill="royalblue" /></svg>
159
+
160
+ <svg height="100" width="100">
161
+ <circle cx="50" cy="50" r="17" stroke="black" stroke-width="8" fill="royalblue" /></svg>
162
+
163
+ <br>
164
+ Now testing rectangle<br>
165
+ <svg width="400" height="180">
166
+
167
+ <rect width="320" height="144" style="fill:red;stroke-width:3;stroke:rgb(0,0,0)">
168
+ </svg>
169
+
170
+ <svg width="400" height="180">
171
+
172
+ <rect width="320" height="144" style="fill:green;stroke-width:3;stroke:rgb(0,0,0)">
173
+ </svg>
174
+
175
+ <svg width="400" height="180">
176
+
177
+ <rect width="320" height="144" style="fill:plum;stroke-width:3;stroke:rgb(0,0,0)">
178
+ </svg>
179
+
180
+ <svg width="400" height="180">
181
+
182
+ <rect width="320" height="144" style="fill:lemonchiffon;stroke-width:3;stroke:rgb(0,0,0)">
183
+ </svg>
184
+
185
+ <br>
186
+ Next testing transparent rectangles (via opacity).<br>
187
+ <svg width="400" height="180">
188
+
189
+ <rect width="320" height="144" style="opacity: 0.1;fill:fuchsia;stroke-width:3;stroke:rgb(0,0,0)">
190
+ </svg>
191
+
192
+ <svg width="400" height="180">
193
+
194
+ <rect width="320" height="144" style="opacity: 0.2;fill:green;stroke-width:3;stroke:rgb(0,0,0)">
195
+ </svg>
196
+
197
+ <svg width="400" height="180">
198
+
199
+ <rect width="320" height="144" style="opacity: 0.3;fill:mediumblue;stroke-width:3;stroke:rgb(0,0,0)">
200
+ </svg>
201
+
202
+ <svg width="400" height="180">
203
+
204
+ <rect width="320" height="144" style="opacity: 0.4;fill:indigo;stroke-width:3;stroke:rgb(0,0,0)">
205
+ </svg>
206
+
207
+ <br>
208
+ <svg width="400" height="180">
209
+
210
+ <rect width="320" height="144" style="opacity: 0.5;fill:lightslategray;stroke-width:3;stroke:rgb(0,0,0)">
211
+ </svg>
212
+
213
+ <svg width="400" height="180">
214
+
215
+ <rect width="320" height="144" style="opacity: 0.6;fill:darkslategray;stroke-width:3;stroke:rgb(0,0,0)">
216
+ </svg>
217
+
218
+ <svg width="400" height="180">
219
+
220
+ <rect width="320" height="144" style="opacity: 0.7;fill:chartreuse;stroke-width:3;stroke:rgb(0,0,0)">
221
+ </svg>
222
+
223
+ <svg width="400" height="180">
224
+
225
+ <rect width="320" height="144" style="opacity: 0.8;fill:lightskyblue;stroke-width:3;stroke:rgb(0,0,0)">
226
+ </svg>
227
+
228
+ <br>
229
+ <svg width="400" height="180">
230
+
231
+ <rect width="320" height="144" style="opacity: 0.9;fill:paleturquoise;stroke-width:3;stroke:rgb(0,0,0)">
232
+ </svg>
233
+
234
+ <svg width="400" height="180">
235
+
236
+ <rect width="320" height="144" style="opacity: 1.0;fill:lightskyblue;stroke-width:3;stroke:rgb(0,0,0)">
237
+ </svg>
238
+
239
+ <br>
240
+ <svg width="400" height="180">
241
+
242
+ <rect x="50" y="20" rx="20" ry="20" width="320" height="144" style="fill:lightgreen;stroke-width:3;stroke:rgb(0,0,0)">
243
+ </svg>
244
+
245
+ <svg width="400" height="180">
246
+
247
+ <rect x="50" y="20" rx="20" ry="20" width="320" height="144" style="fill:whitesmoke;stroke-width:3;stroke:rgb(0,0,0)">
248
+ </svg>
249
+
250
+ <svg width="400" height="180">
251
+
252
+ <rect x="50" y="20" rx="20" ry="20" width="320" height="144" style="fill:rosybrown;stroke-width:3;stroke:rgb(0,0,0)">
253
+ </svg>
254
+
255
+ <svg width="400" height="180">
256
+
257
+ <rect x="50" y="20" rx="20" ry="20" width="320" height="144" style="fill:snow;stroke-width:3;stroke:rgb(0,0,0)">
258
+ </svg>
259
+
260
+ <br>
261
+ </html>