Incorrect date displayed in tooltip on charts using daylight savings time in highcharts

I need help with a chart that has dates, including a daylight saving day. After this specific day, all subsequent dates in the tooltip are showing as one day earlier than they should be. 

$(function () {
  Highcharts.setOptions({
    global: {
      useUTC: false
    }
  });
  $('#container').highcharts({
    xAxis: {
      type: 'datetime'
    },
    chart: {
      type: "column"
    },
    plotOptions: {
      series: {
        stacking: "normal"
      }
    },
    series: [{
      data: [{
        y: 10
      }, {
        y: 20
      }, {
        y: 10
      }],
      pointInterval: 86400000,
      pointStart: 1414274400000 //Sun Oct 26 2014 00:00:00 GMT+0200 (CEST)
    }]
  });
});

Check out an example here: http://jsfiddle.net/bmmg8jnx/

javascriptdatehighcharts

Answer №1

What exactly is a date-saving day?

Are you referring to daylight saving time?

The scenario you are describing does seem related to daylight savings time. If you input a timestamp of midnight that loses an hour due to the time shift, it could potentially be interpreted as the previous day. To avoid this issue, consider sending a timestamp later in the morning or at another point in the day that won't be impacted by a one-hour shift.

{{revised based on feedback:

1) The tooltip displays the x-axis value accurately. Note that data points may not align directly with tick marks, as tick marks are placed at fixed intervals. If your data falls between these intervals due to the hour offset, the tooltip will correctly reflect the date associated with the data point.

2) Typically, a one-hour offset like this shouldn't have significant implications unless your data specifically corresponds to events occurring every night at midnight, which is uncommon in most datasets.

If there is a consistent one-hour discrepancy in the data you're providing, it will result in a corresponding one-hour discrepancy in the displayed date. The chart is interpreting the data accurately based on the information you've supplied.

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

Can one upload a file through ExtJS 4 without using a form?

Is there a way to upload a file without submitting a form in ExtJS 4? If so, how can this be achieved? Thank you. ...

javascriptajaxextjsextjs4

Creating an element that remains a consistent height despite zooming or resizing the window: A guide with HTML and CSS

Recently, I created a custom scrollbar but faced an issue with its width. Whenever I zoom in or out (Ctrl + mousewheel), the width (set to 10px) changes due to being in pixels. When switched to width: 1vw, it works well with zooming but gets affected by wi ...

javascripthtmlcss

Tips for managing lag caused by large raw image re-renders in a React application

When trying to change the background position of a user-uploaded background image that is in raw Data URI format using CSS, I noticed that re-rendering becomes slow if the image size exceeds 1mb. This issue does not occur with smaller images. Is there a ...

javascriptreactjsfrontendblobweb-performance

Testing the Angular/Ionic project through unit tests

I am facing a challenge with my controller code, which appears to be quite simple. Here is a snippet of the controller: timeInOut.controller('timeInOutController', function($scope, $filter, $ionicScrollDelegate){ ... }); However, when at ...

javascriptangularjsunit-testingionic-framework

Extract data from a multidimensional array using a one-dimensional array as a filter

A series of checkboxes are present on a webpage where clicking them generates an array of values called allVals. This array is dynamically updated as checkboxes are toggled on and off. Additionally, there is a multidimensional array named recordSet that ne ...

javascriptjqueryarraysloopsmultidimensional-array

How can you achieve three layers of nested quotes in Dynamic HTML?

Working on an app that utilizes JQuery and JQTouch for iOS. The issue I'm facing involves dynamically generated HTML lists where the user clicks a row that needs to be highlighted. However, achieving this has proven tricky due to nesting 3 sets of quo ...

javascripthtmlcssonclickhtml-lists

What is the best way to make this relative path function in JavaScript?

My file structure is organized in the following way: multiple folders a subfolder _includes getStatisticsTable.php _templates StatisticsWrapper.html Within StatisticsWrapper.html, I am using jQuery's .get() method to fetch external data which ...

phpjavascriptjqueryrelative-path

What could be causing the show() method to malfunction in jQuery?

My attempt at creating a basic slideshow using jQuery involves only 3 images in rotation. To navigate between images, I have utilized the next() method in my code. Here is how it is meant to function: Upon clicking a link (class="next"), a funct ...

javascripthtmljquerysliderslideshow

Developing user registration and authentication using Backbone.js in conjunction with Django Rest Framework

In the process of developing my app, I am utilizing backbone.js for the frontend and django-rest-framework for the backend. My goal is to enable user registration, login, logout functionality, and be able to verify whether a user is logged in using backbon ...

javascriptdjangobackbone.jsdjango-rest-framework

Tips for dynamically updating the id value while iterating through a class

Here's the HTML snippet I am working with: <div class="info"> <div class="form-group"> <label class="control-label col-sm-2">Title</label> <div class="col-xs-10 col-sm-8"> <inpu ...

javascriptjqueryhtmlcss

Using D3.JS, you can determine the minimum and maximum values within an array of arrays, a feature that is not

My data is structured as an array of arrays, with each inner array containing objects like this: series = [ [ { "x":2013-01-01, "y":100 }, { "x":2013-01-02, "y":300 } ...], [ { "x":2013-01-01, "y":1000 }, { "x":2013-01-02, "y":300 } ...],... ...

javascriptarraysd3.js

Reorganize external dependencies in the wwwroot directory using gulp

In my development setup using VS 2015, ASP.net vnext, Angular 2, Typescript, and gulp.js, I have successfully automated the process of moving my scripts/**/*.ts files to the wwwroot/app folder. Now, I am looking to extend this automation to include my libr ...

javascriptbuildnpmgulpasp.net-core

What is the best way to get a third-person camera to track an object from behind in react-three/fiber?

Currently, I am in the process of developing a "3D tank game" and have utilized a majority of the code from this Original Project. I've encountered difficulty in finding resources that offer good examples showcasing the implementation of "useRaycastVe ...

javascriptreactjsthree.jsreact-three-fiberreact-three-drei

using a ternary operator within the map function

Currently, I'm developing a web application that allows users to view a list of items and mark certain items as favorites. The favorites are stored in an array of IDs assigned to a prop (this.props.favorites). To ensure there are no duplicate entries, ...

javascriptreactjsjsx

Encountering Error: When Running the Command "npm run dev" it's Showing "missing script: dev" Message

I attempted to set up the SVELT GitHub repository locally by following these steps: https://github.com/fusioncharts/svelte-fusioncharts When I tried to launch it using the "npm run dev" command, I encountered this error: npm ERR! missing script: dev To ...

javascriptnode.jsnpmsvelte

Tips on managing the onKeyUp event in a ReactJS form

Here is a simple JavaScript function called numericOdds implemented in home.js file: function numericOdds(e) { var valid = /^[1-9]{1}[0-9]{0,1}$/ var number = /^[1-9]{1}$ | ^[1-9]{1}[0-9]{1}$/ var lastValid = ''; var n; console.log(&apo ...

javascriptreactjs

Is there a way to prevent Faker from continuously displaying the identical picture?

One of the challenges I'm facing involves using faker to generate an array of random objects. Here's a snippet of what I have: { "image": faker.random.arrayElement([ faker.image.nature(), faker.image.city(), faker.image.food() ...

javascriptjsonnpmfaker

Tips on sending access token and store name to a new object in Shopify API Node

In the process of developing a public Shopify app, I am looking to implement a POST route for creating a metafield. According to the documentation found in the shopify-api-node module, it states: accessToken - Necessary for public apps - This is a string ...

javascriptnode.jsexpressoauthshopify-app

There seems to be an issue with Bookshelfjs and bcrypt hashPassword - it is functioning properly during the create

When using bcrypt to hash passwords in bookshelfjs, I encountered an issue where the password was not being hashed when attempting to update it. Here is the code snippet: model.js var Bookshelf = require('../../db').bookshelf; var bcrypt = requ ...

javascriptnode.jsexpressbcryptbookshelf.js

Through the implementation of JavaScript, the element's class is dynamically altered

While working on my project, I encountered an issue with implementing a change in the class of an element using JavaScript. The problem is that when I click on the home page, the last page does not get deselected. Here is my current JavaScript code: const ...

javascripthtml