Open nyan-left opened 2 years ago
Hi, I'm here regarding a different issue, are you able to zoom-in in candlestick chart, if so, how can we do it? for example, if we have large data list, it populates all the candles across the whole width of screen i.e. it doesn't create a scroll effect nor it zooms-in. Are there any props that I'm not aware of? Please if you have something on this issue!
Hey @yash-007 ,
I would suggest opening a seperate issue for this.
I think to achieve this, you would have to manually work out a way to pass the updated data
props in. Most examples I've discovered so far simply use buttons at the bottom of the chart to load different data sets. For example:
Hourly, Daily, Weekly...etc.
You could in theory write some logic for zooming using gestures. Some things to think about:
Zooming out could work in a similar way.
You'll likely run into this issue https://github.com/coinjar/react-native-wagmi-charts/issues/20 , so have a look into updating the yRange too.
Not sure if this is the best approach, but it seems feasible :)
Hey @yash-007 ,
I would suggest opening a seperate issue for this.
I think to achieve this, you would have to manually work out a way to pass the updated
data
props in. Most examples I've discovered so far simply use buttons at the bottom of the chart to load different data sets. For example: Hourly, Daily, Weekly...etc.You could in theory write some logic for zooming using gestures. Some things to think about:
- You need a way to capture a ( presumably two-pointer) zoom gesture.
- Then work out which index of your data set the pointers cover. For example: if you had 100 data points from 1 to 100, and a user places the first finger at x: 40% and the other at 70%, you would know to update your data prop to a dataset ranging from index 40 to index 70 of your original dataset.
Zooming out could work in a similar way.
You'll likely run into this issue #20 , so have a look into updating the yRange too.
Not sure if this is the best approach, but it seems feasible :)
Hi, I tried to use PanGestureHandler and PinchGestureHandler inside a same view but only one appears to work at same time. Could please take a look, here is the project (just 3-4 files), I'm trying to implement candlestick chart using react-native-gesture-handler
and react-native-reanimted
.
https://github.com/theartificialguy/rn-candlestick-chart/tree/master
Thank you!
Using:
Current Output:
Expected Output:
The same applies to precision 1.
I'm aware that there's a
format
prop, but that also seems buggy. Will create a separate issue once I can reproduce it consistently.