This commit is contained in:
superscore 2019-10-11 15:25:03 +08:00 committed by GitHub
commit 8421c2239e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 56 additions and 82 deletions

View File

@ -1,6 +1,6 @@
{
"name": "native-echarts",
"version": "0.5.0",
"version": "0.7.0",
"description": "echarts for react-native",
"main": "src/index.js",
"directories": {

View File

@ -1,7 +1,9 @@
import React, { Component } from 'react';
import { WebView, View, StyleSheet, Platform } from 'react-native';
import { View, StyleSheet, Platform } from 'react-native';
import renderChart from './renderChart';
import echarts from './echarts.min';
import WebView from "react-native-webview";
import getTpl from "./tpl" ;
export default class App extends Component {
@ -13,9 +15,17 @@ export default class App extends Component {
componentWillReceiveProps(nextProps) {
if(nextProps.option !== this.props.option) {
this.refs.chart.reload();
// this.refs.chart.reload();
if(Platform.OS === 'android'){
this.refs.chart.reload();
}else {
this.setNewOption(nextProps.option) ;
}
}
}
shouldComponentUpdate() {
return false ;
}
setNewOption(option) {
this.refs.chart.postMessage(JSON.stringify(option));
@ -23,21 +33,20 @@ export default class App extends Component {
render() {
return (
<View style={{flex: 1, height: this.props.height || 400,}}>
<WebView
ref="chart"
scrollEnabled = {false}
injectedJavaScript = {renderChart(this.props)}
style={{
height: this.props.height || 400,
backgroundColor: this.props.backgroundColor || 'transparent'
}}
scalesPageToFit={Platform.OS !== 'ios'}
originWhitelist={['*']}
source={require('./tpl.html')}
onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
/>
</View>
<View style={{flex: 1, height: this.props.height || 400,}}>
<WebView
ref="chart"
scrollEnabled = {false}
injectedJavaScript = {renderChart(this.props)}
style={{
height: this.props.height || 400,
backgroundColor: this.props.backgroundColor || 'transparent'
}}
originWhitelist={['*']}
source={Platform.OS === "ios"?{ html:getTpl() }:{uri:'file:///android_asset/tpl.html'}}
onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
/>
</View>
);
}
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,28 @@
export default ()=>`<!DOCTYPE html>
<html>
<head>
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
<title>echarts</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<style type="text/css">
html,body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
// overflow: hidden;
}
#main {
height: 100%;
}
</style>
<script src="https://cdn.bootcss.com/echarts/4.2.1/echarts.min.js"></script>
</head>
<body>
<div id="main" ></div>
<body>
<html>
` ;