Timeseries plot

[jduckles]

This is an issue to talk about how we want to lay out the timeseries plots.

[nbgraham]

@sarah-jung I would suggest adding a label to each rectangle on the left with the tag ID. You can look in etag/D3_examples in the bar chart to see how I labeled the bars. I would also add an axis on the top of the chart for the time. You can look at the axis on the bar chart for examples. Ask if you need any help.

[sarah-jung]

@nbgraham Just a quick question but I can't seem to make the timeseries show up on the localhost and I'm wondering how you did that. Also if I were to make changes to the code, do I have to commit it every time for me to see it on the localhost?

[jduckles]

You shouldn't have to commit on localhost. In order to make it work you're going to have to run a local web server. One way to do this if you have Python on the system is to run.

python2.x

python -m SimpleHTTPServer

python 3.x

python -m http.server

Let me know if you want some help figuring that out.

[sarah-jung]

@nbgraham I got mostly everything to work but on the x axis, I can't seem to make the time exactly right. It shows the hour as 12 instead of 17 and I can't really fix it.

[nbgraham]

@sarah-jung Looks great! That's how its supposed to be. The data gives the time in UTC format and the browser converts its to local time (central time for us).

[nbgraham]

I've added the time series representation to the map. @sarah-jung take a look because I mostly implemented the timeseries files to what we were talking about in the meeting.

@jduckles @mbstacy I'm struggling with the asynchronous function calls in my data parsing of drawTimeseries.js

I could implement this function by looping through each item and building the list one by one like I did for function type(data) in the original timeseries. However, this solution (below) seems more elegant and more useful of the API.

The results item is not getting updated fast enough. The next time I use results after calling groupByTags, I get an error because it is undefined. Is there any way to fix this?

function groupByTag(data, url)
{
  var uniqueTags = [];
  var results = [];
  var element, index, tag;

  for (var i = 0; i<data.length; i++)
  {
    element = data[i];
    element.timestamp = new Date(element.timestamp);
    index = contains(uniqueTags, element.tag);

    if (index < 0)
    {
      uniqueTags.push(element.tag);
      d3.json(url + "&tag=" + element.tag, function (data)
      {
        results.push(data.results);
      });
    }

  }
  return results;
}

[jduckles]

Looks to me like line 93 var results = groupByTag(data.results); is not working in an async fashion. See this guide on async http://www.html5rocks.com/en/tutorials/async/deferred/ particularly the second section called "Making Applications Asynchronous-Ready"

It is a bit of a different paradigm when programming with asyc, event driven JavaScript.