How to set transparent background?

[salujaharkirat]

I have a background with linear gradient on which I render a chart with white color. I was looking to make the background of chart transparent so that it syncs with the background.

I tried giving following:-

backgroundColor: "transparent" backgroundColor: null" backgroundColor: "rgba(255,255,255,0)"

But none of the above works and just gives me a white background.

Attaching image for reference.

Is the a bug or am I doing something wrong? On web similar configuration of high charts works as can be seen here

Update:

I was just trying to go through the code and I see following as the the style config

var styles = StyleSheet.create({
    full: {
        flex: 1,
        // background color is missing
    }
});

I tried installing using npm again but got the same old style config. Is the new version with these changes not updated on npm . Can someone please it check it once?

[salujaharkirat]

Looks like i was using the older version, just updated. Its working fine so will close this

[OverVlad]

How some problem. Can't set background transparent. Use last version

[OverVlad]

@jinxac How can you fix this error?

[salujaharkirat]

It should work in the latest version. Following should be there in the styles.

var styles = StyleSheet.create({
  full: {
    flex:1,
    backgroundColor:'transparent'
  }
});

[Fuatcan]

Changing chart option is not enough since highcharts is working with webview in react-native. You should also edit webviewStyles like below..

<HighchartsReactNative styles={{justifyContent: 'center', flex: 1, height: 500}} options={options} webviewStyles={{backgroundColor: 'transparent'}} />