Creating a simple stacked column chart – Flex

When I was working with Flex and Action Script 3.0 I used to do a lot of Dashboard and data visualization applications. One thing that I used to do often was a stacked column chart displaying multi dimensional data. So I thought of posting an example of creating a stacked chart out of the files deep within my Flex project folders. Let’s see the demo first and then move on to the explanation.

Demo: http://jbk404.site50.net/flex/playvideo/stackedchart.html

Stacked Column Chart
Stacked Column Chart - data visualization for three countries

Read More »

Advertisements

Play HTML5 Video or Flash video based on browser support

Now with the help of HTML5 we can play inline videos and rich multimedia using the <video> and the <audio> tags and do not require a flash plug-in or a flash player to play videos or audios anymore. The newer group of browsers (IE9, Safari 5+, Chrome 6+) have support for HTML5 <video> tag. But older browsers, browsers that do not have support for HTML5 features (eg. IE 7) still require a flash player and a third party flash plug-in to play multimedia. While developing a web app, as a developer you always want to support the entire range of users, so how do you ensure that your video plays for users even with older browsers. This tutorial will explain exactly how to do that. Check out the demo app first.

Demo:http://jbk404.site50.net/flex/playvideo/

Read More »

Pass parameters from HTML to Flex/Flash: Dynamic video player example

A quick example of passing parameters from HTML/Javascript dynamically to Flex/Action Script or Flash in some cases using flashvars. You can use it with any Flash based platform. Check out the demo first and then I will explain:

Demo Link: http://jbk404.site50.net/flex/htmlparameter/

What we have here is that there are two buttons in an HTML page. Each button when clicked plays a different video in the same Flex Video Player (which runs in a .swf file and uses the Flash plugin to render). So what I am doing is that on click of the button I call a javascript function wherein I pass the corresponding video URL as parameter to the Flex Video Player (which is a .swf file) using flashvars. This is how I am doing it,

<param name="flashvars" value="videoURL=videos/video' + target_obj.id + '.flv" />

target_obj.id is the id of the button clicked. The parameter is passed as a key-value pair. videoURL holds the dynamic URL of the video. There is one flash file (.swf) which reads the parameter passed in flashvars and then plays the video. This way multiple videos play in the same player.  I have named the videos as video1.flv and video2.flv which are inside videos folder under my root directory. Note that Flex/Flash video player runs a .flv format. When you look at the demo you might notice that a popup shows the video URL inside the player. That’s where it is getting the URL as parameter from HTML side. Also the video is auto played.Read More »