2015-05-24 1 views
1

Я нарисовал карту мира с d3 и json-файлом и пытается нарисовать круги на карте на основе моих данных.данные не определены после импорта из csv-файла с d3

Я импортировал свои данные с помощью функции d3.csv(), как вы можете видеть ниже. Однако data, по-видимому, не распознается для моей функции function plot_points(data). Когда я набираю data в консоли в функции, он продолжает говорить мне data is undefined. Это интересно, потому что раньше я использовал тот же самый код для другого проекта, и data был бы признан массивом объекта. Можете ли вы сказать, что случилось?

<head> 
    <script type="text/javascript"> 
     function draw(geo_data) { 
     "use strict"; 
     var margin = 75, 
      width = 1400 - margin, 
      height = 600 - margin; 

     d3.select("body") 
       .append("h2") 
       .text("Circle Graph"); 

     var svg = d3.select("body") 
      .append("svg") 
      .attr("width", width + margin) 
      .attr("height", height + margin) 
      .append('g') 
      .attr('class', 'map'); 

     var projection = d3.geo.mercator() 
           .scale(150) 
           .translate([width/2, height/1.2]); 

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

     var map = svg.selectAll('path') 
        .data(geo_data.features) 
        .enter() 
        .append('path') 
        .attr('d', path) 
        .style('fill', 'lightBlue') 
        .style('stroke', 'black') 
        .style('stroke-width', 0.5); 

     // debugger; 
     // here data is undefined 
     function plot_points(data) { 
      // debugger; 
      // here data is undefined as well 
     }; 

     d3.csv("data/olympics_editions.csv", function(d) { 
      // debugger; 
      // here d is each data point/object, and seems to be working just fine 
      d['Year'] = format.parse(d['Year']); 
      d['Latitude'] = +d['Latitude']; 
      d['Longitude'] = +d['Longitude']; 
      return d; 
     }, plot_points); 

     }; 
    </script> 
    </head> 
    <body> 
    <script type="text/javascript"> 
     d3.json("data/world_countries.json", draw); 
    </script> 
    </body> 
+0

Вы получаете любого ошибки? –

+0

@LarsKotthoff Я получаю какую-то ошибку о '.length' не может быть использован на' null', но это почему-то ушло. Теперь я думаю, что знаю, почему он не читает данные должным образом, потому что, как предлагает Josh, синтаксис для d3 для чтения файла csv отличается от чтения json или tsv-файлов. – practicemakesperfect

ответ

1

Из документации d3.csv, подпись для обратного вызова выглядит следующим образом:

function(error, rows) { 

}); 

попытка добавление error параметра к вашей функции plot_points:

function plot_points(error,data) { 

}; 
+1

Джош прав, но я добавляю некоторые детали к этому, которые, надеюсь, могут помочь кому-то еще в будущем. Для функции это должна быть функция plot_points (data) {}. И для импорта файла это должно быть d3.csv (data/olympics_editions.csv), function (d) {return {year: d.Year, широта: d.Latitude, longitude: d.Longitude};}, plot_points) ; – practicemakesperfect