Calling ImageMarker causes 'Illegal callback invocation from native module' on Android

[richardkarsten]

• "react": "16.2.0"
• "react-native": "0.53.3"
• "react-native-image-marker": "^0.1.3"

_markImageWithOverlay = () => {
        ImageMarker.markWithImage(this.state.rawImage, this.state.overlay, 0, 0, 0.81).then((path) => {
            this.setState({
                editedImage: Platform.OS === 'android' ? 'file://' + path : path,
            });
        }).catch((err) => {
            console.log(err);
        });
    }
    render() {
        return (
            <View style={styles.container}>
                <Image source={{ uri: this.state.editedImage }} style={styles.imagePreview} />
                <TouchableOpacity onPress={this._markImageWithOverlay}>
                    <Text>Test</Text>
                </TouchableOpacity>
            </View>
        );
    }
}

[richardkarsten]

Solved:

this.state.overlay was an url-string. This method is working on iOS but not on Android. Any solution for dealing whith images from a network?

[JimmyDaddy]

Yes, Android only support mark local image for now. I'm working on marking remote image

[richardkarsten]

Maybe there should be a new issue for this?

[richardkarsten]

Workaround: Use the downloadFile function from RNFS. Cache all your images to local storage and use cached images for marking. I think this is also a good solution, if you working with a lot of files from an API or something.

[JimmyDaddy]

Downloading to local storage is a good solution, good job