perryworld

September 21, 2015

Hi,

We have created a module in Joomla to display different charts depending on the parameters we provide to each module.

For example we have one chart displaying Groups and another showing Locations.

If we have these on separate pages they seem to work fine, but if we display them both on the same page only one displays.

We assume this is because the two charts are using the same code to create the charts.

Is it possible to create a generic chartobject so for each module it will create it's own version and avoid conflicts?

Our site is at http://demonew.online-communities.org/and you can login using test/test .

You will see the problem under reports>admin tools>testing

We have attached the jquery script below.

Hope that makes sense

Thanks

Richard

jchartfxissue.txt

September 6, 2015

Hi,

We have created a pie chart and everything works fine but we now want to add a click event to each segment so we can open a page with further information.

We added the following code within the document.ready

jQuery("#ChartDivGroups").click(function(evt) {

alert ("SET");

onChartClick(evt);

});

And the following function

function onChartClick(evt)

{

alert (evt.hitType);

if (evt.hitType == cfx.HitType.Point) {

var s = "Series " + evt.series + " Point " + evt.point;

alert(s);

}

When we click on the pie we get the alert "SET" followed by the alert within the function but here we get "undefined"

We have attached the full php file

Are we missing something?

Thanks

Rich

DBGroups.php

September 5, 2015

There is bug that prevents us from showing a legend where all items cannot be painted completely horizontally (when it is at the bottom/top), we will try to fix this in future builds. In the meantime you could try to

1) reduce the font used in the legend box

chart1.getLegendBox().setFont("6pt Arial");

2) Allow the legend box to use full width instead of the plot area width (note texts are aligned with doughnut)

chart1.getLegendBox().setPlotAreaOnly(false);

Regards,

JuanC

Thanks JuanC

Will try this

Cheers

Rich

September 3, 2015

Hi,

We are new to jchartfx and have a question.

We have created a pie chart with the legend at the bottom and we need to re-size it to fit on the sidebar of our site but when we set the width of the div to anything less than 400px the legend disappears.

Is there any way we can set the width to 300px with out losing the legend.

Please see attached.

Thanks

Rich

August 27, 2015

The problem is that the chart does not assume strings can be plotted as numbers, and your posts field is being returned as a string

1) Solution 1

Change the page/process that generates the JSON so that it looks like this (note that the numbers should have no quotes)

[{ "username" : "Jill", "posts" : 106, "friends" : "", "status" : "", "polls" : ""},{ "username" : "Carly", "posts" : 93, "friends" : "", "status" : "", "polls" : ""},{ "username" : "Chris", "posts" : 11, "friends" : "", "status" : "", "polls" : ""}]

2) Solution 2

Manually tell us which fields should be used as values to be plotted

var fields = chart1.getDataSourceSettings().getFields();

var field1 = new cfx.FieldMap();

field1.setName("username");

field1.setUsage(cfx.FieldUsage.Label);

fields.add(field1);

var field2 = new cfx.FieldMap();

field2.setName("posts");

field2.setUsage(cfx.FieldUsage.Value);

fields.add(field2);

Regards,

JuanC

Hi JuanC

That fixed the problem,

Many thanks for your help.

Cheers

Richard

August 26, 2015

Hi

We are trying to create a stacked bar chart but we keep getting No Data Available.

We did have the example working but when we retrieved data from our database the chart doesn't display.

Here is the code

<head>

</head>

<body>

<tr>

</tr>

</table>

jQuery.noConflict();

jQuery(document).ready(function() {

CreateUserPoints();

});

jQuery("#refresh1").click(function() {

CreateUserPoints();

});

function CreateUserPoints()

{

chartuserpoints = new cfx.Chart();

chartuserpoints.setGallery(cfx.Gallery.Bar);

chartuserpoints.getAllSeries().setStackedStyle(cfx.Stacked.Normal);

var titles = chartuserpoints.getTitles();

var title = new cfx.TitleDockable();

title.setText("User Points");

titles.add(title);

chartuserpoints.getAxisY().getLabelsFormat().setFormat(cfx.AxisFormat.Currency);

var startdate = jQuery('#startdate').val();

var enddate = jQuery('#enddate').val();

jQuery.ajax({

type: "POST",

dataType: "json",

data:{startdate : startdate, enddate : enddate},

url: "/reports/StackedBarData.php",

success: function(data) {

chartuserpoints.setDataSource(data);

var divHolder = document.getElementById('ChartDivUserPoints');

jQuery("#ChartDivUserPoints").html("");

chartuserpoints.create(divHolder);

} ,

error: function (xhr, ajaxOptions, thrownError) {

alert(xhr.status);

alert(thrownError);

}

});

}

</script>

The data from the database is as follows:

[{ "username" : "Jill", "posts" : "106", "friends" : "", "status" : "", "polls" : ""},{ "username" : "Carly", "posts" : "93", "friends" : "", "status" : "", "polls" : ""},{ "username" : "Chris", "posts" : "11", "friends" : "", "status" : "", "polls" : ""}]

Any help would really be appreciated

Thanks

Rich

February 13, 2014

Hi JuanC

Thanks for the reply, that works great now.

Cheers

Rich

February 11, 2014

Hi,

We are new to using jChartFX so any help would really be appreciated.

We have followed the example for the Bar Chart and have that working fine but when we have tried the Pie Chart we get the correct legends but the Pie chart only plots one item. We have retrieved the data from our database and compared that to how the data looks in the example and it looks to be in the correct format.

This is our code :

jQuery.noConflict();

jQuery(document).ready(function() {

jQuery.ajax({

type: "POST",

dataType: "json",

url: "/Aircraft/DashboardDataPie.php",

success: function(chartdata)

{

chart1 = new cfx.Chart();

chart1.setDataSource(chartdata);

chart1.setGallery(cfx.Gallery.Pie);

//PopulateBrowserUsage(chart1);

var fields = chart1.getDataSourceSettings().getFields();

var field1 = new cfx.FieldMap();

field1.setName("username");

field1.setUsage(cfx.FieldUsage.RowHeading);

fields.add(field1);

var field2 = new cfx.FieldMap();

field2.setName("userid");

field2.setUsage(cfx.FieldUsage.ColumnHeading);

fields.add(field2);

var fieldVal = new cfx.FieldMap();

fieldVal.setName("sightings");

fieldVal.setUsage(cfx.FieldUsage.Value);

fields.add(fieldVal);

var crosstab = new cfx.data.CrosstabDataProvider();

crosstab.setDataSource(chart1.getDataSource());

chart1.setDataSource(crosstab);

var data = chart1.getData();

data.setSeries(1);

var title = new cfx.TitleDockable();

title.visible = true;

title.setText("My chart Title");

chart1.getTitles().add(title);

var divHolder = document.getElementById('ChartDiv');

chart1.create(divHolder);

}

});

And this is the data being returned from our database.

[{ "username" : "Tony15", "userid" : "Tony15", "sightings" : 1506},{ "username" : "richard", "userid" : "richard", "sightings" : 551},{ "username" : "carly", "userid" : "carly", "sightings" : 235},{ "username" : "John", "userid" : "John", "sightings" : 138},{ "username" : "flyhellas", "userid" : "flyhellas", "sightings" : 94},{ "username" : "efc123", "userid" : "efc123", "sightings" : 85}]

Any help would be great, Thanks

Rich

Sign In

perryworld

Posts

Joined

Last visited

Content Type

Profiles

Forums

Events

Posts posted by perryworld

Two Charts On One Page

Adding onClick to Pie Chart

Pie Chart Resizing

Pie Chart Resizing

Stacked Bar Chart

Stacked Bar Chart

Newbie question about Pie Chart

Newbie question about Pie Chart

Browse

Activity