charting plugin

Hi,

Well, hopefully the module itself should work. I’m not too concerned about the demo project at the moment.

I should have my developers account renewed in the next couple weeks and I’ll tweak on it.

Thanks again.

-dev

OK, so I am testing the webView option and I am running into this:  

Native display objects are separate from Corona’s OpenGL drawing canvas and always appear in front of normal display objects.

So is there any way around this?   My drop downs in my app are covered up by this web screen so the user can’t select anything from a pick list.   How did you draw on this for your wife’s weather app?   

Hi,

The module I created will return an image which can used with a displayObject, so you wouldn’t have that issue.

It’s not using the old Google API either, it is all based on the current one.

The demo project isn’t fit for IOS at the moment, but if you use the module in your own project it should work.

FWIW.

-dev

native.* objects sit in front of display objects. There is nothing that can be done about it. Honestly I think @develephant’s module might be a great option if you can pass the data you need to it.

Rob

@Develephant

OK,  I am trying to give your code a try and it seems the listener is called but the url never has data:image in it.  So I never get inside this if stmt: 

 print ("googlecharts webListener", event.url ) if event.url and string.find(event.url, "#data:image") then print ("googlecharts webListener2", event.url ) webView:stop() webView:removeSelf() local b64\_encoded = split(event.url, ",")[2] local file\_path = \_processPng( dest\_file, dest\_dir, b64\_encoded ) return listener({ filename = dest\_file, baseDir = dest\_dir }) end

When I look at my log it looks like the listener is called 3 times but never with the url having the word image in it. 

Does this thing work in the simulator?  That is where I am trying it.  

I needed a bar graph for my game… I looked at google but decided to roll my own.

As SGS shows, you can roll your own bar and line charts.

As for pie charts, you can use this feature in SSK:

https://roaminggamer.github.io/RGDocs/pages/SSK2/libraries/misc/#createpiechart

pie.gif

Looks very nice.  I bow to your awesomeness. 

L

I have tried the Google_charts code on 2 windows machines and both failed to return the image in mine format as a url.  However, I just tried it on a Mac and it worked perfectly.   What could be the difference?  Is Corona on Windows when it runs webView calling the local browser for anything?   This must be a settings problem but I don’t know where to start looking because I don’t know how webView actually works.  

If you can open the link in a browser it should work in simulator.  After all the simulator just uses IE anyway.

Do you have a link we can test with?

If you download the google-charts .zip here https://github.com/develephant/google-charts-corona/archive/master.zip

 

And then run the demo in the demo folder using the Corona simulator (not on device yet), does an image of a Google chart show up?

replace main.lua with this

local webView = native.newWebView( display.contentCenterX, display.contentCenterY, display.actualContentWidth, display.actualContentHeight ) webView:request( "charts/pie\_3d.html", system.ResourceDirectory )

the code is expecting the URL to included a png but this seems to fail on windows.

I think we all agree webview works.   it is the link between the html listener and the lua listener that is suspect on Windows. 

Hi,

I’ll boot up a Windows machine and see what might be happening. Thanks for the info, I appreciate it.

-dev

@dev, the problem on windows is the URL is changed after the callbacks have processed.

The SVG plugin seems to do the job for me. Perhaps can help someone else too.

local nanosvg = require( "plugin.nanosvg" ) local slices = { { percent = .15, color = "#FF0000" }, { percent = .75, color = "#00FF00" }, { percent = .1, color = "#0000FF" }, } local cumulativePercent = 0 for i = 1, #slices do local percent = slices[i].percent local color = slices[i].color local startX = math.cos( 2 \* math.pi \* cumulativePercent) local startY = math.sin(2 \* math.pi \* cumulativePercent) cumulativePercent = cumulativePercent + percent local endX = math.cos( 2 \* math.pi \* cumulativePercent) local endY = math.sin( 2 \* math.pi \* cumulativePercent) if percent \>= .5 then largeArcFlag = 1 else largeArcFlag = 0 end local pathData = "M "..startX.." "..startY.." A 1 1 0 "..largeArcFlag.." 1 "..endX.." "..endY.." L 0 0" local pathline = "\<svg width='400' height='400' viewBox='-1 -1 2 2' style='transform: rotate(-90deg)'\>\<path d = '"..pathData.."' fill='"..color.."' /\>\</svg\>" local circle = nanosvg.newImage( { data = pathline, x = display.contentCenterX, y = display.contentCenterY, }) end

pie-test.jpg

I dont use html much but does this help? :

https://docs.coronalabs.com/api/library/native/newWebView.html

Hi,

Are these charts to be displayed inside the app itself?

-dev

That almost helps.   Wouldn’t I need to send some kind of command to a web server and ask it to build a page dynamically based on the chart I would like to display.  Then have it pass me back a url I could call to then call the newWebView api and include such page in my app.  I rate that idea convoluted, error prone, and difficult and I would need to have a web server some where?  :(  

Keep those ideas coming tho.  

Ideally, yes