Попытка удалить индекс выше количества детей
Я использую Victory Native для рисования исторических графиков криптовалюты, и, как пользовательские свитки, он покажет стоимость монеты в то время.
Моя реализация успешно работает на iOS, но на Android выдает следующую ошибку
Попытка удалить индекс вида выше числа детей 2
Вот так выглядит мой График Победы
<VictoryGroup
padding={0}
height= {150}
containerComponent={
<VictoryCursorContainer
cursorDimension="x"
onCursorChange={(value, props) => this.handleCursorChange(value,props)}
cursorLabel={(cursor) => ``}
/>
}>
<VictoryArea
style={{ data: { fill: this.chartColor } }}
data={this.props.coinHistory}
domain={{
y: [this.coinMinimum, this.coinMaximum]
}}
groupComponent={<VictoryClipContainer clipPadding={{ top: 1, right: 1 }}/>}
style={{ data: { fill: this.chartColor, stroke: this.chartBorder, strokeWidth: 3, strokeLinecap: "round" } }}
/>
{point}
</VictoryGroup>
И здесь работает вся логика
let coinMinimumA = []
let point;
const { range, first, last } = _;
const findClosestPointSorted = (data, value) => {
// assumes 3 things:
// 1. data is sorted by x
// 2. data points are equally spaced
// 3. the search is 1-dimentional (x, not x and y)
if (value === null) return null;
const start = first(data).x;
const range = (last(data).x - start);
const index = Math.round((value - start)/range * (data.length - 1));
return data[index];
};
class CoinChart extends PureComponent {
constructor() {
super()
this.coinMinimum
this.coinMaximum
this.chartColor
this.chartBorder
this.valueAtSelectedTime
this.selectedTime
this.chartPriceColorMain
}
state = {
loaded: false,
activePoint: null
}
handleCursorChange = (value, props) => {
//Converting the value we want to show
const numberSearch = Math.round(value)
this.selectedTime = this.props.coinHistory[numberSearch]["cHT"]
this.selectedTime = new Date(this.selectedTime).toString()
this.selectedTime = this.selectedTime.split(' ').slice(0, 5).join(' ');
this.valueAtSelectedTime = this.props.coinHistory[numberSearch]["y"]
//This will call function which declared in the global modular scope
this.setState({
activePoint: findClosestPointSorted(this.props.coinHistory, value)
});
}
render () {
//THis is that dot which would appear on the slected point
let activePoint = this.state.activePoint;
point = activePoint ?
(<VictoryScatter data={[activePoint]} style={{data: {size: 200, fill: "#FFC107"} }}/>)
: null;
if (this.props.coinHistory.length > 1) {
coinMinimumA =[]
//Making aray of all the value in Y axis to make domain
for (let i = 0; i < this.props.coinHistory.length; i++ ) {
coinMinimumA.push(this.props.coinHistory[i]["y"])
}
//Making minimum and maximum Domain for the chart
this.coinMinimum = Math.min(...coinMinimumA)
this.coinMaximum = Math.max(...coinMinimumA)
//Setting up color for the chart depending on the market cap
if (this.props.chartColor.cap24hrChange > 0) {
this.chartPriceColorMain = "#689F38"
this.chartColor = "#8BC34A"
this.chartBorder = "#689F38"
} else if (this.props.chartColor.cap24hrChange < 0) {
this.chartPriceColorMain = "#F44336"
this.chartColor = "#ff4c4c"
this.chartBorder = "#D32F2F"
}
if (!this.state.loaded ) {
this.setState({loaded: true})
}
//Intially when user does not scroll the value of selected coin is null and hence we ae giving to the current coin value
if (!this.valueAtSelectedTime && this.props.chartColor["price_usd"]) {
this.valueAtSelectedTime = this.props.chartColor["price_usd"]
this.selectedTime = new Date().toString()
this.selectedTime = this.selectedTime.split(' ').slice(0, 5).join(' ');
}
}
Вопрос: Может ли кто-нибудь посмотреть приведенный выше фрагмент кода и посмотреть, сможет ли он найти ошибку?
Вот гиф того, что происходит