2015-05-25 33 views
1

我試圖重現this d3 world tour流星在Ubuntu,但它似乎是D3不加載JSON正確或東西。我從幾個不同的地方嘗試了JSON和TSV文件:https://github.com/KoGor/Maps.GeoInfohttps://github.com/mapmeld/flightmap,並試圖對文件做fromdos。一切似乎都在起作用,除了當我嘗試運行它時出現'SyntaxError:Unexpected Token <'錯誤。在TSV和JSON文件在/公/地理爲什麼在Meteor [ubuntu]中不會將這個json文件加載到d3中?

我的js文件:

if (Meteor.isServer) { 
    Meteor.startup(function() { 
    // code to run on server at startup 
    }); 
} 


if (Meteor.isClient) { 
    Template.map.rendered = function() { 
     var width = 960, 
      height = 500; 

     var projection = d3.geo.orthographic() 
      .scale(248) 
      .clipAngle(90); 

     var canvas = d3.select("body").append("canvas") 
      .attr("width", width) 
      .attr("height", height); 

     var c = canvas.node().getContext("2d"); 

     var path = d3.geo.path() 
      .projection(projection) 
      .context(c); 

     var title = d3.select("h1"); 

     queue() 
      .defer(d3.json, "/geo/world-110m.json") 
      .defer(d3.tsv, "/geo/world-country-names.tsv") 
      .await(ready); 

     function ready(error, world, names) { 
      if (error) return console.warn(error); 
      var globe = {type: "Sphere"}, 
       land = topojson.feature(world, world.objects.land), 
       countries = topojson.feature(world, world.objects.countries).features, 
       borders = topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }), 
       i = -1, 
       n = countries.length; 

      countries = countries.filter(function(d) { 
       return names.some(function(n) { 
        if (d.id == n.id) return d.name = n.name; 
       }); 
      }).sort(function(a, b) { 
       return a.name.localeCompare(b.name); 
      }); 

      (function transition() { 
       d3.transition() 
        .duration(1250) 
        .each("start", function() { 
         title.text(countries[i = (i + 1) % n].name); 
        }) 
        .tween("rotate", function() { 
         var p = d3.geo.centroid(countries[i]), 
          r = d3.interpolate(projection.rotate(), [-p[0], -p[1]]); 
         return function(t) { 
          projection.rotate(r(t)); 
          c.clearRect(0, 0, width, height); 
          c.fillStyle = "#bbb", c.beginPath(), path(land), c.fill(); 
          c.fillStyle = "#f00", c.beginPath(), path(countries[i]), c.fill(); 
          c.strokeStyle = "#fff", c.lineWidth = .5, c.beginPath(), path(borders), c.stroke(); 
          c.strokeStyle = "#000", c.lineWidth = 2, c.beginPath(), path(globe), c.stroke(); 
         }; 
        }) 
        .transition() 
        .each("end", transition); 
      })(); 
     } 
    } 
} 

我怎樣才能獲得JSON文件正確加載,或獲得流星工作的例子嗎?

回答

1

注意,因爲他們是靜態的資產,你必須把以.json(和.tsv)流星項目的公共文件夾內。

+0

是的,我知道,並做到這一點。 – wordsforthewise

相關問題