Hi,
I want to plot a Line Chart: Y-Axis has numeric values and X-Axis has Date Values.
As of Primefaces 3.2 it is possible to plot Date type as X-Axis data. However when we try to do zoom, While Y-Axis numeric values are
being zoomed(scaled), X-Axis Date values are not Scaled.
E.g. Like the one below:
http://www.jfree.org/jfreechart/images/ ... rDemo2.png
[img]D:\Users\ryildiz\Desktop\canvas.png[/img]
Any comment will be appreciated,
thanks in advance.
Line Chart Zoom is not feasible when X-Axis is of date type
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
I think Primefaces and JQplot integrations javascript stack, handles/scales only the numeric values when doing zoom. And a Date Value scaling script code is lacking in the stack.
I hope i am wrong with this
I hope i am wrong with this
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
3.4 supports dates on axis via converter.
Hi Cagatay Abi,
Would you please give a code snippet regarding "dates on axis via converter".
That will be very appreciated. Or a demo code on the showcase regarding this issue
would be surely perfect and reflects the power of Primefaces.
Thanks in advances.
Would you please give a code snippet regarding "dates on axis via converter".
That will be very appreciated. Or a demo code on the showcase regarding this issue
would be surely perfect and reflects the power of Primefaces.
Thanks in advances.
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
i mean with zoom enabled(scaling dates when zoomed).
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Don't know how its working in the current build 3.4.Please check this http://code.google.com/p/primefaces/iss ... il?id=2180
Author,Speaker
https://twitter.com/sudheerjonna
Github: https://github.com/sudheerj
Website http://sudheerjonna.com/
___________________
Sudheer Jonna
https://twitter.com/sudheerjonna
Github: https://github.com/sudheerj
Website http://sudheerjonna.com/
___________________
Sudheer Jonna
Thanks Sudheer,
Your link is useful, in Primefaces3.4 Date value on axis is achieved,
However scaling over Date values was not clear to me.
Like it's seen in this Demo of Jqplot, Date axis is being scaled from initially 2 months interval, up to 1 day interval precision:
http://www.jqplot.com/tests/zooming.php
I couldn't achieve this with Primefaces integration. I need to implement a demo like this one, but scaling up to 1 minute precision, beginning from 1 month lets say! This demo gives me a hope to achieve scale on Date axis. I think that Cagatay Abi(Optimus prime) is putting the finger on this with his comment.
But still i don't feel that i can achieve it. I'm gonna share it with you on this thread. Up to that, if somebody can provide a code snippet, i''ll be glad
thanks in advance.
Your link is useful, in Primefaces3.4 Date value on axis is achieved,
However scaling over Date values was not clear to me.
Like it's seen in this Demo of Jqplot, Date axis is being scaled from initially 2 months interval, up to 1 day interval precision:
http://www.jqplot.com/tests/zooming.php
I couldn't achieve this with Primefaces integration. I need to implement a demo like this one, but scaling up to 1 minute precision, beginning from 1 month lets say! This demo gives me a hope to achieve scale on Date axis. I think that Cagatay Abi(Optimus prime) is putting the finger on this with his comment.
But still i don't feel that i can achieve it. I'm gonna share it with you on this thread. Up to that, if somebody can provide a code snippet, i''ll be glad
thanks in advance.
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
By the way, as far as i understand, JQplot achives Date axis scale with jqplot.dateAxisRenderer.min.js. I don't know if it's integrated into Primefaces.
Ramazan YILDIZ
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
Senior Software Developer Engineer
Netas RnD
ramazangsu[at]gmail.com
-
- Posts: 5
- Joined: 21 Sep 2012, 16:56
I actually made X-Axis of date type work with zoom, I just needed to add the jqplot.dateAxisRenderer.min.js in my sources and make some "fixes" to make my code work as expected
JSF code:
Bean:
I hope this helps to everyone who needs it
Note: you can get the dateAxisRenderer plugin here http://svnplot.googlecode.com/svn-histo ... rer.min.js
JSF code:
Code: Select all
<p:lineChart id="linear" value="#{cashBean.linearModel}" legendPosition="ne" animate="true" widgetVar="chart" zoom="true"
title="#{cashBean.linearModelTitle}" style="height:280px; width:480px" extender="ext2"/>
<script type="text/javascript" src="../src/plugins/jqplot.dateAxisRenderer.min.js"></script>
<script>
function ext2() {
//this = chart widget instance
//this.cfg = options
this.cfg.axes = {
xaxis:{
renderer:$.jqplot.DateAxisRenderer,
rendererOptions:{
tickRenderer:$.jqplot.CanvasAxisTickRenderer
},
tickOptions:{
fontSize:'10pt',
fontFamily:'Tahoma',
angle:-40
}
},
yaxis:{
rendererOptions:{
tickRenderer:$.jqplot.CanvasAxisTickRenderer},
tickOptions:{
fontSize:'10pt',
fontFamily:'Tahoma',
angle:30
}
}
};
}
</script>
Code: Select all
public void showAccountEvolution() {
Evolution evolution = cashBean.getAccountEvolution(selectedTimeLineCurrency, selectedTimeLineCia, selectedTimeLineBic, selectedTimeLineAccount);
linearModel = new CartesianChartModel();
LineChartSeries series1 = new LineChartSeries();
series1.setLabel(evolution.getTag());
Map<Object, Number> data = getShowedEvolutionData(evolution.getEvolution());
TreeSet<Date> tree = new TreeSet<Date>();
for (Object lineChartSeries : data.keySet()) {
Date key = (Date)lineChartSeries;
tree.add(key);
}
Iterator<Date> it = tree.iterator();
while (it.hasNext()) {
Date key = it.next();
Number value = data.get(key);
series1.set(key.getTime(), value);
}
linearModel.addSeries(series1);
}
Note: you can get the dateAxisRenderer plugin here http://svnplot.googlecode.com/svn-histo ... rer.min.js
@pescamillam,
Thank you very much for posting the sample code. I had a question on what you had posted.
Could you please confirm that when you build the series object in the bean, the key to the values you add is key.getTime() and not key (i.e. a long and not a Date) ?
Can jqplot work with epoch time and format it as a date ?
I tried following what you had suggested, but I am seeing nothing on my x-axis !!!! I have used different options though (numberTicks & tickOptions:{formatString:'%H:%M'}).
Thank you very much for posting the sample code. I had a question on what you had posted.
Could you please confirm that when you build the series object in the bean, the key to the values you add is key.getTime() and not key (i.e. a long and not a Date) ?
Can jqplot work with epoch time and format it as a date ?
I tried following what you had suggested, but I am seeing nothing on my x-axis !!!! I have used different options though (numberTicks & tickOptions:{formatString:'%H:%M'}).
-
- Information
-
Who is online
Users browsing this forum: No registered users and 9 guests