Chart not showing on android simulator

[ws7one]

Used the example given in the documentation. I think I can see a faint white box which I am guessing is the webview, but cannot see the chart for sure. Any help would be appreciated, not sure if I have done something wrong

import React, { Component } from 'react';
import {
    View,
    Text,
} from 'react-native';
import ChartView from 'react-native-highcharts';

class App extends Component {
    render() {
        const Highcharts = 'Highcharts';

        const conf = {
            chart: {
                type: 'spline',
                animation: Highcharts.svg, // don't animate in old IE
                marginRight: 10,
                events: {
                    load: () => {
                        // set up the updating of the chart each second
                        const series = this.series[0];
                        setInterval(() => {
                            const x = (new Date()).getTime(); // current time
                            const y = Math.random();
                            series.addPoint([x, y], true, true);
                        }, 1000);
                    }
                }
            },
            title: {
                text: 'Live random data'
            },
            xAxis: {
                type: 'datetime',
                tickPixelInterval: 150
            },
            yAxis: {
                title: {
                    text: 'Value'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: () => (`<b>${this.series.name}</b><br/>
                        ${Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x)}<br/>
                        ${Highcharts.numberFormat(this.y, 2)}`)
            },
            legend: {
                enabled: false
            },
            exporting: {
                enabled: false
            },
            series: [{
                name: 'Random data',
                data: (function () {
                    // generate an array of random data
                    const data = [];
                    const time = (new Date()).getTime();
                    let i;

                    for (i = -19; i <= 0; i += 1) {
                        const val = {
                            x: time + (i * 1000),
                            y: Math.random()
                        };

                        console.log(val);

                        data.push(val);
                    }
                    return data;
                }())
            }]
        };

        const options = {
            global: {
                useUTC: false
            },
            lang: {
                decimalPoint: ',',
                thousandsSep: '.'
            }
        };

        return (
            <View>
                <Text>Chart</Text>
                <ChartView
                    style={{ height: 500}}
                    config={conf}
                    options={options}
                    javaScriptEnabled
                    domStorageEnabled
                />
            </View>
        );
    }
}
export default App;

My dependencies

{
  "name": "chartSamples",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-react-native": "^4.0.0",
    "eslint-config-rallycoding": "^3.2.0",
    "react": "16.4.1",
    "react-native": "^0.55.4",
    "react-native-highcharts": "^1.0.2"
  },
  "devDependencies": {
    "babel-jest": "23.4.0",
    "jest": "23.4.0",
    "react-test-renderer": "16.4.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

The Output

[db42]

Try adding originWhitelist={[""]} in ChartView .

<ChartView
                    originWhitelist={[""]}
                    style={{ height: 500}}
                    config={conf}
                    options={options}
                    javaScriptEnabled
                    domStorageEnabled
                />

More details https://github.com/TradingPal/react-native-highcharts/issues/83

[conor909]

@db42 worked thanks!