Info

Open Website

Testing and Issues

You can test this app and submit issues during the testing period of the JavaScript Chart contest.

Entries with serious issues will not be able to win the contest, but even minor issues might be important for overall results.

Voting

7127
by rating

Issues

Fair Quokka May 8, 2019 at 14:29
— Overall performance is slightly above average.
— The app is slow when filtering and scaling graphs #3 and #5.
— Bonus goal is partially implemented, pie chart is missing. Sloppy on zooming in and out.
_____
Sure, please take a look at the attached video (Galaxy J7).
Samsung Galaxy J7 (2017), Android 8.1.0; iPhone 5S, iOS 12.1
32
Dark Parrot May 8, 2019 at 18:31
Thanks for review, can you please explain what does “sloppy” means? Or attach a video demonstrating.

Upd. See attached video. It is very strange, cause i used for testing Samsung Galaxy J1 (not 7, but 1, very slow device) and it shows very decent zoom animation. At least far better than shown on your video. I recorded video from J1 to show you, please, check it.
Slim Jaguar Apr 18, 2019 at 19:32
Zero y axis values, after a couple of clicks on zoom out
12
Dark Parrot Apr 18, 2019 at 20:08
First i think this is a fake screenshoot, but tested for myself and yep, bug, you are right.
Upd.: found the bug, it's on formatting, child's mistake, sprinkle my head with ashes
lines appear under the graph
12
Dark Parrot Apr 19, 2019 at 07:13
Thanks, will fix it.
Good job man, but performance could be better. And 25KB gzip is quite big for such library
4
Dark Parrot Apr 18, 2019 at 21:39
I tried to pay attention not only to performance, but also to UX/UI details, sometimes they are on different sides of the barrikades and compromise need to be found. Btw, it's not minified (as was requested by the submit bot). Minified gzip version is 17KB.
Swift Starfish Apr 19, 2019 at 17:35
- Selected poins are hidden under the tooltip.
- Moving from point to point is not animated, but this behavior shown on video example provided by telegram (example video #1), so should be
2
Dark Parrot Apr 19, 2019 at 18:33
1. That's why you can move tooltip vertically as you wish, to reveal all data you need to see. This is far better then jerking panel which tries to decide by itself where to position it to be all points visible.
2. Yes, have no time to implement all animations.
No bonus task for percentage stacked chart (pie chart)
Chrome 73
1
Dark Parrot Apr 17, 2019 at 13:57
hard not to notice ;)
Impossible to select less than approximately a month on daily graph and less than a day on hourly graph. The navigation on hourly graph is in one day steps only.
Chrome 73
1
Dark Parrot Apr 17, 2019 at 14:00
It's up to developer to set constraints. For hourly graph snappging/ magnetic behaviour to day bounds is by design (ft least at vide for last chart). But agreed, for 5th chart it is obvious, for another one it depends, i think that it is useful to snap to bound to quickly switch days
Slim Peacock Apr 18, 2019 at 17:11
- perfomance issues on cheking-unchecking values on "fruits 1" chart

- perfomance issues on every chart on zoom animations

- no animations on value change in interval or tooltip

- page zooming allowed on mobiles
BQ strike mini, 4x1.3Hhz, 1Gb RAM, Chrome, Android 7
1
Dark Parrot Apr 18, 2019 at 19:20
1. Can you please attach video demonstration
2. There is marnet behaviour of slider, it'is done not very well and for long swipes follows the fingers with some time trail.
But animations itself should be fast, again, can you provide video to see this issue
3. Yes, I don't like it :) leave it to the very end, and not even done main features, but have no regrets about this animations, as far as i can see it on another solutions, even done as expected it is very annoying
4. That is bad with this? It's normal for mobile devices to allow users to zoom.
The animations are very laggy if u switching the lines. Overall performance is good but switching is a really problem. The rest is really good. I'll give u a like!
Chrome for Android / Nexus 6p
1
Dark Parrot Apr 18, 2019 at 20:14
I can't see "very laggy" on applied video, but if you stated this, let it be so, can agree that it could be done better.
Stacked: doesn't reach top value
MBP 2018 15, Chrome, Mojave
1
Dark Parrot Apr 24, 2019 at 22:48
Range is rounded, as was recommended by TG contest team in review for my app at first stage, by the power of ten multiplied with 1,2,5, as much power as possible to be chart as much visible as possible (this can be catched from mockups), i'v decided to use threshold 0.5 of lines step size to check is it suited rounding or we whoudl decrease rounding step. It gives nice numbers and quite good fullfillness of chart area.
Line chart 2Y: doesn't reach bottom
MBP 2018 15, Chrome, Mojave
1
Dark Parrot Apr 24, 2019 at 22:50
Second line corresponds to the range of the first one (because main range line is certanly the left one), but when we switch first on/off it seems to be that second one could for now fill all available space as it wanted to, and so i do at first iteration, but in reality this behaviour simply looks weird, because then we switch the second one - first one never changed its scale, this is a confusing situation for user so i've decided not to adjust second line range on first one switching on/off too, it looks more logical and less confusing.
The chart doesn't stay inside the container and slides over the sides of the preview area
Chrome 73
Dark Parrot Apr 17, 2019 at 14:01
It is by desing exaclty, see JS_9.png, some padding outside main area, looks pretty in mobile devices
Initial search position for all charts is 5 January 2019 - 6 April 2019, not 6 March - 6 April
Chrome 73
Dark Parrot Apr 17, 2019 at 14:03
it's absolutely irrelevant, everyone has initital config and this values can be tuned, i simply use 25% of total data size, approach no worse than others
Unable to select time range by dragging in the preview area (outside of the current window).
Dark Parrot Apr 18, 2019 at 19:21
Can you explain in more details?
Gentle Squid Apr 18, 2019 at 15:51
This is the best line chart zoom logic among all other participants. probably only mine could compete with this one.

p.s. there was also a very strong implementation of one guy who sent his link in the chat. but I didn't see it among accepted participants.

vanguyu you will be the winner ;)
Dark Parrot Apr 18, 2019 at 19:08
Thanks, i'v tried to do every tasks but underestimated whole task, and have no time to do pie chart, but i do it after deadline, to reabilitate me for myself ) http://chart.zavtramen.ru only morphing transition, as the most tricky part
infinite data loading when you quickly click
Dark Parrot Apr 18, 2019 at 20:10
But it loads after you stopped raping it ;) and no errors
Giant Parrot Apr 19, 2019 at 13:59
1. Sometimes the values on the Y scales of the «Interactions» chart change with no transition
2. The header right part and the texts in the tooltip are not animated.
MacBook Pro 2015 / 12.1
Dark Parrot Apr 19, 2019 at 15:47
1. This is done on purpose. For small range changes values switched without movement to prevent visually glitchy line-numbers shift and fade for a couple of pixels (because their shift is correlated with their position on the plot and range they represent), so i move them out only for big range changes, for small they stand still and do not distract user with endless inplace animation
2. Yes, I don't like it :) have no regrets about this animations, as far as i can see it on another solutions, even done as expected it is very annoying 
extra bars around the edges
Dark Parrot Apr 20, 2019 at 09:20
Yes, excluded adjacent day bars from view, but forgot to exclude them for selection.
Swift Starfish Apr 20, 2019 at 08:46
The all buttons are crossed out. I remember I have tested your app already, but didnt noticed it. I pretty sure this was not appears for me before, but now I have tryed to reload page a few times - the buttons always crossed out.
Mozilla Firefox 66.0.3 / Win 10
Dark Parrot Apr 20, 2019 at 09:17
Strange, did't see this artefacts nowhere. But i've tested a lot, including FF for windows 10.
Large Beaver Apr 21, 2019 at 21:10
- no good buttons animations (subjectively)
- no pie chart
- invalid font size in IE11

but good performance and awesome zoom animation. voted +1.
Windows 8/IE11/Chrome 72
Dark Parrot Apr 21, 2019 at 22:18
1. subjectively, but yes, i also think it could be done nicer
2. first man wrote about it, i did it after deadline, if it means )
3. yes, font stack is no very safe, but in normal web app we are always using font-face, so this is not a big deal i think.

thanks for voting!
Giant Parrot Apr 24, 2019 at 06:41
1. The labels on the date scale of the zoomed stacked bar chart overlap each other.
2. The right trimmer of the zoomed stacked bar chart stands in a wrong position.
iPhone SE / Safari 12.1
Dark Parrot Apr 24, 2019 at 07:05
1. Witty Owl already issued this Apr 19 at 20:49
2. But i think that it'is in right position, bars shown outside main chart area are not included in trimmer selection. This is right behaviuor and can be easily proven: in the extreme positions, i.e. at the beginning and and at the end of the chart where there no overflowing chart data trimmer position is also at the beginning and and at the end of the preview. Attaching image from mockup.
Tooltip moves with cursor top/down - should be fixed on top by design
MBP 2018 15, Chrome, Mojave
Dark Parrot Apr 24, 2019 at 22:45
This is usefull to move it vertically by yourself to reveal hidden points if they appear on the top of the chart, this is my UX decision. Btw, if you check JS_1 and JS_2 mockups you will see that tooltip is not always on the top.
Stacked: red data not visible
MBP 2018 15, Chrome, Mojave
Dark Parrot Apr 24, 2019 at 22:51
Nope, it visible, small semi transparent lines on top.
Line charts preview: doesn't reach top/bottom
MBP 2018 15, Chrome, Mojave
Dark Parrot Apr 24, 2019 at 23:00
And it shouldn't. Look closely to JS_1 mockup and you will see.
Line chart 1Y: doesn't reach bottom
MBP 2018 15, Chrome, Mojave
Dark Parrot Apr 24, 2019 at 22:59
Due to a rounding we has some space to play within, to get nice looking numbers and good chart area fulfillness. If lowest visible line point will always be on the bottom Y line we will obviously can't get nice looking Y 
values
Nobody added any issues yet...