Highcharts date parsing issue - javascript

I'm using highcharts for graphical showcase of statistics.
As I understand it,highcharts uses UTC time to parse datetime.In my case,datetime and value both coming from jagged array.When I use only value its fine,when the datetime value enters the case,highcharts does not parse datetime.
I prepared an example here
Datetime in here coming from a string so i must format (dd.MM.yyyy hh:mm:ss)
For this I use moment.js to parse my datetime value.But still no results.
Why highcharts does not render dates properly ?
What is the problem here ?
Thanks

Original code excerpt
var date = moment(graphData.items[i].Date, "dd.MM.yyyy hh:mm:ss");
xdata.push([date._d, graphData.items[i].Value]);
There's a format issue. Instead of "dd.MM.yyyy hh:mm:ss" you should rather use "DD.MM.YYYY hh:mm:ss", as stated in the documentation.
I would also replace the call to the private member _d with a .native() invokation.
Last, but not least, HighCharts excepts to be fed with the number of milliseconds since Epoch. This can be achieved with a call to getTime().
Fixed code
var date = moment(graphData.items[i].Date, "DD.MM.YYYY hh:mm:ss").native();
xdata.push([date.getTime(), graphData.items[i].Value]);
A working patched version of your code is available here.

Related

javascript "date.getFullYear()" is returning 3991 [duplicate]

I have tried to get date and time from firebase timestamp as follows:
Date date=new Date(timestamp*1000);
SimpleDateFormat sfd = new SimpleDateFormat("dd-MM-yyyy HH:mm:ss");
sfd.format(date);
but I'm getting results like:
:02-02-48450 04:21:54
:06-02-48450 10:09:45
:07-02-48450 00:48:35
as you can see the year is not as we live.
So, please help me to fix this.
Your timestamp 1466769937914 equals to 2016-06-24 12:05:37 UTC. The problem is that you are multiplying the timestamp by 1000. But your timestamp already holds a value in milliseconds not in seconds (this false assumption is most likely the reason you have the multiplication). In result you get 1466769937914000 which converted equals to 48450-02-01 21:51:54 UTC. So technically speaking all works fine and results you are getting are correct. All you need to fix is your input data and the solution is quite simple - just remove the multiplication:
SimpleDateFormat sfd = new SimpleDateFormat("dd-MM-yyyy HH:mm:ss");
sfd.format(new Date(timestamp));
If you are looking to get a Date instance from Timestamp
If you need to get just the Date object from Timestamp, the Timestamp instance comes with a toDate() method that returns a Date instance.
For clarity:
Date javaDate = firebaseTimestampObject.toDate()
According to Firebase documentation, the types that are available JSON are:
String
Long
Double
Boolean
Map<String, Object>
List<Object>
Quoting another Stack Overflow post, I suggest you use JSON date string format yyyy-MM-dd'T'HH:mm:ss.SSSZ instead of epoch timestamp.
Comparing 1335205543511 to 2012-04-23T18:25:43.511Z, you can noticed that:
It's human readable but also succinct
It sorts correctly
It includes fractional seconds, which can help re-establish chronology
It conforms to ISO 8601
ISO 8601 has been well-established internationally for more than a decade and is endorsed by W3C, RFC3339, and XKCD
The .toDate() method should be all you need
You might like the docs here
As an added bonus, you might want very highly human readable output
Date only options
.toDate().toDateString()
.toDate().toLocaleDateString()
Time only options
.toDate().toTimeString()
.toDate().toLocaleTimeString()
Objects
However, if you are receiving an object you might do something like this
{JSON.stringify(createdAt.toDate()).replace(/['"]+/g, '')}
Converting the object into a string then replacing the quotes around the string.
firebase time is basically combination of seconds and nano seconds
time={
seconds:1612974698,
nanoseconds:786000000
}
total_miliseconds=(time.seconds+(time.nanoseconds)*0.00000001)*1000. // 1 nanosecond=1e-9 means 0.00000001
new Date(total_miliseconds)
String time=dataSnapshot.child("timeStamp").getValue().toString();
Long t=Long.parseLong(time);
Date myDate = new Date(t*1000);
Result
Fri May 11 05:37:58 GMT+06:30
For date, you can use this code :
Calendar calendar = Calendar.getInstance();
calendar.setTimeInMillis(time);
String date = DateFormat.format("dd-MM-yyyy", calendar).toString();
For time :
Calendar calendar = Calendar.getInstance();
calendar.setTimeInMillis(time);
String date = DateFormat.format("hh:mm", calendar).toString();
I think its bit late but easiest way is just:
(new Date(timestamp.toDate())).toDateString()
Within the Date() where you put your timestamp add
.toDate()
to the timestamp variable as #jasonleonhard said. Maybe just an example
new Date(timestamp.toDate())

Why date is mismatch in JavaScript while conversion?

Why date is mismatch in javascript .I am getting this millisecond “-2208988800000” .I converted this using moment like this
moment(new Date(-2208988800000).toUTCString()).format('DD-MMM-YYYY')
Which give output “01-Jan-1900"” (which is correct)
Now I try to get again same long value or millisecond
moment(new Date("01-Jan-1900")).format('x')
"-2209008070000"
Why is mismatch in value ? "-2209008070000" and "-2208988800000" is not same
new Date("01-Jan-1900") is not something that works in every browser. Firefox for example outputs Invalid Date. The Date constructor has lots of quirks, and it's exactly why you should use a library like Moment.js to parse date and time strings.
Refer to the MDN documentation on Date and new Date(dateString) for additional details.
I think you are losing hours while converting to DD-MMM-YYYY
console.log(moment(new Date(-2208988800000).toUTCString()).format('DD-MMM-YYYY HH:mm:ss'))
//output of above line is input to below.
console.log(moment.parseZone(new Date("31-Dec-1899 19:00:00")).format('x'))
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://momentjs.com/downloads/moment.js"></script>

How to parse jqwidgets (jqx) date with format?

Basically I have date format which comes from server and which will be not known before and a date that was already formatted in this format, e.g. the format is "dd/MM/yyyy" and the date is "21/01/2018" (two strings). The format that uses jqx differs from the default JS one, as I can see.
What I need to do is to parse it to JavaScript date object. I couldn't find the answer in the official documentation.
Is there any easy was of parsing the date string if you know the date format, using JS, jqwidgets or momentjs?
Eventually, I've finished with inner jqx method that does that exact thing:
var parsedDate = $.jqx.dataFormat.parsedate(src, format);
Where format in this case is "dd/MM/yyyy" and src is "21/01/2018".
P.S. Thanks for the guy that posted anwer with the code that used $.jqx.dataFormat, that really helped me to find parsedate method.

Weird ISO formatted Datestring to Javascript Date

I've got a Datestring like this one: 20171010T022902.000Z and I need to create Javascript Date from this string. new Date('20171010T022902.000Z') would return Invalid Date.
I saw that it's possible to use moment.js for this purpose but I am not sure how I would specify the according format for my given example. I found this example from another thread:
var momentDate = moment('1890-09-30T23:59:59+01:16:20', 'YYYY-MM-DDTHH:mm:ss+-HH:mm:ss');
var jsDate = momentDate.toDate();
Question:
How can I create a JavaScript date from a given Datestring in this format: 20171010T022902.000Z (using moment)?
Your input (20171010T022902.000Z) matches known ISO 8601 so you can simply use moment(String) parsing method. In the Supported ISO 8601 strings section of the docs you will find:
20130208T080910.123 # Short date and time up to ms
Then you can use toDate() method
To get a copy of the native Date object that Moment.js wraps
Your code could be like the following
var m = moment('20171010T022902.000Z');
console.log( m.format() );
console.log( m.toDate() );
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
Note that this code does not shows Deprecation Warning (cited in Bergi's comment) because you input is in ISO 8601 known format. See this guide to know more about this warning.
Moreover "By default, moment parses and displays in local time" as stated here so format() will show the local value for your UTC input (20171010T022902.000Z ends with Z). See moment.utc(), utc() and Local vs UTC vs Offset guide to learn more about moment UTC mode.
I think you can do this without moment.js,.
Basically extract the parts you need using regex's capture groups, and then re-arrange into a correct format for new Date to work with.
var dtstr = '20171010T022902.000Z';
var dt = new Date(
dtstr.replace(/^(\d{4})(\d{2})(\d{2})T(\d{2})(\d{2})(\d{2})(\.\d{3}Z)$/,
"$1-$2-$3T$4:$5:$6$7"));
console.log(dt);
console.log(dt.toString());
If you are using moment.js anyway, this should work ->
var dt = moment("20171010T022902.000Z", "YYYYMMDDTHHmmss.SSSSZ");
console.log(dt.toString());
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>

Compare ISO date without time stamp in javascript

I am querying data using OData, url looks like http://myurl.com/api/Customer?$filter=ResDate eq DateTime'2014-03-15T12:01:55.123'.
I'm getting date/time from jquery.datepicker instead of the static date and using moment.js to convert from DD-MM-YYYY to YYYY-MM-DDTHH:mm:ss in order to pass it to web service.
function convertDateToISOdate(date){
var newDate = moment(date,'DD-MM-YYYY').format('YYYY-MM-DDTHH:mm:ss');
return newDate;
}
Date returns from the function, is 2014-03-15T00:00:00.
Problem : 2014-03-15T12:01:55.123 is not equal to 2014-03-15T00:00:00, so there's no record selected.
What I want is , just to compare the date , not include time stamp.
Note : I can not change the format date/time at server side(Web service) because it's not belongs to me.
Any idea is much appreciated.
Your first call to moment(date,'DD-M-YYYY') is stripping the time information from the incoming data. try using moment(date) (no format) instead because momentjs recognizes your incoming date format intrinsically, without having to be told which format to use, and will correctly parse the H:M:S data, too.
MomentJS date parse information

Categories