How to create stacked JqPlotBar chart

[newbie]

Hi, How do I create a stacked JqPlotBar chart in Tapestry? This is what I have tried. List<TextValueDataItem> list1 = CollectionFactory.newList(); List<List<TextValueDataItem>> dataList = CollectionFactory.newList(); list1.add(new TextValueDataItem("Test1", 50)); list1.add(new TextValueDataItem("Test1", 60)); dataList.add(list1); return dataList;   The result I get is a bar chart with one color until 60, with points label at 50 and 60. There is also no legend. Any help would be much appreciated. Thanks.

[Emmanuel DEMEY]

Hi, 

You will find a sample directly on the Github Repository :https://github.com/got5/tapestry5-jqPlot

In the src/test package, please have a look to the Index page. There is a sample using the JqPlotBar component. 

Manu

2013/7/23 newbie <codeh...@gmail.com>

--
You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

--
Emmanuel DEMEY
Ingénieur Etude et Développement
ATOS Worldline
+33 (0)6 47 47 42 02
demey.e...@gmail.com

http://emmanueldemey.fr/

Twitter : @EmmanuelDemey

[newbie]

Hi,

Thanks for your reply. I have taken a look at the Index page. It has several bar chart for one x-axis label. That is good. However, there is still no legend. How do I get legend? And I need stacked bar chart. This is what I have tried to get a stacked bar chart. I use "stackSeries=true" but it is not working. I still get a group bar chart, that is several bar chart for one x-axis label.

 

@Component
(parameters = {"dataItems=testData", "graphTitle=literal:XYBarChart", "stackSeries=true"}) 
private JqPlotBar chart4;

[Emmanuel DEMEY]

Where did you find the stackSeries parameters in the jQPlot component ? It is not a Tapestry parameter.  You should use the params parameter instead. It is a JSON-type object corresponding to the one provided by the jQuery widget : http://www.jqplot.com/docs/files/jqPlotOptions-txt.html

2013/7/23 newbie <codeh...@gmail.com>

 

 

 

--

You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[newbie]

 Hi,

Thanks for the reply. This is what I have tried with the params parameter.

 @Component
(parameters = {"dataItems=testData", "graphTitle=literal:XYBarChart","params=options"})
private JqPlotBar chart4;

 

public JSONObject getOptions() 
{
JSONObject ret = new JSONObject(); 
JSONObject options =new JSONObject();
options.put("stackSeries", new JSONLiteral("true"));
options.put("legend",new JSONLiteral("{show: true,location: 's'}"));
ret.put("options", options); 
return ret;

}

However, it is still not working. I am still not getting a stacked bar chart. And there is still no legend. How to I get the legend? And also a stacked bar chart?

Any help would be much appreciated Thanks.

 

 

 

[Emmanuel DEMEY]

Did you find a sample of "stacked bar chart" on the jQPlot website ? 

2013/7/24 newbie <codeh...@gmail.com>

--

You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Emmanuel DEMEY]

And legend property looks wrong. The format is somethink like that (http://www.jqplot.com/docs/files/jqPlotOptions-txt.html) : 

legend: {
        show: false,
        location: 'ne',     // compass direction, nw, n, ne, e, se, s, sw, w.
        xoffset: 12,        // pixel offset of the legend box from the x (or x2) axis.
        yoffset: 12,        // pixel offset of the legend box from the y (or y2) axis.
    },

2013/7/24 Emmanuel DEMEY <demey.e...@gmail.com>

[newbie]

Hi,

Thanks for the reply.

 

Other recipients:

Did you find a sample of "stacked bar chart" on the jQPlot website ? 

Yes, I did. Here is the link. http://www.jqplot.com/tests/bar-charts.php

 

 

My params option is appearing on the div element. I think that is not right. Am I writing the params option correctly?

[Emmanuel DEMEY]

Which graph do you want ? the first, second or third one ? I will do the Tapestry integration. 

2013/7/24 newbie <codeh...@gmail.com>

--

You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[newbie]

Hi,

I would like the third graph. Thanks.

[Emmanuel DEMEY]

The JSON should look something like that : 

public JSONObject getParams(){

    JSONObject json = new JSONObject();

    json.put("stackSeries", new JSONLiteral("true"));

   

    JSONObject legend = new JSONObject();

    legend.put("show", new JSONLiteral("true"));

    legend.put("location", "e");

    legend.put("placement", "outside");

   

   

    json.put("legend", legend);

   

   

    JSONObject options = new JSONObject();

    options.put("options", json);

    return options;

    }

2013/7/24 newbie <codeh...@gmail.com>

Hi,

I would like the third graph. Thanks.

--

You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[newbie]

Hi,

I tried with your suggestion but it is still not working. The params is appearing on the div element. You mention something about integrating it with Tapestry. Do I have to download a new jar file to make it work?

Here is my tml file.

<td><div t:id="chart4" /></td>

And here is the html output.

 

<div id="chart4" class="jqplot-target" params="{ "options" : { "legend" : { "placement" : "outside", "location" : "e", "show" : true }, "stackSeries" : true } }" style="position: relative; height: 300px;">

[Emmanuel DEMEY]

I do nto have this attribute for my div element :s 

can you make a Pull request on the Tapestry5-jqPlot on github, with a sample of your issue that I can reproduced ? 

Thx

Manu

2013/7/24 newbie <codeh...@gmail.com>

 

 

 

 

--

You received this message because you are subscribed to the Google Groups "tapestry5-jquery" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tapestry5-jque...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[newbie]

Hi,

There is now a stacked bar chart example at tapestry5-jqplot. Thanks to Emmanuel Demey for the example.