The amCharts dateFormatter is having trouble interpreting Unix time, also known as Epoch timestamps, accurately

When trying to use Unix time (1608713282) for my amChart source and display it as 12/23/20 04:30:00, I encountered an issue where it was showing up as 01/19/70 00:00:00 in the tooltip.

I attempted to format it correctly on the chart and dateAxis using the following lines of code...

chart.dateFormatter.inputDateFormat = 'x';
chart.dataSource.parser.options.dateFormat = 'x';
chart.dateFormatter.utc = true;

dateAxis.dateFormatter.inputDateFormat = 'x';
dateAxis.dataSource.parser.options.dateFormat = 'x';
dateAxis.dateFormatter.utc = true;

The section related to my dateAxis is as follows:

// TimeStamp Axes
var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.renderer.grid.template.location = 0;
dateAxis.renderer.minGridDistance = 100;
dateAxis.tooltipDateFormat = 'MM/dd/yy H:mm:ss';

During debugging, I noticed that enclosing the timestamp value in quotes within my JSON source resulted in a different but still incorrect date being displayed - 11/16/13 23:59:58.

An example of my data structure is shown below:

{
    "tstamp": 1608697800,
    "vol": 144,
    "staff": 61,
    "avail": 0
}

Answer №1

The 'x' format is specifically designed to interpret Unix timestamps in milliseconds, as mentioned in the documentation. Your input values are in seconds, so they will not be parsed correctly.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Present the selected values in the correct manner

My app uses a select tag to add values in a table. This select allows me to choose one value and add it to the table. Here is some of the code for the select input: const searchPlayer = selectedItems => { selectedItems = selectedItems.map(name =& ...

How can a JavaScript map be created with string keys and values consisting of arrays containing pairs of longs?

Struggling with JavaScript data structures, I am trying to create a map in which the key is a string and the value is an array of two longs. For instance: var y = myMap["AnotherString"]; var firstNum = y[0][0]; var secondNum = y[0][1]; // perform opera ...

What is preventing array.map() from being a function?

I am facing an issue when trying to map an array from the useState hook in react. The error message that I am getting is: TypeError: documents.map is not a function Here is the code snippet that I am working with: const [docs, setDocs] = useState(docume ...

Adjusting Timeout for Specific HTTP Endpoint in NestJS

I recently delved into learning NestJS and I'm curious about how to adjust the response timeout for specific endpoints. One way is to set it on a server level like this: const server = await app.listen(...); server.setTimeout(1800000) Alternativ ...

Create an onClick function that can direct you to a specific hyperlink without triggering a new browser window to open

Material UI is being used and a home icon has been imported into the navbar as shown below <Home edge="start" color="inherit" aria-label="home" onClick={event => window.location.href='/ <Home fontSize="lar ...

Unable to establish connection through MQTT 1884 protocol

Currently, my website's messaging system is powered by MQTT. While everything is functioning smoothly on my local machine, I encounter an error when trying to use the system on the production site: vendor.bbaf8c4….bundle.js:1 WebSocket connection ...

Unsure about the approach to handle this PHP/JSON object in Javascript/jQuery

From my understanding, I have generated a JSON object using PHP's json_encode function and displayed it using echo. As a result, I can directly access this object in JavaScript as an object. Here is an example: .done(function(response) { var ...

Tips for creating consecutive HTTP API requests in Angular 2

Is there a way to use RXJS in order to handle multiple API calls, where one call is dependent on another? ...

Integrating additional youngsters into the HTML DOM using Angular.js

I am working with a block of HTML that looks like this: <div id="parent"> <div id="child_1"></div> <div id="child_2"></div> <div id="child_3"></div> <div id="child_4"></div> </div> ...

Exploring the power of ES6 map function within React stateless components

I have a React application that fetches an array of objects from an API response. I want to display each object's details in an accordion format. Using the react-accessible accordion library, I created a React Stateless Component to achieve this. Each ...

HTML/JavaScript - Ways to show text entered into an input field as HTML code

One dilemma I'm facing involves a textarea element on my website where users input HTML code. My goal is to showcase this entered HTML code in a different section of the webpage. How should I approach this challenge? The desired outcome is similar to ...

Attempting to grasp the fundamentals of angular Routing, however, upon attempting to reload the page, nothing appears to be displayed

While working in the Bracket editor, I created a file structure with various files located under the 'scripts' tags within the Index.html file. The root folder is named 'projectAngular', inside which there are subfolders like 'appC ...

Sending HTML Form Data to PHP with AJAX: A Step-by-Step Guide

Currently, I'm working on a form that includes a file type input. My goal is to utilize JavaScript/jQuery to capture the image provided in this input and then pass it over to my PHP function for uploading into my WordPress media library using the medi ...

What Are the Possible Use Cases for Template Engine in Angular 2?

For the development of a large single page application (SPA) with Angular 2.0, I have decided to utilize a template engine like JADE/PUG in order to enhance clarity and clean up the code. My goal is to achieve optimal performance for the application. Th ...

The trick to viewing codes in full width on vscode

When coding in VS Code, I prefer to use the full viewport. However, I'm facing an issue where the lines do not expand when I expand my VS Code window. Is there a fix for this problem? https://i.sstatic.net/wuqEJ.png ...

View the user's ID profile

Having trouble accessing user profiles? For example, as User 1, you want to view User 2's profile but when entering the URL (e.g. localhost/$userID), only information from your own profile (User 1) is displayed. Below is the HTML CODE for displaying ...

Ways to eliminate space between column arrangement in Bootstrap

I've designed 3 cards containing 2 widgets each in the sidebar. To ensure responsiveness, I utilized bootstrap 4 column ordering. One problem is when the right column is larger than the left one in a row of 2 columns, there's an awkward space be ...

Using Vue: Triggering .focus() on a button click

My journey with vue.js programming started just yesterday, and I'm facing a challenge in setting the focus on a textbox without using the conventional JavaScript method of document.getElementById('myTextBox').focus(). The scenario is that i ...

What is the best way to integrate a link into a form validation using Bootstrap?

I followed the instructions in the image, but it's still not working. Can anyone help? ...

Utilize JavaScript's $.Map() function in combination with Math.Max.Apply() to determine the tallest height possible

This code snippet demonstrates how to find the maximum height using jQuery. The $.fn. syntax is utilized to add this method as a jQuery Plugin. $.Map() creates a new array. Math.Max.Apply retrieves the max number from an array. $.fn.t ...