wuxudong / react-native-charts-wrapper

a react native charts wrapper (support android & iOS)
2.44k stars 658 forks source link

Marker value on android has an issue with the decimal place. #212

Closed GermanMontejo closed 6 years ago

GermanMontejo commented 6 years ago

Hi @wuxudong . I've noticed a UI issue when the marker is enabled on a chart with the dataSet in an array of integer: i.e. [1500, 4600, 300, 500, 6800]

On an android device, the marker would display: 1.500 if i tap on the first bar (with the 1500 value).

On IOS this shows: 1500.0

Please help me on this issue. Thanks! I've checked on handleSelect and can confirm that the data is 1500, but on the marker it shows 1.500

wuxudong commented 6 years ago

I think maybe the default formatter is not suitable for you. it is related to locale.

you can just use custom marker, just use maker: "1500"

GermanMontejo commented 6 years ago

yeah I thought about that using the marker field by formatting the array to: [{x: 0, y:1500, marker: '1500'}]. but the thing is i'd have to do a lot of changes on our graphs and this is used by 4 other graph pages. i'd have to modify a lot in order to change the format of the dataSet. I'd like this to be the last resort when dealing with this issue. If there's something you can suggest other than the marker field, that would be greatly appreciated.

GermanMontejo commented 6 years ago

I'm thinking about directly modifying the text variable in public void refreshContent(Entry e, Highlight highlight) {} then replace the "." with an empty "".

Edit Hi @wuxudong I just proceeded with replacing the "." with "" as I mentioned above. I'll just use this in the meantime. If you have a better solution, please suggest it here. Thanks!

GermanMontejo commented 6 years ago

this won't work. i have decimal values in my other graphs. this will affect all the values with decimal point in them. EDIT: nevermind, there's e.getY() I'll see if I can use that.

wuxudong commented 6 years ago

I checked the code.

in RNRectangleMarkerView

text = Utils.formatNumber(e.getY(), digits, true);

and In MpAndroidChart

/**
 * Formats the given number to the given number of decimals, and returns the
 * number as a string, maximum 35 characters. If thousands are separated, the separating
 * character is a dot (".").
 *
 * @param number
 * @param digitCount
 * @param separateThousands set this to true to separate thousands values
 * @return
 */
public static String formatNumber(float number, int digitCount, boolean separateThousands) {
    return formatNumber(number, digitCount, separateThousands, '.');
}

I will use Utils.formatNumber(e.getY(), digits, false) instead.

GermanMontejo commented 6 years ago

Hello. Nice find! I used e.getY() awhile ago. I didn't read the source code for the formatNumber method because I couldn't find it when I searched for it so I just opted to use e.getY(). It worked as expected and I didn't feel the need to format my marker because it's showing 1500.0. If you push your fix, i'll pull it tomorrow and hopefully test it. Thank you for helping me.

On 7 Feb 2018 10:58 PM, "wuxudong" notifications@github.com wrote:

I checked the code.

in RNRectangleMarkerView

text = Utils.formatNumber(e.getY(), digits, true);

and In MpAndroidChart

/**

  • Formats the given number to the given number of decimals, and returns the
  • number as a string, maximum 35 characters. If thousands are separated, the separating
  • character is a dot (".").
  • @param number
  • @param digitCount
  • @param separateThousands set this to true to separate thousands values
  • @return */ public static String formatNumber(float number, int digitCount, boolean separateThousands) { return formatNumber(number, digitCount, separateThousands, '.'); }

I will use Utils.formatNumber(e.getY(), digits, false) instead.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/wuxudong/react-native-charts-wrapper/issues/212#issuecomment-363794822, or mute the thread https://github.com/notifications/unsubscribe-auth/AHtgNrmmUT_izt_XdjK0ngLZCixwNNLuks5tSboWgaJpZM4R8cEo .

soroushchehresa commented 6 years ago

for resolve this problem you can use marker key in values like this:

data: {
  $set: {
    dataSets: [{
      values:[
        { y: 100, marker: "100" },
     ]
   }]
  }
}

@GermanMontejo it's not best idea but just working :)