100_130_Border_and_Background_Color for text
Previous Chapter Previous Page Next Page Next Chapter Table of content
Through several options, you can add a border around several texts on your chart. You can also define a background color for those texts.
This has been impemented for :
- graphTitle
- graphSubTitle
- footNote
- inGraphData
- yAxisLabel
- xAxisLabel
- yAxisUnit
- inGraphData
- crossText
- legend
- canvas border
If you want to define a border/background color for one of those texts, use following options :
- [textType]Borders (for instance : graphTitleBorders)
- [textType]BordersColor (for instance : footNoteBordersColor)
- [textType]BordersRadius (for instance : graphSubTitleBordersRadius)
- [textType]BordersSelection (for instance : graphSubTitleBordersSelection)
- [textType]BordersStyle (for instance : graphSubTitleBordersStyle)
- [textType]BordersWidth (for instance : footNoteBordersWidth)
- [textType]BordersXSpace (for instance : inGraphDataBordersXSpace)
- [textType]BordersYSpace (for instance : yAxisUnitBordersYSpace)
- [textType]BackgroundColor (for instance : yAxisLabelBackgroundColor)
For "inGraphData", function/array can be assigned to the associated options (see chapter 085_option_array_func).
Some of the options used to produce this chart :
footNoteSpaceAfter : 5,
footNoteSpaceBefore : 5,
legendBordersSpaceBefore : 5,
inGraphDataBorders : true,
inGraphDataBackgroundColor : "rgba(210,0,230,0.3)",
graphTitleBorders : true,
graphTitleBackgroundColor : "rgba(200,200,0,0.3)",
graphSubTitleBorders : true,
graphSubTitleBackgroundColor : "rgba(0,200,230,0.3)",
footNoteBorders : true,
footNoteBackgroundColor : "rgba(210,200,230,0.3)",
yAxisLabelBorders : true,
yAxisLabelBackgroundColor : "rgba(100,150,100,0.3)",
yAxisUnitBorders : true,
yAxisUnitBackgroundColor : "rgba(50,0,120,0.3)",
xAxisLabelBorders : true,
xAxisLabelBackgroundColor : "rgba(120,0,230,0.3)"
Description: If you want to draw a border around your text, set option [textType]Borders to true.
Chart types: all.
Values: true or false
Default value: false
Sample: graphTitleBorders : true
See also: other options in this chapter.
Description: specify the color of the border around the text with option [textType]BordersColor.
Chart types: all.
Values: any valid color
Default value: "black"
Sample: graphTitleBordersColor : "green"
See also: other options in this chapter.
Description: the corners of the borders can be rounded. To do this use option [textType]BordersRadius.
Chart types: all.
Values: positive integer or null value.
Default value: 0
Sample: `graphTitleBordersRadius : 3
See also: other options in this chapter.
Description: By default, all borders are drawn (top, right, bottom and left lines of the border). To produce another effect (for instance, to underline something), you can change this behavior by changing the value of the option [textType]BordersSelection.
Chart types: all.
Values: Any integer between 0 and 15. 1 is for the bottom line, 2 is for the left line, 4 is for the top line, 7 is for the right line. If you specify 5 as value, top bottom line (=1) and the top line (=4) will be drawn : 1 + 4 =5. By default , all lines are drawn ; The default value is 15 (=1+2+4+7) A value of 1 will simply underline the [textType].
Default value: 15
Sample: `graphTitleBordersSelection : 5
See also: other options in this chapter.
Description: specify the style of the border around the text with option [textType]BordersStyle.
Chart types: all.
Values: a valid style (see chapter 190_Stroke_Styles)
Default value: "solid"
Sample: graphTitleBordersStyle : "dashed"
See also: other options in this chapter.
Description: specify the width of the border around the text with option [textType]BordersWidth.
Chart types: all.
Values: a positive integer.
Default value: 1
Sample: graphTitleBordersWidth : 3
See also: other options in this chapter.
Description: The border is not draw agains the text; There is a space between the text and the border. [textType]BorderXSpace specifies the space between the text and the border on the horizontally. [textType]BorderYSpace specifies the space between the text and the border on the horizontally. Those two options are also used if the option [textType]BackgroundColor is defined.
Chart types: all.
Values: a positive integer.
Default value: 3
Sample: graphTitleBordersXSpace : 5
See also: other options in this chapter.
Description: If you want to specify a background color for your text, specify a color through option [textType]BackgroundColor.
Chart types: all.
Values: a valid color.
Default value: "none" ( <=> no background color).
Sample: inGraphDataBackgroundColor : "rgba(210,0,240,0,5)"
See also: other options in this chapter.
Previous Chapter Previous Page Next Page Next Chapter Top of Page