Google Finance with Flex Code

Posted At : August 14, 2007 8:08 AM | Posted By : Brendan Meutzner
Related Categories: Flex Charting

So here's the code as I promised. There is still a minor bug I'm going to work out with the range drag to the extreme right, and will repost with updated code once fixed. But for now, enjoy.

Samples Index - Right click for source

Related Blog Entries

Google Finance with Flex from Silvafug last night (June 15, 2007)
Chart Range Selector - Take Two (March 12, 2007)
Flex Chart Range Selector - Google Finance'ish (March 9, 2007)

Comments

Great job!

# Posted By Hamad Amaral | 8/14/07 12:28 PM

Thank you for this great component !

# Posted By Julien | 8/14/07 1:04 PM

THis is a fantastic component. THanks for sharing!

# Posted By Denis | 8/14/07 2:03 PM

That is simply amazing. I've always wondered how they did that!

# Posted By Nate | 8/14/07 4:50 PM

When I'm trying to compile the source on my own using the Flex SDK I get the following errors:

(443) Error: Type was not found or was not a compile-time constant: DateTimeAxis.
(563) Error: Type was not found or was not a compile-time constant: CartesianChart.
(696) Error: Type was not found or was not a compile-time constant: CartesianChart.

Anybody having an idea what I'm missing?

Anyways, thanks for this great component!

# Posted By def | 8/14/07 5:13 PM

Do you have the chart.swc library in your sdk folder? It's not finding Classes that are located in that swc.

# Posted By Brendan Meutzner | 8/14/07 6:05 PM

Fantastic Brendan. :) Thanks a lot.

# Posted By Jaga | 8/14/07 6:10 PM

Thanks Berndan! Got it working :)

# Posted By def | 8/15/07 10:38 AM

Nice component, thanks. I changed the code to change the chart from a static width to a variable width. leftBox and rightBox do not resize correctly after the component is resized. What do you suggest to get that working correctly?

Thanks.

# Posted By r | 8/16/07 2:38 AM

Great! Thanks!

Cyril

# Posted By Cyril Gambis | 8/16/07 9:37 AM

@r

Sorry for the late reply. If you'll be resizing the component dynamically, just make sure you reset the ratio value that's used to calculate (on resize) the difference between the HDividedBox width and the length of your data array.... that should do the trick :-)

# Posted By Brendan Meutzner | 8/20/07 8:03 AM

Thank you soo much!

# Posted By Kornel | 8/24/07 8:45 AM

This is Great Work! It helped me a lot.
Really looking forward for that "extreme right" bug fix.

Thank you :)

# Posted By pricca | 8/29/07 11:48 AM

Yeah, bug fix is coming... sorry I haven't had a chance to get to it yet. Alternatively, if anyone else comes up with the fix in the meantime, feel free to share :-)

# Posted By Brendan Meutzner | 8/30/07 5:34 PM

BTW, wouldn't it make more sense if the range area selector move it's RIGHT selector when you press the "5d 1m 6m" instead of it's LEFT ?

Like, you want a period of 6 months from Now, and not a period of 6 months counting backward from the end date isn't it?

Thanks!

# Posted By pricca | 8/31/07 11:09 AM

Well just found a way to do what I mentioned before:

when you call moveSlider, just change the leftIndicator for rightIndicator, and instead of subtracting the number of days, just add them :)

Anyways, even in the original example, that "5d 1m 6m" control produces some unexpected results.

Anyways, it's allways a GREAT Help and I thank you again Brendan for making my day a lot easier!

# Posted By pricca | 8/31/07 2:25 PM

Looks cool. I cannot seem to get this to work in Flex 2.0 SDK. Does this need Flex Charts?

# Posted By sandip | 8/31/07 3:01 PM

One word: awesome! Many thanks for putting up the source code ;-)

# Posted By Saheed | 9/1/07 12:36 AM

Its really a great work..
I was playing around with it and have increased the dataset to 10 years with only monthly breakup. By doing so, I found that its not correctly showing the axis also in many axis text is getting overlayed on each other. Please provide us guidance on this topic.

# Posted By Shaishav | 9/2/07 11:00 AM

I have the charts.swc files in sdk folder ;after compilation the swf file is created and when I run it shows the following error:
"error retrieving xml data"
Directory structure of swf file is at same leve of data folder.
What is missing?!!! can anybody give me suggestion. Thank you brendan for your excellent work.

# Posted By polok | 9/5/07 10:50 AM

What do you mean the axis is not displaying properly?

Yes, the items getting overlaid is an issue if you have a lot of data, but can be tweaked easily inside the custom renderer in order to reduce the number of labels displayed, or maybe rotating the text to fit more... it's really up to you on how to handle that.

# Posted By Brendan | 9/5/07 7:38 PM

Great work.

# Posted By Justin | 9/6/07 7:54 PM

Do you have any suggestions for using your "upgraded version" with less functionality - similar to the original chart you put it many months ago? I'm lookin to display data more simply, without all the financial perks (e.g. flagging dates, displaying dates, etc)...and I would like to just have the added functionality of the newer HSlider (it aligns better, you can pull the sides of the slider out without the data changing all the time, etc.).

I've been looking over the code but there's so many functions and variables that I can't seem to just remove the new HSlider and import it into your original graphing component.

Thanks!

# Posted By Chris Mina | 9/11/07 7:03 AM

Hey Brendan, this is an amazing tool...thanks so much for posting the code for it. I just had a quick question for you...when adding a legend with your code, I get an error associated with the custom item renderers for some reason...here is the error:

TypeError: Error #1034: Type Coercion failed: cannot convert mx.charts.chartClasses::LegendData@293db309 to mx.charts.ChartItem.
   at skins::ColumnSeriesCustomRenderer/set data()
   at mx.charts::LegendItem/set legendData()
   at mx.charts::Legend/::addLegendItem()
   at mx.charts::Legend/::populateFromArray()
   at mx.charts::Legend/mx.charts:Legend::commitProperties()
   at mx.core::UIComponent/validateProperties()
   at mx.managers::LayoutManager/::validateProperties()
   at mx.managers::LayoutManager/::doPhasedInstantiation()
   at Function/http://adobe.com/AS3/2006/builtin::apply()
   at mx.core::UIComponent/::callLaterDispatcher2()
   at mx.core::UIComponent/::callLaterDispatcher()

Any idea of why that may be happening? I tried messing around with set data to figure it out in the renderer, but couldn't figure out what to do. If you have time to look into it, I'd really appreciate it. Thanks!

# Posted By Amit Patel | 9/11/07 3:21 PM

Hey Brendan, very nice bit of code indeed. Have you attempted to run this under Flex 3?
I'm just debugging this error, though, I suspects its a Flex 3 issue. Any chance you could confirm?

TypeError: Error #1009: Cannot access a property or method of a null object reference.
   at mx.charts::AxisRenderer/private::measureTitle()
   at mx.charts::AxisRenderer/mx.charts:AxisRenderer::measure()
   at mx.core::UIComponent/private::measureSizes()
   at mx.core::UIComponent/validateSize()
   at mx.managers::LayoutManager/private::validateSize()
   at mx.managers::LayoutManager/private::doPhasedInstantiation()
   at Function/http://adobe.com/AS3/2006/builtin::apply()
   at mx.core::UIComponent/private::callLaterDispatcher2()
   at mx.core::UIComponent/private::callLaterDispatcher()
   at [renderEvent]

Thanks

# Posted By Heath | 9/11/07 3:51 PM

Forget that comment above. My bad.

# Posted By Heath | 9/11/07 4:20 PM

hi , Brendan ,is this application run on flex sdk? it can't work with flex builder3?is it?
i can't run it in flex 3.
thaks!!

# Posted By jeff | 10/19/07 9:26 AM

Hi Brendan !
I was just wondering how you can retrieve data from MySQL using php script instead of .xml. Could you help me with it ??

Thanks.

# Posted By Dinesh | 11/6/07 8:29 AM

Thanks for this code. This is tremendous. I have been working with the code for a few days now and I am having no luck getting my data to work with the code. I need to be able to plot hourly data instead of daily eg. <date>2006-07-08 12:00</date> any insights would be extremely helpful.

# Posted By Bahrmann | 12/4/07 9:51 AM

Forgive me, but how do I view the source code? Is it still up? right clicking and saving just gives me saved html. thanks alot

# Posted By Charlie | 12/18/07 12:27 PM

When viewing the application, right+click and View Source...

# Posted By Brendan | 12/18/07 1:01 PM

Good job, Brendan!
I built the project with Flex Builder 3 and getting an error while mouse over the main area.
Any comments? Thanks,
Alex

vReferenceError: Error #1069: Property showRenderer not found on mx.core.UITextField and there is no default value.
at ff2/getChartDataPoint()[/Users/alexvarshavsky/Documents/Flex Builder 3/ff2/src/ff2.mxml:651]
at ff2/__mainChart_mouseMove()[/Users/alexvarshavsky/Documents/Flex Builder 3/ff2/src/ff2.mxml:48]

# Posted By Alex | 1/6/08 8:21 PM

Sorry, I haven't had a chance to get the project ported into Flex 3 yet... I'd started the process back in late summer in early beta, but didn't get too much finished. It's on the list of things to do, but unfortunately further down the list right now ;-)

The error below seems to relate to the showRenderer method inside the custom line or column renderer (inside the skins folder i believe). showRenderer gets called on the children of the series, and i believe the ordering is different in the Flex3 components for chart series. I'd try debugging the app putting breakpoints where showRenderer is getting called on the mouseover events on the chart, and see if you can determine the children of the series that it's getting called on.

Hope that helps for now... let me know if you can't get it fixed (or if you can too!) and I'll have a look into it.

# Posted By Brendan Meutzner | 1/7/08 10:42 AM

Hey Brendan! I love your example. I was trying to build the project in my own Flex environment but I get this error:

[Style] must annotate a class.

And it goes to the FillStyles.as file

Any ideas?

# Posted By eve | 1/8/08 11:00 AM

hi Brendan

the charts you have developed are mind blowing. i an new to this blog and also to flex, so can you please help me how to download your code and run it.

# Posted By vikram | 1/14/08 7:54 PM

hi Brendan.
On "Google Finance " can add synbol, it can compare symbols. But in demo only a symbol. Brendan help ...

# Posted By Tran Tan | 1/22/08 2:11 AM

hi,

could you give an example to generate the swf, like the code or script that use to run this library

Thanks

# Posted By enrique Sanchez | 2/28/08 10:23 AM

Hi Brendan,

great example. To Alex's problem (Error #1069: Property showRenderer not found on mx.core.UITextField and there is no default value.):

If you remove the custom method showRenderer in skins/LineSeriesCustomRenderer the error disappears for me.

# Posted By Lotte | 3/6/08 8:09 AM

Hi,
regarding error : "vReferenceError: Error #1069: Property showRenderer not found on mx.core.UITextField and there is no default value.
".
One such solution is to replace
"mainChart.series[0].getChildAt(i + 1).showRenderer(false);"
with
"mainChart.series[0].getChildAt(i + 1).alpha = 0 ;"
AND
"mainChart.series[0].getChildAt(i + 1).showRenderer(true);"
with
"mainChart.series[0].getChildAt(i + 1).alpha = 1;"

# Posted By Sumit | 3/14/08 6:42 AM

I am also getting the same error message as polok,
"error retrieving xml data"
though swf file is created after compile. does any have had this issue please let me know

# Posted By narup | 3/19/08 12:10 PM

You can fix a lot of warnings in flex 3 by changing the code for

horizontalAxisRenderer to horizontalAxisRenderer

and

verticalAxisRenderer to verticalAxisRenderers

# Posted By Nikos Katsikanis | 7/26/08 6:04 AM

In the videos it was stated that writing a custom axis renderer would not be done but in the updated code a custom axis renderer was included. Good job guys. :-)

# Posted By Nikos Katsikanis | 8/2/08 12:24 AM

Hi there,

The chart you have developed is awesome. It works fine for me, I just have one more requirement which is dragging the chart’s data points and the whole series. I was able to do this for another charts, but not for this one, my code doesn't have any effect on the graph. Am I missing something here?

# Posted By Nani | 8/8/08 9:08 AM

Regarding the "Error retrieving XML" issue, I just appended -use-network=false at the compiler arguments. Maybe there is sthing cleaner to fix this, but it works that way

# Posted By Fred | 8/19/08 4:36 AM