Search the Community
Showing results for tags 'javascript'.
Found 1 result
-
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; }
