This commit is contained in:
ilyes-ced
2024-03-26 22:50:27 +00:00
parent 1d8332d61e
commit 585609b907

View File

@@ -102,18 +102,21 @@ Points are used to plot a circle inside the quadrantChart. The syntax is `<text>
1. `Point 1: [0.75, 0.80]` here the Point 1 will be drawn in the top right quadrant. 1. `Point 1: [0.75, 0.80]` here the Point 1 will be drawn in the top right quadrant.
2. `Point 2: [0.35, 0.24]` here the Point 2 will be drawn in the bottom left quadrant. 2. `Point 2: [0.35, 0.24]` here the Point 2 will be drawn in the bottom left quadrant.
### Point styling ### Point styling
Points cant either be styled directly or with defined shared classes Points cant either be styled directly or with defined shared classes
1. direct styling 1. direct styling
```md ```md
Point A: [0.9, 0.0] radius: 12 Point A: [0.9, 0.0] radius: 12
Point B: [0.8, 0.1] color: #ff3300, radius: 10 Point B: [0.8, 0.1] color: #ff3300, radius: 10
Point C: [0.7, 0.2] radius: 25, color: #00ff33, stroke-color: #10f0f0 Point C: [0.7, 0.2] radius: 25, color: #00ff33, stroke-color: #10f0f0
Point D: [0.6, 0.3] radius: 15, stroke-color: #00ff0f, stroke-width: 5px ,color: #ff33f0 Point D: [0.6, 0.3] radius: 15, stroke-color: #00ff0f, stroke-width: 5px ,color: #ff33f0
``` ```
2. classes styling 2. classes styling
```md ```md
Point A:::class1: [0.9, 0.0] Point A:::class1: [0.9, 0.0]
Point B:::class2: [0.8, 0.1] Point B:::class2: [0.8, 0.1]
@@ -124,23 +127,19 @@ classDef class2 color: #908342, radius : 10, stroke-color: #310085, stroke-width
classDef class3 color: #f00fff, radius : 10 classDef class3 color: #f00fff, radius : 10
``` ```
#### available styles: #### available styles:
| Parameter | Description | | Parameter | Description |
| -------------------------------- | ------------------------------------------------------------------------| | ------------ | ---------------------------------------------------------------------- |
| color | Fill color of the point | | color | Fill color of the point |
| radius | Radius of the point | | radius | Radius of the point |
| stroke-width | Border width of the point | | stroke-width | Border width of the point |
| stroke-color | Border color of the point (useless when stroke-width is not specified) | | stroke-color | Border color of the point (useless when stroke-width is not specified) |
```note ```note
class styles take priority over direct styles and direct styles take priority over theme styles class styles take priority over direct styles and direct styles take priority over theme styles
``` ```
## Chart Configurations ## Chart Configurations
| Parameter | Description | Default value | | Parameter | Description | Default value |
@@ -207,7 +206,9 @@ quadrantChart
quadrant-3 Delegate quadrant-3 Delegate
quadrant-4 Delete quadrant-4 Delete
``` ```
## Example on styling ## Example on styling
```mermaid ```mermaid
quadrantChart quadrantChart
title Reach and engagement of campaigns title Reach and engagement of campaigns