Uncaught Error: Date/time format not recognized. Pick between 'YYYY-MM-DD' or 'YYYY-MM-DD HH:MM:SS'

[ijunaid8989]

Hello everyone!
this is my data

and on the if condition where am getting the error, I tried to debug that my data is giving correct result but still going in the else part where the above error is mentioned as

        console.log(d);
        console.log(d.data);
        console.log(d.data[0]);
        console.log((!(d.data[0] instanceof Date)));
        console.log(parseDateTimeRegEx.test(d.data[0]));
        console.log(parseDateTime.parse(d.data[0]));

In above picture thats is the data which am logging!

even this condition is passed console.log(parseDateTimeRegEx.test(d.data[0]));

The control still going to the else part of if?

Can you please help with this?

[flrs]

Hi @ijunaid8088!

The reason that you are getting this error is because your data variable is not stated correctly. Your code should be like this:

    var dataset = [
        {
            "measure":"Herbst Wicklow Cam",
            "data":[
                ["2016-12-30 00:00:00",1,"2017-01-06 00:00:00"]
            ]
        }
    ];

I assume you forgot the extra square brackets [] around "2016-12-30 00:00:00",1,"2017-01-06 00:00:00".

Please let me know if this fixed it.

[ijunaid8989]

Yeah you were right thanks :) my bad

few other questions: as you can see in image

the measure names are long so they are hidden under the bars, can we give them more space?

[flrs]

Glad that worked out for you!
If you need more space, change the parameters left (see https://github.com/flrs/visavail/blob/master/visavail/js/visavail.js#L13) and paddingLeft (see https://github.com/flrs/visavail/blob/master/visavail/js/visavail.js#L29) accordingly.

[ijunaid8989]

Hi thanks a ton, we are using your great work in our project and added a new future with this.

Just a few more questions of interest!

We have built the report but we want to send it in an email, do you have any ideas about it? I can implement CSS in email but what about JS, is that possible to do that?

What I am thinking here is to create a rake task which will run once in a day and then It will first create data for Visavail and so on i can create an html view with this, But can we send it in email as well?

[flrs]

Hi, I am happy to hear that you are putting Visavail.js to good use in your project!

Sending the report in an email indeed poses a challenge due to limitations in the execution of JS. However, I can think of three possible ways to achieve your goal:

1. Instead of sending the report directly, send a link to the report via email. Then, the user accesses the report on your server through the browser and you are effectively bypassing all email limitations.

2. Save the report as an image that you embed into the HTML body of the email. Via CSS you could then overlay tooltips similar to the ones used in the library.

3. Send a JS-free hybrid of CSS and SVG via email. SVG in email seems to be a little troublesome, but you can get a grasp of what is involved on this website.

More information regarding option 2:

• For transforming the svg into an image file, there seem to be a variety of options available. One way is described on this website. You would have to implement the functionality into your rake task.
• For tooltips via CSS, see here.
• You might get guidance in understanding the Visavail.js code from studying this example. It is very similar to what I used in the code.
• As to the tooltip format, the tooltips are composed here in the code, the text is constructed in the output variable. Formatting of the tooltip is controlled by this piece in the code.

Let us know which solution you settled for. Maybe there is some insight we can implement here to improve the library!

[ijunaid8989]

Hi.. Thanks a ton. for your answers they are helping us a lot..

What I think is the better idea is to save SVG to png and then send an email. But not sure yet that what I am going to apply, Your suggestions are very very good and considerable for us.

Anyhow, as we put a name in measure field while creating data for chart, It should support some HTML as well, as we are using it to show cameras status report, I tried to add a span tag with measure value but it came as string in browser, or am doing it wrong?

Do you think it would be better have animation in bars, Like they may create with a slow motion, (Just saying, that how good they will look with animation.)

[ijunaid8989]

For follow up:

I edited it as

      svg.select('#g_axis').selectAll('text')
          .data(dataset.slice(startSet, endSet))
          .enter()
          .append('text')
          .attr('x', paddingLeft)
          .attr('y', lineSpacing + dataHeight / 2)
          .html(function (d) {
            return d.measure;
          })

the last append was only text for the moment I changed it to html. I hope that would not harm any other thing.

[flrs]

@ijunaid8088, since the link issue is different from the original issue I have opened issue #10 to solve this.

[flrs]

As to the animation, it would be a possibility. Personally, I would focus the display rather on displaying the data in a clear way than adding distracting animations. Technically, I believe animations are possible. Do you want to look into that?