...
|
...
|
@@ -8,6 +8,7 @@ import { |
|
|
Text,
|
|
|
Platform,
|
|
|
NativeModules,
|
|
|
Dimensions,
|
|
|
} from 'react-native';
|
|
|
|
|
|
export default class ChartView extends Component {
|
...
|
...
|
@@ -50,7 +51,7 @@ export default class ChartView extends Component { |
|
|
}
|
|
|
}
|
|
|
|
|
|
const chartHeight = (Platform.OS === 'android') ? 250 : 175;
|
|
|
const chartHeight = (Platform.OS === 'android') ? 250 : 250;
|
|
|
|
|
|
const styles = StyleSheet.create({
|
|
|
container: {
|
...
|
...
|
@@ -59,7 +60,7 @@ const styles = StyleSheet.create({ |
|
|
titleStyle: {
|
|
|
fontSize: 14,
|
|
|
color: '#b1b1b1',
|
|
|
marginTop: 20,
|
|
|
marginTop: 15,
|
|
|
marginLeft: 15,
|
|
|
},
|
|
|
chartStyle: {
|
...
|
...
|
@@ -70,17 +71,19 @@ const styles = StyleSheet.create({ |
|
|
},
|
|
|
});
|
|
|
|
|
|
const fontSize = (Platform.OS === 'android') ? 14 : 24;
|
|
|
const fontSize = (Platform.OS === 'android') ? 14 : 14;
|
|
|
const width = Dimensions.get('window').width;
|
|
|
|
|
|
function getHTMLString(xData, yData, jsPath) {
|
|
|
const HTML = `
|
|
|
<!DOCTYPE html>
|
|
|
<html style="height: 100%; margin: 0px;">
|
|
|
<html style="width: ` + width + `; height: 100%; margin: 0px;">
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
|
|
|
</head>
|
|
|
<body style="height: 100%; margin: 0px;">
|
|
|
<div id="container" style="height: 100%; margin: 0px; min-height: 250px;"></div>
|
|
|
<body style="width: ` + width + `; height: 100%; margin: 0px;">
|
|
|
<div id="container" style="width: ` + width + `; height: 100%; margin: 0px; min-height: 250px;"></div>
|
|
|
<script type="text/javascript" src="`+ jsPath +`"></script>
|
|
|
<script type="text/javascript">
|
|
|
var dom = document.getElementById("container");
|
...
|
...
|
@@ -91,6 +94,13 @@ function getHTMLString(xData, yData, jsPath) { |
|
|
title: {
|
|
|
show: false,
|
|
|
},
|
|
|
grid: {
|
|
|
left: '5%',
|
|
|
top: 60,
|
|
|
right: '8%',
|
|
|
width: '90%',
|
|
|
height: '65%',
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
boundaryGap: true,
|
...
|
...
|
@@ -114,7 +124,7 @@ function getHTMLString(xData, yData, jsPath) { |
|
|
splitLine: {
|
|
|
show: false,
|
|
|
},
|
|
|
data:[`+xData+`]
|
|
|
data:[` + xData + `]
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
...
|
...
|
@@ -135,7 +145,7 @@ function getHTMLString(xData, yData, jsPath) { |
|
|
trigger: 'axis',
|
|
|
alwaysShowContent: 'true',
|
|
|
position: function (point,params,dom) {
|
|
|
return [point[0]/7*7-40,0];
|
|
|
return [point[0] / 7 * 7 - 20, 20];
|
|
|
},
|
|
|
backgroundColor: 'orange',
|
|
|
formatter: '{c}',
|
...
|
...
|
@@ -148,8 +158,7 @@ function getHTMLString(xData, yData, jsPath) { |
|
|
opacity: 1,
|
|
|
},
|
|
|
},
|
|
|
extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);',
|
|
|
padding:[10,20],
|
|
|
padding:[5, 10],
|
|
|
},
|
|
|
series: [
|
|
|
{
|
...
|
...
|
|