lvwang2002
/
react-native-echarts
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixed #2

This commit is contained in:
somonus 2016-11-01 17:31:14 +08:00
parent 40752bbacf
commit 1aa33b9c13
5 changed files with 75 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
example/package.json
View File

@ -9,7 +9,7 @@
"dependencies": { "dependencies": {
"react": "15.3.2", "react": "15.3.2",
"react-native": "0.35.0", "react-native": "0.35.0",
"native-echarts": "0.1.0" "native-echarts": "0.2.0"
}, },
"jest": { "jest": {
"preset": "jest-react-native" "preset": "jest-react-native"

2
package.json
View File

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

3
src/components/Echarts/index.js
View File

@ -8,10 +8,11 @@ export default class App extends Component {
return ( return (
<WebView <WebView
scrollEnabled = {false} scrollEnabled = {false}
injectedJavaScript = {renderChart(this.props)}
style={{ style={{
height: this.props.height || 400, height: this.props.height || 400,
}} }}
source={{html: renderChart(this.props.option)}} source={require('./tpl.html')}
/> />
); );
} }

36
src/components/Echarts/renderChart.js
View File

@ -1,39 +1,11 @@
import echarts from './echarts.min'; import echarts from './echarts.min';
import toString from '../../util/toString'; import toString from '../../util/toString';
export default function renderChart(option) { export default function renderChart(props) {
const height = props.height || 400;
return ` return `
<!DOCTYPE html>\n document.getElementById('main').style.height = "${height}px";
<html>
<head>
<title>echarts</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style type="text/css">
html,body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
#main {
height: 100%;
}
</style>
<script>
${echarts}
</script>
</head>
<body>
<div id="main" ></div>
<script>
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main')); var myChart = echarts.init(document.getElementById('main'));
// 使用刚指定的配置项和数据显示图表。 myChart.setOption(${toString(props.option)});
myChart.setOption(${toString(option)});
</script>
<body>
<html>
` `
} }

65
src/components/Echarts/tpl.html Normal file
View File

File diff suppressed because one or more lines are too long