Module:SVG Chart

From Wikimedia Commons, the free media repository
Jump to navigation Jump to search
Lua

CodeDiscussionEditHistoryLinksLink count Subpages:DocumentationTestsResultsSandboxLive code All modules

This template creates charts by the generation of code for an SVG file. The special feature is that the data is retained in its original format and can be easily supplemented or changed later. In particular, a clear structure is produced, which can easily modified with any text editor.

Quick start

[edit]
Copy sample template:
{{#invoke: SVG_Chart | SVGChart |
| XAxisText    = Year
| YAxisText    = Index

| XMin         = 1990
| XMax         = 2015
| YMin         = 6
| YMax         = 13
| Graph1Values =       
     2006 10.16
     2009 10.7
     2012 11.29
}}
Copy the resulting preview text into a text file chart.svg and open this file in your browser or SVG viewer.

You get a result like this:

Usage

[edit]
  1. Create the template {{SVG Chart}} somewhere. This means: put for instance the text in the light gray box above, which starts with {{#invoke: SVG_Chart | SVGChart | on some existing page, for instance, your own user page here on Wikimedia Commons (not on Wikipedia, where it will not have any effect).
  2. Adjust the numbers and put in your own data and descriptions of the axes. Note that if you put any text in your graph, you automatically restrict its usage to a single language version of Wikipedia; consider whether descriptions of the axes are really needed.
  3. Press the "Preview" button. You now see a page with instructions followed by the source code of an SVG file on a light gray background. The instructions at the top match the next few steps in this list here.
  4. Paste (with mouse) and copy (<Ctrl>+<C>) the text in the light gray box. It starts with the line <?xml version="1.0" encoding="UTF-8" ?> and consists of about 200 lines of text.
  5. Create an empty SVG file e.g. mychart.svg on your computer.
  6. Open that file with a plain text editor, e.g. Notepad.
  7. Paste (<Ctrl>+<V>) the copied data into the text file. Save that file (<Ctrl>+<S>).
  8. Check the file by drag and drop on your browser, with Jarry1250's SVG Check or File:Test.svg. If you did not change the data in step 2, you will see a red and a blue W.
  9. If the check is successfully, store your file with Commons:Upload.
  10. After uploading, put the source code (the text that starts with {{SVG Chart) on the Talk page of the newly created Commons file (go to the file, and click on the "Discussion" tab at the top of the page) so that others can easily update your graph in the future.

Main parameters

[edit]

Required parameters

[edit]
Param Description Value Default
Graph1Values
...
Graph6Values
Any number of pairs of numbers are entered here. The first number of each pair is the x value. The second number of each pair is the y value. The numbers must be separated by spaces. For better readability, in the svg file, there should be 5 spaces before each pair of values. Couples of numbers -

Optional parameters

[edit]
Param Description Value Default
Title A general short title for the diagram. This title is visible on top of the chart and readable in programs. Text -

Description The description can contain more informations to the diagram, for example the source of data. This information is not visible on the generated chart. Text -

XMin, XMax Range of values on x axis. Numbers 0, 100

YMin, YMax Range of values on y axis. Numbers 0,   50

XAxisText Description of values of x axis. Text -

YAxisText Description of values of Y axis. Text -

The differences of XMax - XMin and YMax - YMin should so far as possible similar. If not, divide or multiply the x or y chart values by multiples of 10.

Additional optional parameters

[edit]

Axis

[edit]

Every axis is shown automatically. Commonly are to be shown markers on axis. This is possible with the following values:

Param Description Value Default
XAxisMarkOffset YAxisMarkOffset The displacement of the first marker in relation to the axis origin. Numbers 0

XAxisMarkStep YAxisMarkStep The distance of the markers, should be the 5th to 10th part of whole length. Numbers 1

XAxisMarkStep2 The distance of the intermediate markers, should be the 2th to 5th part of XAxisMarkStep. Number -

XAxisValueStart YAxisValueStart The number of the first value. Number XMin, YMin

XAxisValueStep YAxisValueStep The difference of number of following numbers. Number XAxisMarkStep YAxisMarkStep

XAxisValuePosStart YAxisValuePosStart The position of the first value. Number coordinate origin

XAxisValuePosStep YAxisValuePosStep The distance of following values. Number XAxisMarkStep YAxisMarkStep

XAxisValueRound YAxisValueRound The values of the axes are rounded with the herewith given precision. Number -

XAxisValueSVG YAxisValueSVG The text of the axis is completely replaced by the herewith provided SVG instructions. For this you can use the generated svg instructions which are included in the IDs "axistext-x" and "axistext-y". Text -

YAxisTextX, YAxis2TextX Position of axis description in percent. Value 100

YAxisValueSuffix A suffix for values, e.g. %. If needed, a space is to write additional. Text -

Grid

[edit]

You can realize vertical and horizontal grid lines. The following parameters are available:

Param Description Value Default
XGrid Value of distance of vertical or lines. Number XAxisMarkStep

YGrid Value of distance of horizontal lines. Number YAxisMarkStep

Legend

[edit]
Param Description Value Default
LegendType Type of legend.

none - none legend
box - names of charts in column
line - names of charts side by side (experimental)

Text box

Graph1Text

Graph6Text
Name of the corresponding chart. Text Simple name

LegendX Position of left side of legend to coordinate origin, in percent. Number 100

LegendY Position of top of legend to coordinate origin, in percent. Number 100

LegendWidth Width of legend. Number Fixed internal value

LegendBorder none, if border shall not be visible. Text Yes

LegendSVG The legend of the diagram is completely replaced by herewith provided SVG instructions. Text -

Additional text

[edit]
Param Description Value Default
Text1

Text6
Any text. May be a description for a chart inside of the diagram. Text Graph1Text

Graph6Text

Text1X

Text1X
The horizontal position of the text. Must be a number between XMin and XMax. Number 0

Text1Y

Text1Y
The vertical position of the text. Must be a number between YMin and YMax. Number 0

Graph

[edit]
Param Description Value Default
Graph1Color

Graph6Color
Color of chart line. May be rgb(75%, 10%, 10%) and other. Color term blue, red, …

Graph1Line

Graph6Line
none, if line of chart shall not be visible. Number -

LineWidth Thickness of all lines. Number 100

Line1Width Thickness of first line. Number LineWidth

Marker

[edit]

An alternate possibility is to show markers. In this case, the line stay visible or be off.

Param Description Value Default
Graph1Marker

Graph6Marker
Type of marker for corresponding chart.
1 - Square
2 - Triangle
3 - Circle
...
6 - ?
Number Fixed internal type

Graph1MarkerSize

Graph6MarkerSize
Size of chart marker in percent. Number 100

Graph1MarkerFill

Graph6MarkerFill
Color of the filling or none. Color term Color of the border

Image size

[edit]
Param Description Value Default
GraphStretchWidth Width of the chart in percent. This value should be between 100 and 300. Number 100

GraphStretchHeight Height of the chart in percent. This value should be between 100 and 300. Number 100

ImageSize This parameter changes the overall size of the image. The graphs, lines and text are changed proportionally. Number 100

ImageTop Modification of the space on top of the diagram. Number internal value

ImageRight Modification of the space on the right side of the diagram in percent to the whole size of image. Number internal value, about 10

ImageBottom Modification of the space below the diagram. Number internal value

ImageLeft Modification of the space on the left side of the diagram. Number internal value

ElementsWidth Width and size of alle image elements like lines, text and markers. Number 100

Font size

[edit]
Param Description Value Default
FontSize General font size in percent. Number 100

FontSizeTitle Font size of the title text in percent. Number 100

LegendFontSize Font size of legend text in percent. Number General font size

XAxisFontSize, YAxisFontSize Font sizes of axis text in percent. Value 100

ChartTextFontSize Font size of chart text in percent. Number 100

SVG additionals

[edit]
Param Description Value Default
BackgroundSVG SVG instructions for the background of the chart area. Text -

ForegroundSVG SVG instructions for the foreground of the chart area. Text -

BackgroundImageSVG SVG instructions for the whole background. Text -

Correction of errors of the Wikipedia software

[edit]
Param Description Value Default
XAxisValueDYlibrsvg, + YAxisValueDYlibrsvg Move misplaced axis text. Text -

Example

[edit]

Sample

[edit]
{{SVG Chart
| Title        = My test chart
| XAxisText    = Year
| YAxisText    = Index

| XMin         = 1990
| XMax         = 2015
| YMin         = 6
| YMax         = 13
| Graph1Values =       
     1991 7.59
     1994 8.56
     1997 9
     2000 9.27
     2003 9.69
     2006 10.16
     2009 10.7
     2012 11.29
}}

More examples

[edit]

For further examples look here.

Upload

[edit]
  • After the upload insert before {{int:filedesc}}
{{handSVG|||H}}
  • Insert after {{int:filedesc}}
== Generated with ''Wikimedia SVG Chart'' ==
{{SVG Chart/box}}
  • Add the category to the image
[[Category:Created with Commons SVG Chart]]
  • Add the source code of chart to the talk page additional with the headline == Source ==.

Development

[edit]

If you have a question or a suggestion, share this here.

For more informations see: Programming of Wikimedia SVG Chart.

Code

-------- SVG Chart Generator --------
--[[ code conventions:
  - normally lua don't differentiate data formats but in the following processing is it sometime helpfull 
    to differentiate: - is to use the original input string or a (max(min) value of that string
    furthermore lua do internal assign types e.g. after "tonumber", "tonumber" avoid often type conversions
  - prefix of variables:
    g - global
    t - table
    b - boolean, true/false (intern: double, string)
    d - double
    i - integer (intern: double)
    s - string
  
  - suffix of variables:
    Px  - for sizes in pixel
    100 - means a value in %
    Rel - means a value in relation to 1
    Fix - for user defined values
  ]]

---- predefined values ----
MAXCHARTNUMBER     =   8              -- max number of processible charts, for visibnility and from experience a good max number

IMAGESIZE          = 750              -- general visible size of the whole image in px
FONTSIZE           =   6
AXISMARKLENGTHREL  = 1.85             -- general relation to the diagram size, 3.5 * 0.5
AXISMARKLENGTH2REL = 0.6              -- relation to AXISMARKLENGTHREL

---- sub modules ----
require ("Module:SVG_Chart/error")
require ("Module:SVG_Chart/standard")
require ("Module:SVG_Chart/init")
require ("Module:SVG_Chart/svg-head")
require ("Module:SVG_Chart/svg-viewbox")
require ("Module:SVG_Chart/svg-axis")
require ("Module:SVG_Chart/svg-axistext")
require ("Module:SVG_Chart/svg-graphs")
require ("Module:SVG_Chart/svg-marker")
require ("Module:SVG_Chart/svg-legend")
require ("Module:SVG_Chart/svg-text")


---- global variables ----

gsDebug         = ''
gsDebugStandard = ''   -- for additional standard functions string..., math..., ...
gbDebug         = nil
gsValuesFirstSpace = "     "


----  ----
local function WikiTextFirst ()
    return
        "Mark and copy the following text. Paste it into a plain text file. The text file should have an svg extension, for example ''mychart.svg''.\n\n" ..
        "You can check the result [http://toolserver.org/~jarry/svgcheck/stable/index.php here] or [[:File:Test.svg|here]].\n"
end


---- public functions ----
local p = {}

local dYAxis2Width
---- SVGChart (), main function ----
function p.main (frame)
    local tsGraphValues  = {frame.args.Graph1Values, frame.args.Graph2Values, frame.args.Graph3Values, frame.args.Graph4Values, frame.args.Graph5Values, frame.args.Graph6Values, frame.args.Graph7Values, frame.args.Graph8Values}
    local tsGraphLine    = {frame.args.Graph1Line,   frame.args.Graph2Line,   frame.args.Graph3Line,   frame.args.Graph4Line,   frame.args.Graph5Line,   frame.args.Graph6Line,   frame.args.Graph7Line,   frame.args.Graph8Line}
    local tsGraphFill    = {frame.args.Graph1Fill,   frame.args.Graph2Fill,   frame.args.Graph3Fill,   frame.args.Graph4Fill,   frame.args.Graph5Fill,   frame.args.Graph6Fill,   frame.args.Graph7Fill,   frame.args.Graph8Fill}
    local tsGraphText    = {frame.args.Graph1Text,   frame.args.Graph2Text,   frame.args.Graph3Text,   frame.args.Graph4Text,   frame.args.Graph5Text,   frame.args.Graph6Text,   frame.args.Graph7Text,   frame.args.Graph8Text}
    local tsGraphColor   = {frame.args.Graph1Color or   'rgb(00%, 00%, 70%)',
                            frame.args.Graph2Color or   'rgb(75%, 10%, 10%)',
                            frame.args.Graph3Color or   'rgb(00%, 60%, 00%)',
                            frame.args.Graph4Color or   'rgb(00%, 60%, 60%)',
                            frame.args.Graph5Color or   'rgb(60%, 00%, 60%)',
                            frame.args.Graph6Color or   'rgb(60%, 60%, 00%)',
                            frame.args.Graph7Color or   'rgb(30%, 00%, 30%)',
                            frame.args.Graph8Color or   'rgb(50%, 70%, 50%)'
                           }
    local tsGraphMarker     = {frame.args.Graph1Marker,     frame.args.Graph2Marker,     frame.args.Graph3Marker,     frame.args.Graph4Marker,     frame.args.Graph5Marker,     frame.args.Graph6Marker,     frame.args.Graph7Marker,     frame.args.Graph8Marker}
    local tsGraphMarkerFill = {frame.args.Graph1MarkerFill, frame.args.Graph2MarkerFill, frame.args.Graph3MarkerFill, frame.args.Graph4MarkerFill, frame.args.Graph5MarkerFill, frame.args.Graph6MarkerFill, frame.args.Graph7MarkerFill, frame.args.Graph8MarkerFill}
    local tdGraphMarkerSize = {frame.args.Graph1MarkerSize, frame.args.Graph2MarkerSize, frame.args.Graph3MarkerSize, frame.args.Graph4MarkerSize, frame.args.Graph5MarkerSize, frame.args.Graph6MarkerSize, frame.args.Graph7MarkerSize, frame.args.Graph8MarkerSize}

    local tsText         = {frame.args.Text1,       frame.args.Text2,       frame.args.Text3,       frame.args.Text4,       frame.args.Text5,       frame.args.Text6,       frame.args.Text7,       frame.args.Text8}
    local tdTextX        = {frame.args.Text1X,      frame.args.Text2X,      frame.args.Text3X,      frame.args.Text4X,      frame.args.Text5X,      frame.args.Text6X,      frame.args.Text7X,      frame.args.Text8X}
    local tdTextY        = {frame.args.Text1Y,      frame.args.Text2Y,      frame.args.Text3Y,      frame.args.Text4Y,      frame.args.Text5Y,      frame.args.Text6Y,      frame.args.Text7Y,      frame.args.Text8Y}
    local tdTextRotate   = {frame.args.Text1Rotate, frame.args.Text2Rotate, frame.args.Text3Rotate, frame.args.Text4Rotate, frame.args.Text5Rotate, frame.args.Text6Rotate, frame.args.Text7Rotate, frame.args.Text8Rotate}

    local tsX            = {}
    local tsY            = {}
    local tdXMin         = {};     local dXMin        = MAXVALUE;
    local tdXMax         = {};     local dXMax        = MINVALUE;
    local tdYMin         = {};     local dYMin        = 0
    local tdYMax         = {};     local dYMax        = MINVALUE;
    local dXMinFix       = frame.args.XMin                    or nil
    local dXMaxFix       = frame.args.XMax                    or nil
    local dXValueFactor  = frame.args.XValueFactor            or 1
    local dYMinFix       = frame.args.YMin                    or nil
    local dYMaxFix       = frame.args.YMax                    or nil
    local dYValueFactor  = frame.args.YValueFactor            or 1

    local tiXIntegerLen  = {};   local iXIntegerLen = 0;         -- max len up to the decimal point, for a propper SVG text layout
    local tiYIntegerLen  = {};   local iYIntegerLen = 0;         -- -"-
    local tiXLenMax      = {};   local iXLenMax     = 0;         -- whole max len of values, for a propper SVG text layout
    local tiYLenMax      = {};   local iYLenMax     = 0;         -- -"-
    local tsXFirst       = {}                                    -- for additionals for filled areas
    local tsXLast        = {}                                    -- -"-

    -- image and chart --
    local dImageSize          = tonumber (frame.args.ImageSize          or 100)
    local dChartSize          = tonumber (frame.args.ChartSize          or 100)	  -- user given chart size, %
    local dImageLeft          = frame.args.ImageLeft                    or nil
    local dImageRight         = frame.args.ImageRight                   or nil
    local dImageTop           = frame.args.ImageTop                     or nil
    local dImageBottom        = frame.args.ImageBottom                  or nil
	
    local dElementsWidth100   = tonumber (frame.args.ElementsWidth      or 100)
--    local dLineWidth100       = tonumber (frame.args.LineWidth          or 100)
    local dLineWidth100       = tonumber (frame.args.LineWidth  or frame.args.GraphWidth  or 100)             -- GraphWidth deprecated
    local dLine1Width100      = tonumber (frame.args.Line1Width or frame.args.Graph1Width or dLineWidth100)   -- Graph1Width deprecated
    local dGraphStretchWidth  = tonumber (frame.args.GraphStretchWidth  or 100)
    local dGraphStretchHeight = tonumber (frame.args.GraphStretchHeight or 100)
--    local dGraphWidth         = tonumber (frame.args.GraphWidth         or 100)
--    local dGraph1Width        = tonumber (frame.args.Graph1Width or dGraphWidth)
	
    local dChartElementSizeRel = nil
    local dLineWidthPx         = nil    -- line size, px
    local dLine1WidthPx        = nil    -- line size, px
    local dChartWidthRaw       = nil
    local dChartWidthStretch   = nil
    local dChartHeightRaw      = nil
    local dChartHeightStretch  = nil

    -- font size --
    local dFontSize100            = tonumber (frame.args.FontSize            or 100)
    local dFontSizeTitle100       = tonumber (frame.args.FontSizeTitle       or dFontSize100 * 1.1)    -- ToDo: 1.1 correct?
    local dXAxisFontSize100       = tonumber (frame.args.XAxisFontSize       or dFontSize100)
    local dXAxisNumberFontSize100 = tonumber (frame.args.XAxisNumberFontSize or dXAxisFontSize100)
    local dYAxisFontSize100       = tonumber (frame.args.YAxisFontSize       or dFontSize100) 
    local dYAxisNumberFontSize100 = tonumber (frame.args.YAxisNumberFontSize or dYAxisFontSize100)
    local dChartTextFontSize100   = tonumber (frame.args.ChartTextFontSize   or dFontSize100)    
    local dLegendFontSize100      = tonumber (frame.args.LegendFontSize      or dFontSize100)  
    local dLegendTextWA           = frame.args.LegendTextWA                  or 1                      -- Workaround for librsvg: Fontsize factor for misplaced text
    local dGeneralFontSizePx
    local dFontSizePx
    local dLegendFontSizePx

    -- diagram text --
    local sTitle              = frame.args.Title                 or nil
    local dTitleX100          = frame.args.TitleX                or nil
    local dTitleY100          = frame.args.TitleY                or nil
    local dTitleXlibrsvg      = frame.args.TitleXlibrsvg         or nil
    local dTitleYlibrsvg      = frame.args.TitleYlibrsvg         or nil
	
    local sDescription        = frame.args.Description           or nil
    local sFootnote           = frame.args.Footnote              or nil
    local sBackgroundSVG      = frame.args.BackgroundSVG         or nil
    local sForegroundSVG      = frame.args.ForegroundSVG         or nil
	
    -- charts --
    local dAxisMarkLengthFix  = frame.args.AxisMarkLength        or nil      -- may be nil
    
    -- axis marks --
    local sXAxisText          = frame.args.XAxisText             or nil
    local dXAxisMarkStart     = frame.args.XAxisMarkStartT       or nil
    local dXAxisMarkStep      = frame.args.XAxisMarkStep         or  10    
    local dXAxisMark2Start    = frame.args.XAxisMark2StartT      or nil
    local dXAxisMark2Step     = frame.args.XAxisMark2Step        or nil

    local sYAxisText          = frame.args.YAxisText             or nil
    local dYAxisMarkStart     = frame.args.YAxisMarkStartT       or nil
    local dYAxisMarkStep      = frame.args.YAxisMarkStep         or  10
    local dYAxisMark2Start    = frame.args.YAxisMark2StartT      or nil
    local dYAxisMark2Step     = frame.args.YAxisMark2Step        or nil

    local sYAxis2Text         = frame.args.YAxis2Text            or nil      -- criteria for further realisations
    local dYAxis2MarkStart    = frame.args.YAxis2MarkStartT      or nil
    local dYAxis2MarkStep     = frame.args.YAxis2MarkStep        or  10
    
    -- x axis values --
    local dXAxisValueStart     = frame.args.XAxisValueStart       or dXAxisMarkStart
    local dXAxisValueStep      = frame.args.XAxisValueStep        or nil
    local dXAxisValueEnd       = frame.args.XAxisValueEnd         or nil
    local dXAxisValueRound     = frame.args.XAxisValueRound       or   0
    local dXAxisValuePosStart  = frame.args.XAxisValuePosStartT   or nil
    local dXAxisValuePosStep   = frame.args.XAxisValuePosStep     or nil
    local sXAxisValuePrefix    = frame.args.XAxisValuePrefix      or nil
    local sXAxisValueSuffix    = frame.args.XAxisValueSuffix      or nil
    local sXAxisText           = frame.args.XAxisText             or nil
    local sXAxisTextAttribute  = frame.args.XAxisTextAttribute    or  ''
    local dXAxisValueDYlibrsvg = frame.args.XAxisValueDYlibrsvg   or nil
    local sXAxisValueSVG       = frame.args.XAxisValueSVG         or nil
    
    -- y axis values --
    local dYAxisValueStart     = frame.args.YAxisValueStart       or dYAxisMarkStart
    local dYAxisValueStep      = frame.args.YAxisValueStep        or nil
    local dYAxisValueEnd       = frame.args.YAxisValueEnd         or nil
    local dYAxisValueRound     = frame.args.YAxisValueRound       or   0
    local dYAxisValuePosStart  = frame.args.YAxisValuePosStartT   or nil
    local dYAxisValuePosStep   = frame.args.YAxisValuePosStep     or nil
    local sYAxisValuePrefix    = frame.args.YAxisValuePrefix      or nil
    local sYAxisValueSuffix    = frame.args.YAxisValueSuffix      or nil
    local sYAxisText           = frame.args.YAxisText             or nil
    local dYAxisTextX          = frame.args.YAxisTextX            or 100
    local sYAxisTextAttribute  = frame.args.YAxisTextAttribute    or  ''
    local dYAxisValueDYlibrsvg = frame.args.YAxisValueDYlibrsvg   or nil
    local sYAxisValueSVG       = frame.args.YAxisValueSVG         or nil
    
    -- 2nd y axis values --
    local dYAxis2ValueStart    = frame.args.YAxis2ValueStart      or dYAxis2MarkStart
    local dYAxis2ValueStep     = frame.args.YAxis2ValueStep       or nil
    local dYAxis2ValueEnd      = frame.args.YAxis2ValueEnd        or nil
    local dYAxis2ValueRound    = frame.args.YAxis2ValueRound      or   0
    local dYAxis2ValuePosStart = frame.args.YAxis2ValuePosStartT  or nil
    local dYAxis2ValuePosStep  = frame.args.YAxis2ValuePosStep    or nil
    local sYAxis2ValuePrefix   = frame.args.YAxis2ValuePrefix     or nil
    local sYAxis2ValueSuffix   = frame.args.YAxis2ValueSuffix     or nil
    local sYAxis2Text          = frame.args.YAxis2Text            or nil
    local dYAxis2TextX         = frame.args.YAxis2TextX           or 240
    local sYAxis2TextAttribute = frame.args.YAxis2TextAttribute   or  ''
    local dYAxis2ValueDYlibrsvg= frame.args.YAxis2ValueDYlibrsvg  or nil
    local sYAxis2ValueSVG      = frame.args.YAxis2ValueSVG        or nil
    
    -- grid --
    local dXGridStart          = frame.args.XGridStart            or nil
    local dXGridStep           = frame.args.XGridStep             or
	                             frame.args.XGrid                 or nil    -- 'none' if none realization
    local dYGridStart          = frame.args.YGridStart            or nil
    local dYGridStep           = frame.args.YGridStep             or
	                             frame.args.YGrid                 or nil    -- 'none' if none realization    
    -- legend --
    local sLegendSVG           = frame.args.LegendSVG             or nil
    local sLegendType          = frame.args.LegendType            or 'box'
    local sLegendBorder        = frame.args.LegendBorder                    -- legend border color
    local dLegendWidth100      = tonumber (frame.args.LegendWidth or 100)
    local dLegendX             = tonumber (frame.args.LegendX     or 105)   -- a little bit more right
    local bLegendX                                                          -- for decision to show the box legend
    local dLegendY             = tonumber (frame.args.LegendY     or 100)
    local dLegendBoxDX         = nil
    local dLegendBoxWidth      = nil
     
    -- background --
    local sBackground          = frame.args.Background            or nil    -- used in svg-axis.svgAxisGridBackground (), todo: is this function really usefull?

    ---- other ----
    -- global:
          gbDebug              = frame.args.Debug                 or nil
    -- local:      
    local i, iNumberPairs, iNumberCharts, sOutLegend
    local dLeft, dRight, dTop, dBottom, sReturn, dAxisMarkLength
    local bDefaultWWChart      = true

    ---- initialisations ----
    iNumberCharts = 0
    for i = 1, MAXCHARTNUMBER do
    	if iserror () then break end
    	if tsGraphValues[i] then
    		bDefaultWWChart = false
    		iNumberCharts   = iNumberCharts + 1
    	    tsX[i], tsY[i], tdXMin[i], tdXMax[i], tdYMin[i], tdYMax[i], tiXLenMax[i], tiYLenMax[i], tiXIntegerLen[i], tiYIntegerLen[i], tsXFirst[i], tsXLast[i], iNumberPairs
        	    = initChartValues (tsGraphValues[i], dXValueFactor, dYValueFactor, dXMinFix, dYMinFix)           -- all relevant values of one array of chart values
           	if iserror () then break end
        	    
            dXMin        = min (dXMin, tdXMin[i])   -- min y
            dXMax        = max (dXMax, tdXMax[i])   -- max x
            dYMax        = max (dYMax, tdYMax[i])   -- max y
            iXLenMax     = max (iXLenMax, tiXLenMax[i])
            iYLenMax     = max (iYLenMax, tiYLenMax[i])
            iXIntegerLen = max (iXIntegerLen, tiXIntegerLen[i])
            iYIntegerLen = max (iYIntegerLen, tiYIntegerLen[i])
            if iNumberPairs > 50 then gsValuesFirstSpace = " " end      -- shall minimize the size of the svg file
        end
    end

    if iNumberCharts == 1 then sLegendType = 'none' end

    if dXMinFix then dXMin = dXMinFix end
    if dYMinFix then dYMin = dYMinFix end
    if dXMaxFix then
        dXMax = dXMaxFix
    else
        dXMax = dXMax + round ((dXMax - dXMin) * 0.03, 3)    -- more space on right side
    end
    if dYMaxFix then
        dYMax = dYMaxFix
    else
        dYMax = dYMax + round ((dYMax - dYMin) * 0.05, 3)    -- more space on top
    end
    dXMin     = tonumber (dXMin)
    dXMax     = tonumber (dXMax)
    dXDif     = math.abs (dXMax - dXMin)
    dYMin     = tonumber (dYMin)
    dYMax     = tonumber (dYMax)
    dYDif     = math.abs (dYMax - dYMin)
	
    dTmp      = math.max (dXDif, dYDif) / math.min (dXDif, dYDif)
    errorcheck (dTmp > 7, 'main', 'SVGChart', 'The range of x values is not congruent to the range of y values. The ratio is "' .. 
        dTmp .. '". Therefore it is not possible to create an svg file with propper original data. Please, change the values of Graph_Values for a ratio of differences for x/y or y/x to < 7. ')
	
    if not dXAxisMarkStart      then dXAxisMarkStart      = dXMin            end
    if not dXAxisMark2Start     then dXAxisMark2Start     = dXAxisMarkStart  end
    if not dXGridStart          then dXGridStart          = dXAxisMarkStart  end
    if not dXGridStep           then dXGridStep           = dXAxisMarkStep   end
    if not dXAxisValuePosStart  then dXAxisValuePosStart  = dXAxisMarkStart  end
    if not dXAxisValuePosStep   then dXAxisValuePosStep   = dXAxisMarkStep   end
    if not dXAxisValueStart     then dXAxisValueStart     = dXMin            end
    if not dXAxisValueStep      then dXAxisValueStep      = dXAxisMarkStep   end
    if not dXAxisValueEnd       then dXAxisValueEnd       = dXMax            end

    if not dYAxisMarkStart      then dYAxisMarkStart      = dYMin            end
    if not dYAxisMark2Start     then dYAxisMark2Start     = dYAxisMarkStart  end
    if not dYGridStart          then dYGridStart          = dYAxisMarkStart  end
    if not dYGridStep           then dYGridStep           = dYAxisMarkStep   end
    if not dYAxisValuePosStart  then dYAxisValuePosStart  = dYAxisMarkStart  end
    if not dYAxisValuePosStep   then dYAxisValuePosStep   = dYAxisMarkStep   end
    if not dYAxisValueStart     then dYAxisValueStart     = dYMin            end
    if not dYAxisValueStep      then dYAxisValueStep      = dYAxisMarkStep   end
    if not dYAxisValueEnd       then dYAxisValueEnd       = dYMax            end
    
    if not dYAxis2MarkStart     then dYAxis2MarkStart     = dYMin            end
    if not dYAxis2Mark2Start    then dYAxis2Mark2Start    = dYAxis2MarkStart end
    if not dYAxis2ValuePosStart then dYAxis2ValuePosStart = dYAxis2MarkStart end
    if not dYAxis2ValuePosStep  then dYAxis2ValuePosStep  = dYAxis2MarkStep  end
    if not dYAxis2ValueStart    then dYAxis2ValueStart    = dYMin            end
    if not dYAxis2ValueStep     then dYAxis2ValueStep     = dYAxis2MarkStep  end
    if not dYAxis2ValueEnd      then dYAxis2ValueEnd      = dYMax            end

    
    dChartSize           = Size (dXMin, dXMax, dYMin, dYMax, dGraphStretchWidth, dGraphStretchHeight)
    dChartElementSizeRel = dChartSize * dElementsWidth100 / 100
    dLineWidthPx         = LineWidth (dChartSize, dLineWidth100, 100, 100)
    dLine1WidthPx        = LineWidth (dChartSize, dLine1Width100, 100, 100)
    dLineWidthStretchPx  = LineWidth (dChartSize, dLineWidth100, dGraphStretchWidth, dGraphStretchHeight)
    dLine1WidthStretchPx = LineWidth (dChartSize, dLine1Width100, dGraphStretchWidth, dGraphStretchHeight)

    dAxisMarkLength     = AxisMarkLength (dChartElementSizeRel, dAxisMarkLengthFix)      -- function in svg-axis

    -- legend --
    dLegendBoxDX        = 0.05 * dChartSize
    dLegendBoxWidth     = LegendBoxWidth (dChartSize, dLegendFontSize100, dLegendWidth100)
    if frame.args.LegendX then bLegendX = true else bLegendX = false end
	
    dGeneralFontSizePx  = round (dChartSize * dElementsWidth100 * dFontSize100 * FONTSIZE / 1000000, 3)               -- * x.x - the general font size, px, ToDo: dFontSize100 not here because also in dFontSizePx and so on
    dFontSizePx         = FontSize (dGeneralFontSizePx, dFontSize100)
    dLegendFontSizePx   = FontSize (dGeneralFontSizePx, dLegendFontSize100 or dFontSize100)

    dChartWidthRaw      = absDif (dXMin, dXMax)
    dChartWidthStretch  = dChartWidthRaw  * dGraphStretchWidth / 100
    dChartHeightRaw     = absDif (dYMin, dYMax)
    dChartHeightStretch = dChartHeightRaw * dGraphStretchHeight / 100

    -- defined in svg-viebox, todo: avoid a second call in svg-viewbox --
    dYAxis2Width        = YAxis2Width (dChartSize, sYAxis2Text, dYAxisFontSize100)
    dLeft               = Left        (dChartElementSizeRel, dImageLeft, dYAxisFontSize100)                                                      -- x, left side for axis description
    dRight              = Right       (dChartElementSizeRel, dChartWidthStretch, dImageRight, sLegendType, dLegendWidth100, dLegendX, bLegendX, sYAxis2Text, dYAxis2Width, dLegendFontSize100, dYAxisFontSize100)     -- same expression as width in viewBox
    dTop                = Top         (dChartElementSizeRel, dImageTop, sTitle, dFontSizeTitle100)
    dBottom             = Bottom      (dChartElementSizeRel, dImageBottom, iLegendType, sFootnote, dFontSize100, dXAxisFontSize100, sXAxisText)

    ---- svg generation ----
    sReturn =
    	WikiTextFirst () ..
    	'<pre>\n' ..
    	svgViewBox (dChartElementSizeRel, dChartWidthStretch, dChartHeightStretch, dImageSize, dLeft, dRight, dTop, dBottom, sLegendType, dLegendWidth100, dLegendX, dLegendFontSize100, dFontSize100, dFontSizeTitle100, dYAxisFontSize100, sTitle, sFootnote, sYAxis2Text) ..
    	svgTitle (sTitle, sDescription) ..
    	svgBackground (dChartHeightStretch, dChartWidthStretch, dChartElementSizeRel, dLeft, dRight, dTop, dBottom, sBackgroundImageSVG) ..
    	
    	'\n<style id="styles" type="text/css"> <![CDATA[\n' ..
--    	LineMarkerStyles (dChartElementSizeRel, dGraphWidth, dGraphStretchWidth, dGraphStretchHeight, tsGraphValues, tsGraphLine, tsGraphMarker, tsGraphColor, tsGraphFill, tsGraphMarkerFill) ..
    	LineMarkerStyles (dChartElementSizeRel, dLineWidth100, dGraphStretchWidth, dGraphStretchHeight, tsGraphValues, tsGraphLine, tsGraphMarker, tsGraphColor, tsGraphFill, tsGraphMarkerFill) ..
    	AxisGridStyles (tsGraphMarker, dChartElementSizeRel, dXGridStep, dYGridStep) ..
    	TextStyles (sLegendType, tsText, dGeneralFontSizePx, dFontSizeTitle100, dXAxisFontSize100, dYAxisFontSize100, dXAxisNumberFontSize100, dLegendFontSize100, dChartTextFontSize100, dLegendTextWA) ..
    	']]></style>\n' ..
    	
    	'\n<defs>\n' ..
    	svgAxisDefs (dChartElementSizeRel, dGraphStretchWidth, dGraphStretchHeight, dChartWidthRaw, dChartHeightRaw, dXMin, dYMin, dXGridStart, dYGridStart, dXGridStep, dYGridStep, dAxisMarkLength, dXAxisMarkStart, dXAxisMarkStep, dXAxisMark2Start, dXAxisMark2Step, dYAxisMarkStart, dYAxisMarkStep, dYAxisMark2Start, dYAxisMark2Step, dYAxis2MarkStart, dYAxis2MarkStep) ..
    	svgMarkerDefs (tsGraphMarker, dChartElementSizeRel, tdGraphMarkerSize, tsGraphMarkerFill, dGraphStretchWidth, dGraphStretchHeight) ..
    	'</defs>\n\n' ..
    	
    	svgBackgroundSVG (dGraphStretchWidth, dGraphStretchHeight, sBackgroundSVG) ..
        svgBackground2   (sBackground, bDefaultWWChart, dChartWidthStretch, dChartHeightStretch, dXMin, dYMin, dXGrid, dYGrid, dAxisMarkLength, dXAxisMarkStart, dXAxisMark2Start, dXAxisMark2Step, dYAxisMark2Step, sYAxis2Text, dYAxis2MarkStep) ..
        svgGrid (bDefaultWWChart, dChartWidthStretch, dChartHeightStretch, dXGrid, dYGrid) ..
        svgXAxisText (
            dChartWidthStretch, dGraphStretchWidth, dChartElementSizeRel,
            dFontSizePx, dGeneralFontSizePx, dXAxisFontSize100, dXAxisNumberFontSize100, 
            dXMin, dXMax, dXAxisValuePosStart, dXAxisValuePosStep, 
            dXAxisValueStart, dXAxisValueStep, dXAxisValueRound, sXAxisValueSVG, 
            sXAxisText, sXAxisTextAttribute, sXAxisValuePrefix, sXAxisValueSuffix, 
            dAxisMarkLength, dXAxisValueDYlibrsvg, sXAxisTextDYlibrsvg) ..
        svgYAxisText (
            dChartHeightStretch, dGraphStretchHeight, dChartElementSizeRel,
            tonumber(dFontSizePx) * dYAxisFontSize100 / 100, dYAxisFontSize100, 
            dYMin, dYMax, dYAxisValuePosStart, dYAxisValuePosStep, 
            dYAxisValueStart, dYAxisValueStep, dYAxisValueRound, sYAxisValueSVG, 
            sYAxisText, dYAxisTextX, sYAxisTextAttribute, sYAxisValuePrefix, sYAxisValueSuffix, 
            dAxisMarkLength, dYAxisValueDYlibrsvg, sYAxisTextDYlibrsvg) ..
        svgYAxis2Text (
            dChartWidthStretch, dChartHeightStretch, dGraphStretchHeight, dChartElementSizeRel,
            dFontSizePx,
            dYMin, dYMax, dYAxis2ValuePosStart, dYAxis2ValuePosStep, 
            dYAxis2ValueStart, dYAxis2ValueStep, iYAxis2ValueRound, sYAxis2ValueSVG, 
            sYAxis2Text, dYAxis2TextX, sYAxis2TextAttribute, sYAxis2ValuePrefix, sYAxis2ValueSuffix, 
            dAxisMarkLength, dYAxis2ValueDYlibrsvg, sYAxis2TextDYlibrsvg) ..
        svgLegend        (sLegendType, dChartSize, dLegendFontSizePx, dLegendFontSize100, dLegendBoxWidth, dLegendWidth100, sLegendBorder, tsGraphText, tsGraphMarker, sLegendSVG, dChartWidthStretch, dChartHeightStretch, bLegendX, dLegendX, dLegendY, dChartSize, dYAxis2Width, sYAxis2Text, dYAxisFontSize100) ..
        svgChartTitle    (dChartWidthStretch, dChartHeightStretch, dGeneralFontSizePx, dFontSizeTitle100, sTitle, dTitleX100, dTitleY100, dTitleXlibrsvg, dTitleYlibrsvg) ..
        svgChartFootnote (dChartWidthStretch, sFootnote, dFootnoteX100, dFootnoteY100, dTitleXlibrsvg, dTitleYlibrsvg) ..
        
    	'\n<defs>\n' ..
    	svgGraphsDefs (dXMin, dYMin, tsX, tsY, tsGraphValues, tsGraphFill, tsXFirst, tsXLast, tsGraphText, 
    		LineWidth (dChartElementSizeRel, dGraph1Width, dGraphStretchWidth, dGraphStretchHeight), 
    		iXLenMax, iXIntegerLen, iYIntegerLen) ..
    	'</defs>\n' ..
    	
    	svgGraphsUse (dXMin, dYMin, dLineWidthPx, dImageSize, tsGraphValues, tsGraphFill, dGraphStretchWidth, dGraphStretchHeight) ..
    	svgAxis (bDefaultWWChart, dChartWidthStretch, dChartHeightStretch, dXMin, dYMin, dAxisMarkLength, dXAxisMarkStart, dXAxisMark2Start, dXAxisMark2Step, dYAxisMark2Step, sYAxis2Text, dYAxis2MarkStep) ..
    	svgGraphText (dGraphStretchWidth, dGraphStretchHeight, dXMin, dYMin, tsText, tsGraphText, tdTextX, tdTextY, tdTextRotate, dGeneralFontSizePx, dYAxisFontSize100) ..
    	svgForeground (sForegroundSVG) ..
    	'\n</svg>\n</pre>\n'
    	
    if gbDebug then gsDebug =
        '<pre>Debug:\n\n' ..
        'main.p.SVGChart (): dChartSize: ' .. dChartSize .. ', dElementsWidth100: ' .. dElementsWidth100 .. ', dElementsWidth100: ' .. dElementsWidth100 .. ', dImageLeft: ' .. tostring (dImageLeft) .. ', dYAxisFontSize100: ' .. dYAxisFontSize100 .. '\n' ..
        '    dXMin: ' .. dXMin .. ', dXMax: ' .. dXMax .. ', dYMin: ' .. dYMin .. ', dYMax: ' .. dYMax .. '\n' ..
        '    dChartElementSizeRel: ' .. dChartElementSizeRel .. ', dChartSize: ' .. dChartSize .. '\n' ..
        '    dChartWidthRaw:  ' .. dChartWidthRaw ..  ', dGraphStretchWidth:  ' .. tostring (dGraphStretchWidth) ..  ', dChartWidthStretch:  ' .. dChartWidthStretch  .. '\n' ..
        '    dChartHeightRaw: ' .. dChartHeightRaw .. ', dGraphStretchHeight: ' .. tostring (dGraphStretchHeight) .. ', dChartHeightStretch: ' .. dChartHeightStretch .. '\n'	..
        '    dGeneralFontSizePx: ' .. dGeneralFontSizePx .. ', dFontSize100: ' .. dFontSize100 .. ', dFontSizePx: ' .. dFontSizePx .. ', dLegendFontSizePx: ' .. dLegendFontSizePx .. '\n' ..
        '    dAxisMarkLength: ' .. dAxisMarkLength .. '\n' ..
        '    dXAxisMarkStart: ' .. dXAxisMarkStart .. ', dXAxisMark2Start: ' .. tostring (dXAxisMark2Start) .. '\n' ..
        '    dXAxisValueStart: ' .. dXAxisValueStart .. ', dXAxisValueStep: ' .. dXAxisValueStep .. ', dXAxisValuePosStart: ' .. tostring (dXAxisValuePosStart) .. ', dXAxisValuePosStep: ' .. tostring (dXAxisValuePosStep) .. '\n' ..
        '    dYAxisMarkStart: ' .. dYAxisMarkStart .. ', dYAxisMark2Start: ' .. tostring (dYAxisMark2Start) .. '\n'	..
        '    dYAxisValueStart: ' .. dYAxisValueStart .. ', dYAxisValueStep: ' .. dYAxisValueStep .. ', dYAxisValuePosStart: ' .. tostring (dYAxisValuePosStart) .. ', dYAxisValuePosStep: ' .. tostring (dYAxisValuePosStep) .. '\n' ..
        '    dLegendWidth100: ' .. tostring (dLegendWidth100) .. ', dLegendBoxWidth: ' .. tostring (dLegendBoxWidth) .. ', dLegendBoxDX: ' .. tostring (dLegendBoxDX) .. ', sLegendBorder: ' .. tostring (sLegendBorder) .. '\n' ..
        gsDebug .. 
        '</pre>' ..
        '<pre>Debug standard functions:\n' .. gsDebugStandard .. '</pre>'
    else
        gsDebug = ''
    end

    if gbError then
    	return errormessage () .. gsDebug
    else
        return sReturn .. gsDebug
    end
end

function p.SVGChart (frame)
    return p.main (frame)
end

return p