ECharts 升级

This commit is contained in:
veveue 2018-09-18 23:49:48 +08:00
parent 3767deeae3
commit aea8c0f0bd
9 changed files with 114 additions and 151 deletions

14
.gitignore vendored
View File

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

6
.idea/vcs.xml Normal file
View File

@ -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>

View File

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

View File

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

File diff suppressed because one or more lines are too long

View File

@ -1,42 +1,41 @@
import React, { Component } from 'react';
import { WebView, View, StyleSheet, Platform } from 'react-native';
import React, {Component} from 'react';
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) {
super(props);
this.setNewOption = this.setNewOption.bind(this);
}
componentWillReceiveProps(nextProps) {
if(nextProps.option !== this.props.option) {
this.refs.chart.reload();
constructor(props) {
super(props);
this.setNewOption = this.setNewOption.bind(this);
}
}
setNewOption(option) {
this.refs.chart.postMessage(JSON.stringify(option));
}
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'}
source={require('./tpl.html')}
onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
/>
</View>
);
}
componentWillReceiveProps(nextProps) {
if (nextProps.option !== this.props.option) {
this.refs.chart.reload();
}
}
setNewOption(option) {
this.refs.chart.postMessage(JSON.stringify(option));
}
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'}
source={require('./tpl.html')}
onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
/>
</View>
);
}
}

View File

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

File diff suppressed because one or more lines are too long

View File

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