Welcome Guest Search | Active Topics |

candlestick chart : strange display
Options
Previous Topic Next Topic
d_vineet
#1 Posted : Tuesday, July 17, 2012 9:06:48 AM(UTC)
Rank: Newbie

Groups: Registered
Joined: 7/15/2012(UTC)
Posts: 4

Thanks: 1 times
Was thanked: 0 time(s) in 0 post(s)
With the following code, candlestick chart is rendered correctly.

Code:

<script lang="javascript" type="text/javascript">
        $(document).ready(function () {
            $('#jqChart').jqChart({
                title: { text: 'CNDL CHRT' },
                series: [
                            {
                                type: 'candlestick',
                                data : [ ['Mon', 5375, 5325, 5340, 5330], ['Tue', 5322, 5250, 5290, 5270], ['Wed', 5375, 5325, 5340, 5330], ['Fri', 5322, 5250, 5290, 5270]]
                                                            }
                        ]
            });
        });
    </script>


All other things unchaged except for the JSON data as under, the chart is not rendered correctly.
Tooltips are displayed for only some of the bars.
All bars are without fill-color.

Code:

data : [["2012/07/02:0920", 5308.2, 5308.2, 5288.0, 5292.4], ["2012/07/02:0930", 5292.0, 5296.7, 5283.35, 5295.05], ["2012/07/02:0940", 5295.95, 5297.3, 5286.6, 5288.55], ["2012/07/02:0950", 5289.4, 5292.0, 5284.0, 5285.0]]


What may be wrong in the second "data" json object?

Thanks,

Vineet
Back to top
Dragan
#2 Posted : Tuesday, July 17, 2012 9:56:42 AM(UTC)
Rank: Advanced Member

Groups: Administrators, DataVizJavaScript, jQueryChart, jQueryDV, MvcChart, Registered
Joined: 1/3/2011(UTC)
Posts: 483

Thanks: 0 times
Was thanked: 87 time(s) in 87 post(s)
Hi Vineet,

The jqChart candlestick chart accepts data is in format HLOC. I believe you second data is in format OHLC.

You can convert it with something like:
Code:
var data = [["2012/07/02:0920", 5308.2, 5308.2, 5288.0, 5292.4], ["2012/07/02:0930", 5292.0, 5296.7, 5283.35, 5295.05], ["2012/07/02:0940", 5295.95, 5297.3, 5286.6, 5288.55], ["2012/07/02:0950", 5289.4, 5292.0, 5284.0, 5285.0]];

        for (var i = 0; i < data.length; i++) {

            var item = data[i];

            data[i] = [item[0], item[2], item[3], item[1], item[4]];
        }

        $('#jqChart').jqChart({
            title: { text: 'CNDL CHRT' },
            series: [
                        {
                            type: 'candlestick',
                            data: data
                        }
                    ]
        });
Best Regards,
Dragan Matek
jqChart Inc.
Back to top
d_vineet
#3 Posted : Tuesday, July 17, 2012 10:27:27 PM(UTC)
Rank: Newbie

Groups: Registered
Joined: 7/15/2012(UTC)
Posts: 4

Thanks: 1 times
Was thanked: 0 time(s) in 0 post(s)
Hi dragan !
I really appreciate your quick support.
I had overlooked the HLOC format.
Now the chart is rendered correctly.

Thank you very much.

-- Vineet
Back to top
Users browsing this topic
Guest (2)
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.

FlatEarth Theme by Jaben Cargman (Tiny Gecko)
Powered by YAF 1.9.4 | YAF © 2003-2010, Yet Another Forum.NET
This page was generated in 0.078 seconds.