Hi I'm experiencing an issue with bar charts (it might affect other charts too). In short, a date formatted like this: "2017-11-29T00:00:00.000Z" is displayed as "Nov-28".
If I change the date to "2017-11-29T13:00:00.000Z" it correctly displays as "Nov-29".
HTML
=============================================================
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<script src="jchartfx/jquery/jquery-latest.js?v=1513269751805"></script>
<script src="jchartfx/jquery/jquery-ui.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.system.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.coreVector.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.coreVector3d.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.advanced.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.gauge.js?v=1513269751805"></script>
<script src="jchartfx/motifs/jchartfx.motif.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.data.js?v=1513269751805"></script>
<script src="jchartfx/js/jchartfx.userInterface.js?v=1513269751805"></script>
<script src="jchartfx.js"></script>
<link rel="stylesheet" type="text/css" href="jchartfx/jquery/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="jchartfx/styles/jchartfx.userInterface.css" />
<link rel="stylesheet" type="text/css" href="jchartfx/styles/Attributes/jchartfx.attributes.css" />
<link rel="stylesheet" type="text/css" href="jchartfx/styles/Palettes/jchartfx.palette.css" />
</head>
<body>
<div id="div1" style="width:600px;height:260px;left:0px;top:83px;position:absolute;"></div>
<script>
$(document).ready(function(){
createBarChart(chartParams, divID);
});
</script>
</body>
</html>
JS
=========================================================
var chartParams = {
"CHART_CD":"A3",
"DESCRIPTION":"ABC Graph",
"CHART_GROUP_CD":"CSH-FCST",
"TYPE":"BAR",
"XAXIS_LBL":"Forecasted Payments/Receipts",
"YAXIS_LBL":"",
"LEGEND_POS":"10",
"CSS_STYLE":"width:850px;height:210px;left:200px;top:45px",
"JAVA_CLASS":"",
"LABEL_CD":"Forecasted Payments/Receipts",
"CHART_DATA":[
{
"SCALE":1000,
"Pays":2335573,
"Recs":200001,
"VALUE_DT":"2017-11-29T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":5000,
"Recs":6005000,
"VALUE_DT":"2017-11-30T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":0,
"Recs":124411,
"VALUE_DT":"2017-12-01T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":9000000,
"Recs":0,
"VALUE_DT":"2017-12-05T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":0,
"Recs":5000000,
"VALUE_DT":"2017-12-06T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":0,
"Recs":1000000,
"VALUE_DT":"2017-12-21T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":0,
"Recs":457,
"VALUE_DT":"2017-12-28T00:00:00.000Z"
},
{
"SCALE":1000,
"Pays":0,
"Recs":47686,
"VALUE_DT":"2018-01-01T00:00:00.000Z"
}
],
"CHART_URL_DATA":[
]
};
var divID = "div1";
var chartListing = new Array();
function setTitle(chartObject, chartData, titleText, dockLoc) {
var title = new cfx.TitleDockable();
titleText = getVarValue(chartObject, chartData, "TITLETEXT", titleText, false);
title.setText(titleText);
title.setDock(dockLoc);
chartObject.getTitles().add(title);
for(var d=0; d<chartData.length;d++) {
var titleText = chartData[d].TITLETEXT;
if(typeof titleText !== "undefined")
delete chartData[d].TITLETEXT;
}
}
function setLegend(chartObject, legendPos) {
var legendVisibleFlag = true;
if(legendPos == 0) {
legendVisibleFlag = false;
}
chartObject.getLegendBox().setVisible(legendVisibleFlag);
chartObject.getLegendBox().setWidth(legendPos);
}
function getVarValue(chart, chartData, varName, defaultValue, showFlag) {
var newVarValue = defaultValue;
var activateShowHideFlag = false;
try {
newVarValue = chartData[0][varName];
activateShowHideFlag = true;
}
catch (error) {}
if (typeof newVarValue === 'undefined') {
newVarValue = defaultValue;
activateShowHideFlag = false;
}
try {
if(activateShowHideFlag) {
var seriesCount = chart.getSeries().getCount();
for(var a=0; a<seriesCount; a++) {
var seriesName = chart.getSeries().getItem(a).getText();
if(varName == seriesName)
chart.getSeries().getItem(a).setVisible(showFlag);
}
}
}
catch (error) {}
return newVarValue;
}
function createBarChart(chartParams, divID) {
var chartData = chartParams["CHART_DATA"];
var chartObject = new cfx.Chart();
chartObject.setDataSource(chartData);
chartObject.setGallery(cfx.Gallery.Bar);
chartObject.getAllSeries().getPointLabels().setVisible(false);
chartObject.getAxisX().getLabelsFormat().setFormat(cfx.AxisFormat.Date);
chartObject.getAxisX().getLabelsFormat().setCustomFormat("dd-MMM");
var stepValue = chartData[0]["STEPVALUE"];
if (typeof stepValue != 'undefined') {
stepValue = getVarValue(chartObject, chartData, "STEPVALUE", 1, false);
chartObject.getAxisX().setStep(stepValue);
}
chartObject.getAxisX().setLabelAngle(45);
var scaleValue = getVarValue(chartObject, chartData, "SCALE", 1, false);
chartObject.getAxisY().getLabelsFormat().setFormat(cfx.AxisFormat.Number);
chartObject.getAxisY().setScaleUnit(scaleValue);
var zoomValue = getVarValue(chartObject, chartData, "ZOOM", false, false);
chartObject.getAxisX().setAutoScroll(zoomValue);
chartObject.getAxisX().setClientScroll(zoomValue);
var chartId = chartParams["CHART_CD"];
if(chartId == "MDM-A21") {
var minValue = getVarValue(chartObject, chartData, "MINVALUE", 0, false);
var maxValue = getVarValue(chartObject, chartData, "MAXVALUE", 0, false);
var minStepValue = getVarValue(chartObject, chartData, "MINSTEPVALUE", 0.01, false);
chartObject.getAxisY().setMin(minValue);
chartObject.getAxisY().setMax(maxValue);
chartObject.getAxisY().getLabelsFormat().setDecimals(2);
chartObject.getAxisY().getDataFormat().setDecimals(4);
chartObject.getAxisY().getGrids().getMinor().setVisible(true);
chartObject.getAxisY().getGrids().getMinor().setStyle(cfx.DashStyle.Dot);
chartObject.getAxisY().setMinorStep(minStepValue);
}
setTitle(chartObject, chartParams["CHART_DATA"], chartParams["LABEL_CD"], cfx.DockArea.Top);
setTitle(chartObject, chartParams["CHART_DATA"], chartParams["YAXIS_LBL"], cfx.DockArea.Left);
setLegend(chartObject, chartParams["LEGEND_POS"]);
chartObject.create(divID);
chartListing[divID] = chartObject;
}
