I’m using display.newLine to make line graph. It works fine if I don’t mind horrid looking graph – but I do. The problem is, antialias doesn’t work even when it is set to true in config.lua. Does anyone know how to go about making a clean looking line graph?
Naomi
Maybe make it much larger, take a snapshot and then scale it down? Haven’t tried anything like that myself tough.
newLine is terrible. It has horrible edges and it produces a bounding box larger then the line object itself (i Think it’s like 3 extra pixels on either side) which makes it very hard to position properly. If its not too complicated (not many data points on the graph) I would use newRect to assemble the line.
Thank you for your thoughts, @jonjonsson and @primoz.cerar. I was fearing that my choice is going to be very limited. I was hoping I wouldn’t have to do the newImageRect (with edges blurred or fuzzy so that jaggedness will not be an issue.) At this point, it sounds like it might really be the option I’d have to choose. BTW, newRect will also manifest jagged edges. It looks fine if the rotation is 45 degree, but if you try 5 degree, you’ll see the problem.
IMHO, it’s a very basic thing for antialias to work. Perhaps it’s not so easy to implement, but still, it should’ve been taken care of from the start.
Now, I must investigate pythagorean theorum (and I majored in English… math class was something I took so long ago.) I have to do some Google search now and plunge myself into the world of math. Grim prospect, I know, but I will persevere.
That said, if any of the math wizards are reading this, I would be so grateful if you could spit out a formula for pulling out the angle/rotation and the length that I need from x1, y1 and x2, y2 coordinates.
Naomi
Edit: It looks like it isn’t all that hard. Cheers.
Another possibility, have you tried a blur filter (very little blur) on a group or snapshot of the graph, that might smooth it out a little.
So I think this is it:
The line length = math.sqrt( (x2-x1)*(x2-x1) + (y2-y1)*(y2-y1) )
Edit: The angle = math.atan2( y2-y1, x2-x1 ) * 180 / math.pi
Cheers,
Naomi
@mpappas, thank you for sharing your thoughts. I’ll pursue the option I’ve chosen for now, but if it doesn’t work, I’ll see how blur filter would fare. I’m a bit reluctant about doing the snapshot. I guess I’d have to get over it. But for now, I like the math approach I’m taking. (I only need 90 newImageRect objects to achieve what I need for my line graph, so it might just workout fine.)
Naomi
The math route works rather very nicely. I haven’t tested it on device, but so far, on simulator, it looks quite nice.
Naomi
blur and gaussian blur are horrible they create huge lag on older devices when using snapshots.
with the new fill API you can simply use an image of a single dot or slightly bigger to create a perfectly smooth line.
Hey, @jacques1, I’m wondering how you’d use a single dot to create a perfectly smooth line.
I use a square-like white image that is 8x8, with top & bottom of the square gradually becoming transparent. I made @2x and @4x images to make sure it looks good on retina devices too. I use the image to create each line (and apply fill color). Unfortunately, the connecting spots get a bit of a crack. So, in addition to 90 pieces of lines (to make 6 lines total), I add dots on each connecting spot to hide the crack. I’m happy with how it looks and it’s performing well on iOS devices so far.
Naomi
@Naomi: May you post a screenshot of your results so far? I am currently looking for a way to create some nice line-charts/graphs and this seems to be the only working solution at the moment 
Hey, CineTek, if you could PM your email address, I’ll send you the screen capture of the line graph.
Cheers,
Naomi
Hey, CineTek, the screen capture of the line graph is on its way to you.
Cheers,
Naomi
P.S. I just realized I can attach a file to personal message via Corona Messenger here. Nice to know.
What about creating two lines one on top of the other, only changing stroke and alpha? you make a thinner line with alpha=1, and another slightly thicker line on the back, with a lower alpha like 0.5? It does fix it, but might make it more acceptable…
Or maybe create 1 line as an image, and use several instances of the image to create your graph… this usually does the trick for me.
Maybe make it much larger, take a snapshot and then scale it down? Haven’t tried anything like that myself tough.
newLine is terrible. It has horrible edges and it produces a bounding box larger then the line object itself (i Think it’s like 3 extra pixels on either side) which makes it very hard to position properly. If its not too complicated (not many data points on the graph) I would use newRect to assemble the line.
Thank you for your thoughts, @jonjonsson and @primoz.cerar. I was fearing that my choice is going to be very limited. I was hoping I wouldn’t have to do the newImageRect (with edges blurred or fuzzy so that jaggedness will not be an issue.) At this point, it sounds like it might really be the option I’d have to choose. BTW, newRect will also manifest jagged edges. It looks fine if the rotation is 45 degree, but if you try 5 degree, you’ll see the problem.
IMHO, it’s a very basic thing for antialias to work. Perhaps it’s not so easy to implement, but still, it should’ve been taken care of from the start.
Now, I must investigate pythagorean theorum (and I majored in English… math class was something I took so long ago.) I have to do some Google search now and plunge myself into the world of math. Grim prospect, I know, but I will persevere.
That said, if any of the math wizards are reading this, I would be so grateful if you could spit out a formula for pulling out the angle/rotation and the length that I need from x1, y1 and x2, y2 coordinates.
Naomi
Edit: It looks like it isn’t all that hard. Cheers.
Another possibility, have you tried a blur filter (very little blur) on a group or snapshot of the graph, that might smooth it out a little.
So I think this is it:
The line length = math.sqrt( (x2-x1)*(x2-x1) + (y2-y1)*(y2-y1) )
Edit: The angle = math.atan2( y2-y1, x2-x1 ) * 180 / math.pi
Cheers,
Naomi