diff --git a/components/chart.js b/components/chart.js
index 26067b4..ad850aa 100644
--- a/components/chart.js
+++ b/components/chart.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react'
-import { FlatList } from 'react-native'
+import { View, FlatList } from 'react-native'
import range from 'date-range'
import Svg,{
G,
@@ -112,22 +112,49 @@ export default class CycleChart extends Component {
)
}
+ placeTicksForYAxis() {
+ const scaleMin = config.temperatureScale.low
+ const scaleMax = config.temperatureScale.high
+ const numberOfTicks = (scaleMax - scaleMin) * 2
+ const tickDistance = config.chartHeight / numberOfTicks
+ const ticks = []
+ const labelStyle = styles.column.label.date
+ for (let i = 0; i < numberOfTicks; i++) {
+ const y = tickDistance * i
+ ticks.push(
+
+
+ {scaleMax - i * 0.5}
+
+ )
+ }
+ return ticks
+ }
+
render() {
return (
- {
- return (
-
- )
- }}
- keyExtractor={item => item.dateString}
- >
-
+
+
+ {
+ return (
+
+ )
+ }}
+ keyExtractor={item => item.dateString}
+ >
+
+
)
}
}
@@ -163,6 +190,6 @@ function getPreviousDays(n) {
function normalizeToScale(temp) {
const temperatureScale = config.temperatureScale
const valueRelativeToScale = (temperatureScale.high - temp) / (temperatureScale.high - temperatureScale.low)
- const scaleHeight = config.chartLength
+ const scaleHeight = config.chartHeight
return scaleHeight * valueRelativeToScale
}
\ No newline at end of file
diff --git a/components/config.js b/components/config.js
index b012283..7f55ff8 100644
--- a/components/config.js
+++ b/components/config.js
@@ -1,5 +1,5 @@
const config = {
- chartLength: 350,
+ chartHeight: 350,
columnWidth: 30,
temperatureScale: {
low: 33,
@@ -10,7 +10,7 @@ const config = {
const margin = 3
config.columnMiddle = config.columnWidth / 2,
-config.dateRowY = config.chartLength - 15 - margin
-config.cycleDayNumberRowY = config.chartLength - margin
+config.dateRowY = config.chartHeight - 15 - margin
+config.cycleDayNumberRowY = config.chartHeight - margin
export default config
\ No newline at end of file
diff --git a/components/styles.js b/components/styles.js
index a6432b6..cddb675 100644
--- a/components/styles.js
+++ b/components/styles.js
@@ -38,7 +38,7 @@ const styles = {
x: 0,
y: 0,
width: config.columnWidth,
- height: config.chartLength
+ height: config.chartHeight
}
},
bleedingIcon: {
@@ -46,6 +46,11 @@ const styles = {
scale: 0.6,
x: 7,
y: 3
+ },
+ yAxis: {
+ height: config.chartHeight,
+ width: config.columnWidth,
+ stroke: 'grey'
}
}