Discover and update values in JSON using JavaScript

Currently, I am working on generating graphs using d3.js with a JSON file as the input. My main challenge lies in parsing the date and time format for the x-axis. Below is the code snippet that I have attempted:

d3.json('data/fake_users11.json', function(data) {

var parseDate = d3.time.format("%Y-%m-%d %H:%M:%S").parse;
var old = JSON.stringify(data).replace(/\//g, "-");
data = JSON.parse(old); //convert back to array
data.forEach(function(d) {
    d.date = parseDate(d.date);
});

The structure of the JSON file looks similar to this:

[
    {
        "date": "02\/18\/2016 18:02:38",
        "value": 10
    },
    {
        "date": "02\/18\/2016 18:02:45",
        "value": 20
    },
    {
        "date": "02\/18\/2016 18:02:50",
        "value": 30
    }
]

My goal is to achieve the format "02-18-2016 18:02:50", however, I keep running into errors. I feel like I am very close to the solution but missing something critical. Could someone please help me identify the mistake here? Your assistance is greatly appreciated.

Answer №1

It seems like there might be a mistake in the formatting you're using.

Your dates have the year at the end, but you're trying to parse it at the beginning:

var parseDateWrong = d3.time.format("%Y-%m-%d %H:%M:%S").parse;

Instead, it should be:

var parseDateOk = d3.time.format("%m-%d-%Y %H:%M:%S").parse;

You can check out this example on jsfiddle to see what I mean.

I believe you can now directly use the JSON without replacing the / with -:

var parseDate = d3.time.format("%m/%d/%Y %H:%M:%S").parse;

data.forEach(function(d) {
    d.date = parseDate(d.date);
});

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

Rails 4 not properly executing success function after rendering JSON response

Currently, I am utilizing the jQuery method $.get to retrieve a JSON response from the server. $.get(SITE_EDIT_HOME_URL,{key: key},function(r){ r = JSON.parse(r); console.log(r); }); This is how I handle the request and send back a response: def g ...

Tips for efficiently storing and accessing data obtained from the "RESTBuilder" tool on the Total.js platform

After stumbling upon this informative tutorial on how to build a cryptocurrency comparison site with VueJs, I was inspired to create a single-page application using the total.js platform. My goal is to fetch the list of coins from the "coinmarketcap.com" A ...

Display drop-down item when selected for the first time and hide it when selected for the same item for the second time

Is there a way to display form input when "C" is selected and hide it when "A", "B", or "D" are selected? If "C" is selected again after initially showing the form input, should it be hidden? For example, if "C" is selected for the first time, the form inp ...

Is the Order of a JSON Array Dependable?

When working with JSON, it's clear that relying on the ordering of key-value pairs may not be reliable. For instance, a JSON parser could interpret { "someKey" : "someValue", "anotherKey" : "anotherValue", "evenAnotherKey" : "evenAnotherV ...

Retrieve the content of a text field with jQuery

Check out this block of HTML: <div class="sub-middle-column"> <div class="div-header">Grandsire <a "#", class="table-control-focus sub-header-table-focus" id="table-control-focus-t" >abc</a> <ul class="table-controls h ...

Uncertain about how to transfer data between server and client in Next.js?

I'm currently grappling with understanding the proper method of exchanging data between server-side and client-side components in NextJS 13. To simplify my learning process, I have created a basic scenario. In this setup, I have two functions that pe ...

Injecting Variables Into User-Defined Button

Presenting a custom button with the following code snippet: export default function CustomButton(isValid: any, email: any) { return ( <Button type="submit" disabled={!isValid || !email} style={{ ...

Tips for storing a JSON file locally and accessing it at a later time on the client side

Can PHP be used to generate a JSON file containing information like first name and last name? When using json_encode, what is the process of saving it on the client side, and how can it be retrieved and read afterward? ...

Modifying text on input buttons using Javascript

Including product names, text forms, and buttons on a webpage is essential for showcasing products effectively. Each product is assigned an ID such as p1, p2, etc., while the input types are identified by i1, i2, etc. When users enter information into the ...

What is the process for including an external .js file in my VueJS2 index.html?

Currently, I am faced with a challenge involving two external Javascript files that are responsible for managing animations and vector triangulation for a background animation. In a typical html/css/js project, adding these two .js files would involve incl ...

Issue with Vue.js: Nested field array is triggering refresh with inaccurate information

I've been working on a Vue page where I want to have nested field collections, with a parent form and repeatable child forms. Everything seems to be working fine except that when I try to delete one of the child forms, the template starts rendering i ...

Having trouble accessing a React component class from a different component class

I just started learning reactjs and javascript. For a simple project, I'm working on creating a login and registration form. The issue I'm facing is that when a user enters their email and password and clicks 'register', instead of movi ...

Unable to perform a fetch request in IE9 after the page has finished loading

I'm currently encountering an issue with my Node and Express server setup. I have a separate API on a different server that needs to be accessed, but everything works fine except in IE9. The problem arises when I try to make a call to the API after lo ...

Is it more efficient to use Vue events or Vuex for transmitting data between components?

Working on a project where data needs to be shared between components in order to update a canvas element at 30-60fps for optimal performance on low-end devices. Currently utilizing Vuex store/get method for data transfer, but considering using events as ...

Steps to invoke a function in a PHP file from an external JavaScript file

Can anyone assist me with calling the function below in my PHP file? function update_hidden_input(saved_tokens, hidden_input) { var token_values = $.map(saved_tokens, function (el) { //alert(el[settings.tokenValue]); return el[ ...

Update the input value following a successful action

How can I update the value of an input field after a successful ajax call? I have tried the following approach but it doesn't seem to be working. The result from the alert is 80000 Here is the HTML input code: <input class="form-control" type=" ...

Unleash the full power of Angular Components by enhancing them with injected

I am facing a challenge with handling the destruction event of an Angular component in my external module that provides a decorating function. I've run into issues trying to override the ngOnDestroy() method when it includes references to injected ser ...

Guide to refreshing extensive dataset using MySQL migration scripts

We are in the process of developing a Nodejs application for a client who has requested that we use migration scripts to streamline updating the production database. As someone new to MySQL, I am struggling with how to update table contents using only MySQ ...

FrisbyJS and JSONSchema encounter a SchemaError when the specified schema does not exist

I utilize frisbyjs along with modules like jsonschema and jasmine-node for execution. There is a particular schema named test.json: { "error": { "type": "array", "minItems": 2, "items": { "type": "object", "properties": { ...

What is the process for saving selected values from a drop-down list into a database?

Hey there, I'm a newcomer to PHP and ajax. When choosing an option from the drop-down list, a separate div function should appear where I need to insert both the selected option and input data in different divs. Sorry for my poor English. Any help fro ...