Support for multiple thresholds

[osteenbergen]

• options.thresholds = [100, 75, 50, 25]; Multiple thresholds #3
• Added some maskPadding to prevent some clipping on the bottom and top of the graph Chartist Threshold - Line graph getting cropped on highest value #8
• Added prefix to support multiple graphs on a single page Showing multiple charts makes the area coloring go wrong #11

[gionkunz]

Hey thanks! I appreciate the feature! Will look into the PR soon.

[robkaper]

Precisely what I need, would love for this to be included.

[xuancongwen]

@gionkunz Any chance of this getting a code review?

[maxbond2]

Used this plugin mod for one of my project - it saved a lot of time for me! @osteenbergen, thank you very much!

One note. When several charts initialised with different thresholds, you have to manually set uniqe mask names for each chart!

[chris-hippo]

Do you have some example code for this? I'm struggling to set up multiple thresholds and style each differently, I only have ct-threshold-below and ct-threshold-above to work with?

[osteenbergen]

Depending on the prefixThreshold setting you have area-<index> available.

option.thresholds = [75, 50, 25]

• above: 75 and higher
• area-0: between 75 and 50
• area-1: between 50 and 25
• below: 25 and lower

.ct-point {
  stroke-width: 5px;
}
.ct-point.ct-threshold-above {
  stroke: green;
}
.ct-point.ct-threshold-area-0 {
  stroke: yellow;
}
.ct-point.ct-threshold-area-1 {
  stroke: orange;
}
.ct-point.ct-threshold-below {
  stroke: red;
}

[osteenbergen]

@gionkunz Its been a year, any luck on merging this PR? Do you require improvements?

[markterrill]

great stuff! Seems quite a lot of the chartist repo's are not being maintained

[osteenbergen]

Closing this PR as this project is not maintained....