Init in fetch

Community Help
1

I have been wandering from pages to pages for at least two days, wanting to understand what was I doing wrong for my init function in d3.json(url, init) not to transform my data ?
What programming concept am I missing ?

{
  let dataset1 = []; 

  await d3.json(url,normalize).then(processJSON); // the await to make sure everything is loaded before we proceed

  function processJSON(data){
    dataset1 = data;  // Why is data not normalized ?
  }

  return dataset1
}

After more that two days searching for what I guess is an evidence for you, I have a meta-question.
What strategy do you employ to find your answers. Could I be more efficient in learning ?or Iā€™m asking myself too muchā€¦ juste needing more time. As for now:

  • I take time to read the docs even when I canā€™t get much from it because itā€™s too technical for me, e.g the fetch.specā€¦ Still I opened the fetch page a handful of times in the last months and read some more each time.
    • I admit sometime using a text to speech reader because tech spec style goes well with a robotic voice and itā€™s not as enjoyable as a Nabokov.
  • I search the Observable notebooks for code looking like mine, here: d3.fetch(data, init).then(...
  • I try stuff, explore, testā€¦ but start wondering if unstructured learning is what I need.
  • I sleep thinking of my problem and how to solve it
  • I wake up thinking that I have that problem to solve.
  • I can take online-course or follow tutorials to get started. Did most of Udacity d3 MOOC
  • I read and reproduce examples given in some books like Interactive Data Visualization for the Web*

(edit : - and I formulate questions, it helps a lot just to know that it could be answered. )

What I did not do is attend workshops and have face to face discussion with people using d3js, and I feel Iā€™m missing a lot.

Thank you

1 Like
2

I think the issue is with the second argument to d3.json. It is not a callback function in d3v5 but is supposed to be an init object which contains options for the fetch call. The MDN web docs has an article which may be easier to read.

Hereā€™s a minimal change to your first cell that does what you intend:

{
  let dataset1 = []; 

  await d3.json(url).then(d => d.map(normalize)).then(processJSON); // the await to make sure everything is loaded before we proceed

  function processJSON(data){
    dataset1 = data;  // Why is data not normalized ?
  }

  return dataset1
}

As for learning strategies, I think most of the ones you listed are on my list too (Iā€™ll have to try the text-to-speech sometime :wink: ). I would also add ā€œtaking breaks to relax and do other thingsā€ as in my experience itā€™s important to let the subconscious mind do its work. Also Iā€™ve found that often things that confuse me have been discussed elsewhere on the web e.g. StackOverflow or peopleā€™s blogs, so I also make an effort to do a thorough web search for sources outside official docs.

5 Likes
3

You are good to me. Merci !

I see my error as sticking to the idea that introducing callback in d3.fetch was the change made from d3v4 to d3v5 when it was the opposite. Still a long way to goā€¦

1 Like