My application supports two themes (dark/light) for the charts. The background of the chart will be set to black if the dark mode is applied, and white if the light mode applied. It works well with the line chart. But there is strange grey background appeared in the heatmap chart when light mode is applied (Please check the attached screenshots). The color of gradient stop of offset 0 (min. heatmap zValues) is set to transparent and it works well with the dark mode. Do you know what’s wrong in my case?
Dark theme object applied to the chart:
{...new SciChartJSDarkTheme(), ...{
sciChartBackground: "#1c1c1c",
axisTitleColor: "#dee2e6",
labelBorderBrush: "#dee2e6",
tickTextBrush: "#dee2e6",
majorGridLineBrush: "#1F3D68",
minorGridLineBrush: "#102A47",
}
Light theme object applied to the chart:
{...new SciChartJSLightTheme(), ...{
sciChartBackground: "#fff",
axisTitleColor: "#333",
labelBorderBrush: "#333",
tickTextBrush: "#333",
}}
Heatmap graditentStops:
[
{ offset: 1, color: COLORS.DARK_RED },
{ offset: 0.8, color: COLORS.RED },
{ offset: 0.6, color: COLORS.YELLOW },
{ offset: 0.5, color: COLORS.GREEN },
{ offset: 0.4, color: COLORS.BLUE },
{ offset: 0.01, color: COLORS.DARK_BLUE },
{ offset: 0, color: "Transparent" },
]
- Quyen Sy asked 6 months ago
Hello Scichart Team again,
I’m trying to replicate anything like this (check Screenshot_2.png).
I can update the scichart background, but I just wanted to have a single color in the background, but it seems that there is an overlap of colors in X / Y as I show in the next printscreen (check Screenshot_3.png)
How I can solve this?
Waiting for feedback.
Many thanks,
Pedro Cruz
- Ricardo Diz asked 3 years ago
- last active 3 years ago
I am using SCIStackedMountainRenderableSeries in my iOS application, I am always getting chart background as black grids, I want to make it clear or white background. How can I do that?
I have tried
sciChartSurface?.backgroundColor = UIColor.white
sciChartSurface?.applyThemeProvider(nil)
That did not worked, Please help.
- Vikas Ahuja asked 4 years ago
- last active 2 years ago
I want a transparent background of SCI Chart so that view below the chart are visible. I have tried various solutions but it is still turning out to be black. Below is my code for the same. Can anyone please help me out ? I am setting SCIChartSurface backgroundColor property to achieve it but it doesnt seem to work.
func initColumnChart() {
let xAxis = SCINumericAxis()
let yAxis = SCINumericAxis()
//self.surface.xAxes.add(xAxis)
//self.surface.yAxes.add(yAxis)
self.surface.backgroundColor = UIColor.clear
self.surface.isOpaque = false
self.surface.renderableSeriesAreaFill = SCISolidBrushStyle(color: UIColor.clear)
self.surface.renderableSeriesAreaBorder = SCISolidPenStyle(color: UIColor.clear, withThickness: 0)
let xAxisGridBandBrush = SCISolidBrushStyle(color: UIColor.clear)
xAxis.style.gridBandBrush = xAxisGridBandBrush
xAxis.visibleRange = SCIDoubleRange(min: SCIGeneric(-0.6), max: SCIGeneric(8.0))
xAxis.style.majorTickBrush = SCISolidPenStyle(color: UIColor.white, withThickness: 1)
xAxis.style.majorTickSize = 5
xAxis.autoTicks = false
xAxis.majorDelta = SCIGeneric(1.0)
xAxis.minorDelta = SCIGeneric(1.0)
xAxis.labelProvider = UsageXLabelProvider()
xAxis.style.labelStyle.color = UIColor.white
xAxis.style.labelStyle.fontName = "Helvetica"
xAxis.style.labelStyle.fontSize = 14
xAxis.style.drawLabels = true
xAxis.style.drawMajorGridLines = false
xAxis.style.drawMinorGridLines = false
xAxis.style.drawMajorTicks = true
xAxis.style.drawMinorTicks = false
xAxis.tickProvider = YAxisTickProvider(minorTicks: [], majorTicks: [0,1,2,3,4,5,6])
let yAxisGridBandBrush = SCISolidBrushStyle(color: UIColor.clear)
yAxis.style.gridBandBrush = yAxisGridBandBrush
yAxis.style.labelStyle.color = UIColor.white
yAxis.style.labelStyle.fontName = "Helvetica"
yAxis.style.labelStyle.fontSize = 14
yAxis.style.drawLabels = true
yAxis.visibleRange = SCIDoubleRange(min: SCIGeneric(-1.0), max: SCIGeneric(65))
yAxis.autoTicks = false
yAxis.majorDelta = SCIGeneric(1.0)
yAxis.minorDelta = SCIGeneric(0.2)
yAxis.style.majorGridLineBrush = SCISolidPenStyle(color: UIColor.white, withThickness: 0.5, andStrokeDash: [5.0,6.0])
// Style the Minor Gridlines on the YAxis (vertical lines)
yAxis.style.minorGridLineBrush = SCISolidPenStyle(color: UIColor.white, withThickness: 0.5, andStrokeDash: [5.0, 6.0])
yAxis.style.drawMajorGridLines = true
yAxis.style.drawMinorGridLines = true
yAxis.style.drawMajorTicks = false
yAxis.style.drawMinorTicks = false
yAxis.axisAlignment = .left
//yAxis.labelProvider = DailyFlowrateLabelProvider()
yAxis.tickProvider = YAxisTickProvider(minorTicks: [0,8,16,24,31,40,48,56], majorTicks: [0,31,62])
let dataSeries = SCIXyDataSeries(xType: .float, yType: .float)
dataSeries.appendRangeX([0,1,2,3,4,5,6], y: [52,40,15,48,25,36,20])
let rSeries = SCIFastColumnRenderableSeries()
rSeries.dataSeries = dataSeries
rSeries.paletteProvider = BarsColorPalette()
SCIUpdateSuspender.usingWithSuspendable(surface) {
self.surface.xAxes.add(xAxis)
self.surface.yAxes.add(yAxis)
self.surface.renderableSeries.add(rSeries)
//self.surface.chartModifiers = SCIChartModifierCollection(childModifiers: [SCIPinchZoomModifier(), SCIZoomExtentsModifier(), SCIRolloverModifier()])
//rSeries.addAnimation(SCIWaveRenderableSeriesAnimation(duration: 3, curveAnimation: .easeOut))
}
}
- Ayush Jain asked 4 years ago
- last active 4 years ago
I am using latest version of SciChart through Pods. I am using trial key for now.
I have made all the views under the chart clear. And have tried the code below but the background appears to be shades of black.
let yAxis = SCINumericAxis()
let xAxis = SCINumericAxis()
self.surface.xAxes.add(xAxis)
self.surface.yAxes.add(yAxis)
self.surface.backgroundColor = UIColor.clear
self.surface.isOpaque = false
self.surface.renderableSeriesAreaFill = SCISolidBrushStyle(color: UIColor.clear)
self.surface.renderableSeriesAreaBorder = SCISolidPenStyle(color: UIColor.clear, withThickness: 0)
- Ayush Jain asked 4 years ago
- last active 4 years ago
