[Drill down not working on Firefox]

Hi,

I have created line chart and added 'click' event as you specified in demo. Here is the code sample:

var chartDiv = document.getElementById('historyChartContainer');

chartDiv.addEventListener("click", gridDrillDown, false);

and callback function is:

function gridDrillDown(evt){

//alert(100);

var iSeries = evt.series;

//alert(event.hitType);

var iPoint = evt.point;

alert(evt.hitType);

alert(iPoint);

if (iSeries != undefined && iPoint != undefined) {

alert(iSeries +" - " +iPoint);

alert(assetForecastedGraph.getData().getItem(iSeries, iPoint));

alert(assetForecastedGraph.getAxisX().getLabels().getItem(iPoint));

//if(iPoint < 4){

//alert(iPoint);

//window.goToIPList("/projectedRunout",iPoint+"");

//}

}

}

Its working correctly in Google Chrome, but not working in FireFox. I am getting right series index, but NaN as point.

Please help me, if I am doing something wrong here.

Thanks!!

[Axis Section for X-Axis]

Hi,

I was trying to add axis section based on x-axis range. Here is my sample code:

var items = [{"Date":"Thu 11/15/2012 18:34","Value":5972.0},{"Date":"Thu 11/15/2012 17:38","Value":4196.0},{"Date":"Thu 11/15/2012 16:53","Value":4198.0},{"Date":"Thu 11/15/2012 15:37","Value":4233.0},{"Date":"Thu 11/15/2012 14:38","Value":4401.0},{"Date":"Thu 11/15/2012 13:42","Value":4487.0},{"Date":"Thu 11/15/2012 12:39","Value":4678.0},{"Date":"Thu 11/15/2012 11:41","Value":4939.0}];

. . .

var axisSections = chart1.getAxisX().getSections();

var section = new cfx.AxisSection();

section.setFrom("Mon 11/12/2012 00:36");

section.setTo("Sat 11/17/2012 14:30");

section.getGrids().getMajor().setVisible(true);

axisSections.add(section);

It was not working for AxisX. Although if i use AxisY range, it works fine. Can you please help me how to achieve the same for AxisX.

Thanks in Advance!!

[X-Axis String value is not getting displyed]

It has been fixed. I removed fields mapping, and it works fine.

I commented following lines:

var fields = assetForecastedGraph.getDataSourceSettings().getFields(); //alert(44); var field1 = new cfx.FieldMap(); field1.setName("Value"); field1.setUsage(cfx.FieldUsage.Value); fields.add(field1); //alert(55); var field2 = new cfx.FieldMap(); field2.setName("Date"); field2.setUsage(cfx.FieldUsage.XValue); fields.add(field2);

Thanks!!

[X-Axis String value is not getting displyed]

Here is my code to draw line series. I was trying to create line chart with following data. Can you please help me what I am doing wrong here.

var items = [{"Date":"Thu 11/15/2012 18:34","Value":5972.0},{"Date":"Thu 11/15/2012 17:38","Value":4196.0},{"Date":"Thu 11/15/2012 16:53","Value":4198.0},{"Date":"Thu 11/15/2012 15:37","Value":4233.0},{"Date":"Thu 11/15/2012 14:38","Value":4401.0},{"Date":"Thu 11/15/2012 13:42","Value":4487.0}];

var assetForecastedGraph = new cfx.Chart();

assetForecastedGraph.getAllSeries().setMarkerShape(cfx.MarkerShape.None);

assetForecastedGraph.getLegendBox().setVisible(true);

assetForecastedGraph.getLegendBox().setBorder(cfx.DockBorder.Internal);

assetForecastedGraph.getLegendBox().setContentLayout(cfx.ContentLayout.Spread);

assetForecastedGraph.getLegendBox().setDock(cfx.DockArea.Bottom);

var axisY = assetForecastedGraph.getAxisY();

axisY.getGrids().getMinor().setVisible(true);

assetForecastedGraph.getAxisX().setLabelAngle(45);

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

//alert(44);

var field1 = new cfx.FieldMap();

field1.setName("Value");

field1.setUsage(cfx.FieldUsage.Value);

fields.add(field1);

//alert(55);

var field2 = new cfx.FieldMap();

field2.setName("Date");

field2.setUsage(cfx.FieldUsage.XValue);

fields.add(field2);

// assetForecastedGraph.setGallery(cfx.Gallery.Bar);

// assetForecastedGraph.getAxisX().getLabelsFormat().setFormat(cfx.AxisFormat.DateTime);

assetForecastedGraph.getAxisX().getLabelsFormat().setCustomFormat("EEE MM/dd/yyyy HH:mm");

// alert(dataArray);

//alert(1);

assetForecastedGraph.setDataSource(items);

// alert(2);

var chartDiv = document.getElementById('historyChartContainer');

//alert(chartDiv);

assetForecastedGraph.create(chartDiv);

It

[Custom Date Format for Axis]

Hi,

Can I use custom date format for X Axis? I had experience in chartFx Java to say it.

e.g. getAxisX().getLabelsFormat().setCustomFormat("EEE MM/dd/yyyy HH:mm");

This is specific requirement for our app to show the date format.

Thanks!!

[How jChartFx licensing works]

Hi,

We have faced issues in chartFx Java 7. Each time it validates the license and to do it, it communicates with external server. Somehow it degrades our app performance.

As jChartFx is JS library, can you please share some more info about how it works.

Thanks,

Yogesh

[Select and Zoom]

We have used ChartFx java and chartFx .Net. Now exploring jChartFx. There is a feature in chartFx .Net to select the area in chart and say ZOOM. Is it possible with jChartFx, or do you have plan for it?

Thanks

[Pie is not taking all space if total point value is not 100]

Actually I am passing value from GWT code. In GWT code values are Long value. I am not sure what was the cause, but when any of the value is 0, other three are rendered and there was blank for 0 point.

When I used parseInt() in my javaScript function, it works fine now.

[Pie is not taking all space if total point value is not 100]

Issue is resolved, I was passing decimal value. Converted it into int (by parseInt()). Its working fine now.

WindowsApplication1.zip

[Pie is not taking all space if total point value is not 100]

I am using Pie chart and setting values for it. I am adding point value as 2, 3, 12, and 5. Pie is rendered but it is assuming total count = 100, and not showing proper round pie. Is there any property available to set total count = 22 instead of 100.

Here is the code:

projectedRunoutPieChart = new cfx.Chart();
var td;
td = new cfx.TitleDockable();
td.setText("Projected Runout");
td.setDock(cfx.DockArea.Bottom);
projectedRunoutPieChart.getTitles().add(td);
projectedRunoutPieChart.getLegendBox().setVisible(false);
projectedRunoutPieChart.setGallery(cfx.Gallery.Pie);
projectedRunoutPieChart.getAllSeries().getPointLabels().setVisible(true);
projectedRunoutPieChart.getView3D().setEnabled(true);
projectedRunoutPieChart.getAllSeries().getPointLabels().setFormat("%T Site(s)");
var myPie;
myPie = (projectedRunoutPieChart.getGalleryAttributes());
myPie.setExplodingMode(cfx.ExplodingMode.All);
myPie.setSliceSeparation(20);
myPie.setMaximumLabelMargin(1);
var data = projectedRunoutPieChart.getData();
data.setSeries(1);
data.setPoints(4);
var series = projectedRunoutPieChart.getSeries().getItem(0);
series.setGallery(cfx.Gallery.Pie);
series.setVolume(100);
projectedRunoutPieChart.getPoints().getItem(0, 0).setColor("#2EFE2E");
projectedRunoutPieChart.getData().setItem(0, 0, 2);
projectedRunoutPieChart.getPoints().getItem(0, 1).setColor("#F00D0D");
projectedRunoutPieChart.getData().setItem(0, 1, 3);
projectedRunoutPieChart.getPoints().getItem(0, 2).setColor("#F6FE0C");
projectedRunoutPieChart.getData().setItem(0, 2, 12);
projectedRunoutPieChart.getPoints().getItem(0, 3).setColor("#DFDFD9");
projectedRunoutPieChart.getData().setItem(0, 3, 5);
var divHolder = document.getElementById('projectedRunoutPiePanel');
if (divHolder) {
    projectedRunoutPieChart.create(divHolder);
} 

Thanks