git-ashish

// http://www.html5rocks.com/en/tutorials/file/dndfiles/
d3.select('svg')
  .on('dragover', handleDragOver)
  .on('drop', handleFileSelect)
  ;

function handleFileSelect() {
  var event = d3.event
    , files = event.dataTransfer.files // FileList object
    , about = []

git-ashish

This example demonstrates D3’s support for azimuthal projections and clipping to great circles! Release 2.3.0 also includes support for Gnomonic, Bonne, Werner and Sinusoidal projections, as well as for rendering great arcs.

The geometry for this example comes from Natural Earth’s coastline dataset.

git-ashish

// http://www.html5rocks.com/en/tutorials/file/dndfiles/
d3.select('svg')
  .on('dragover', handleDragOver)
  .on('drop', handleFileSelect)
  ;

function handleFileSelect() {
  var event = d3.event
    , files = event.dataTransfer.files // FileList object
    , about = []

git-ashish

var start_date = new Date('12/01/2013'),
    end_date   = new Date(),
    one_day_in_milliseconds = 1000*60*60*24,
    date_diff = Math.floor( ( end_date.getTime() - start_date.getTime() )/one_day_in_milliseconds ) ;
    
    console.log("Result 1 - Date difference between ",end_date, " & ",start_date, " - ", date_diff);

var s_date = new Date('2013-12-01'),
    date_diff_2 = Math.floor( ( end_date.getTime() - s_date.getTime() )/one_day_in_milliseconds ) ;
    

git-ashish

function getNewDate(dateString){

  var date = dateString ? new Date(dateString) : new Date(),
      timezoneOffset = date.getTimezoneOffset();

      return new Date( date.getTime() + timezoneOffset*60*1000*(dateString?1:0) );
}

var start_date = getNewDate('2013-12-01'),
    end_date   = getNewDate(),

git-ashish

This example shows how it is possible to use a D3 sunburst visualization (partition layout) with data that describes sequences of events.

A good use case is to summarize navigation paths through a web site, as in the sample synthetic data file (visit_sequences.csv). The visualization makes it easy to understand visits that start directly on a product page (e.g. after landing there from a search engine), compared to visits where users arrive on the site's home page and navigate from there. Where a funnel lets you understand a single pre-selected path, this allows you to see all possible paths.

Features:

• works with data that is in a CSV format (you don't need to pre-generate a hierarchical JSON file, unless your data file is very large)
• interactive breadcrumb trail helps to emphasize the sequence, so that it is easy for a first-time user to understand what they are seeing
• percentages are shown explicitly, to help overcome the distortion of the data that occurs wh

git-ashish

/**
 * Breadth First Search to traverse through all data points
 *
 * Structure of json : 
 *
 * { "name": "Alpha",
 *   "children": [
 *      {
 *        "name": "Beta",
 *        "children": [{

git-ashish

Faux-3d SVG globe using d3.geo.orthographic and a few radial gradients. Labels offset or hidden based on radians from current map center to enhance the effect.

Uncomment svg.append("g").attr("class","countries") for hover-able country outlines.

git-ashish

Building on this - experimenting with fake 3d svg arcs using two nested orthographic projections and cardinal line interpolation.

git-ashish

{"nodes":[
{"name":"Agricultural 'waste'"},
{"name":"Bio-conversion"},
{"name":"Liquid"},
{"name":"Losses"},
{"name":"Solid"},
{"name":"Gas"},
{"name":"Biofuel imports"},
{"name":"Biomass imports"},