ECharts 升级

.gitignore

@@ -1,2 +1,12 @@
-/node_modules
+logs/
-*.sh
+npm-debug.log
+yarn-error.log
+node_modules/
+package-lock.json
+yarn.lock
+coverage/
+.idea/
+run/
+.DS_Store
+*.sw*
+*.un~

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>

package.json

@@ -26,6 +26,6 @@
   },
   "homepage": "https://github.com/somonus/react-native-echarts#readme",
   "dependencies": {
-    "echarts": "3.2.3"
+    "echarts": "^4.2.0-rc.1"
   }
 }

src/components/Container/index.js

@@ -1,13 +1,13 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
-import { View } from 'react-native';
+import {View} from 'react-native';
 import styles from '../../style';
 
 export default class App extends Component {
-  render() {
+    render() {
-    return (
+        return (
-      <View style={[styles.container, {width: this.props.width}]}>
+            <View style={[styles.container, {width: this.props.width}]}>
-        {this.props.children}  
+                {this.props.children}
-      </View>
+            </View>
-    );
+        );
-  }
+    }
 }

src/components/Echarts/index.js

@@ -1,42 +1,41 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
-import { WebView, View, StyleSheet, Platform } from 'react-native';
+import {WebView, View, StyleSheet, Platform} from 'react-native';
 import renderChart from './renderChart';
-import echarts from './echarts.min';
 
 export default class App extends Component {
 
-  constructor(props) {
+    constructor(props) {
-    super(props);
+        super(props);
-    this.setNewOption = this.setNewOption.bind(this);
+        this.setNewOption = this.setNewOption.bind(this);
-  }
-  
-
-  componentWillReceiveProps(nextProps) {
-    if(nextProps.option !== this.props.option) {
-      this.refs.chart.reload();
     }
-  }
 
-  setNewOption(option) {
-    this.refs.chart.postMessage(JSON.stringify(option));
-  }
 
-  render() {
+    componentWillReceiveProps(nextProps) {
-    return (
+        if (nextProps.option !== this.props.option) {
-      <View style={{flex: 1, height: this.props.height || 400,}}>
+            this.refs.chart.reload();
-        <WebView
+        }
-          ref="chart"
+    }
-          scrollEnabled = {false}
+
-          injectedJavaScript = {renderChart(this.props)}
+    setNewOption(option) {
-          style={{
+        this.refs.chart.postMessage(JSON.stringify(option));
-            height: this.props.height || 400,
+    }
-            backgroundColor: this.props.backgroundColor || 'transparent'
+
-          }}
+    render() {
-          scalesPageToFit={Platform.OS !== 'ios'}
+        return (
-          source={require('./tpl.html')}
+            <View style={{flex: 1, height: this.props.height || 400,}}>
-          onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
+                <WebView
-        />
+                    ref="chart"
-      </View>
+                    scrollEnabled={false}
-    );
+                    injectedJavaScript={renderChart(this.props)}
-  }
+                    style={{
+                        height: this.props.height || 400,
+                        backgroundColor: this.props.backgroundColor || 'transparent'
+                    }}
+                    scalesPageToFit={Platform.OS !== 'ios'}
+                    source={require('./tpl.html')}
+                    onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
+                />
+            </View>
+        );
+    }
 }

src/components/Echarts/renderChart.js

@@ -1,4 +1,3 @@
-import echarts from './echarts.min';
 import toString from '../../util/toString';
 
 export default function renderChart(props) {

src/index.js

@@ -1,18 +1,18 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
-import { WebView, View } from 'react-native';
+import {WebView, View} from 'react-native';
-import { Container, Echarts } from './components'
+import {Container, Echarts} from './components'
 
 export default class App extends Component {
 
-  setNewOption(option) {
+    setNewOption(option) {
-    this.chart.setNewOption(option);
+        this.chart.setNewOption(option);
-  }
+    }
 
-  render() {
+    render() {
-    return (
+        return (
-      <Container width={this.props.width}>
+            <Container width={this.props.width}>
-        <Echarts {...this.props} ref={e => this.chart = e}/>
+                <Echarts {...this.props} ref={e => this.chart = e}/>
-      </Container>
+            </Container>
-    );
+        );
-  }
+    }
 }