Загрузить файл csv в d3. js, используя абсолютный путь - PullRequest
0 голосов
/ 14 июля 2020

Я могу загрузить файл csv, если он находится в том же рабочем каталоге, например:

.defer(d3.csv,"data.csv", function(d) { .. })

, но если файл находится в другом каталоге, и я передаю абсолютный путь, файл не загружено:

.defer(d3.csv,"/home/path/data.csv", function(d) {..})

Я получаю код 404, сообщение Файл не найден

Я уже запускаю локальный веб-сервер

EDIT

Я следую этому руководству:

https://www.d3-graph-gallery.com/graph/choropleth_basic.html это индекс. html

<script>

    // The svg
    var svg = d3.select("svg"),
      width = +svg.attr("width"),
      height = +svg.attr("height");
    
    // Map and projection
    var path = d3.geoPath();
    var projection = d3.geoMercator()
      .scale(70)
      .center([0,20])
      .translate([width / 2, height / 2]);
    
    // Data and color scale
    var data = d3.map();
    var colorScale = d3.scaleThreshold()
      .domain([10, 30, 40, 50, 70, 100])
      .range(d3.schemeBlues[7]);
    
    // Load external data and boot
    d3.queue()
      .defer(d3.json, "https://raw.githubusercontent.com/holtzy/D3-graph-gallery/master/DATA/world.geojson")
      .defer(d3.csv, "data.csv", function(d) { data.set(d.codice, d.rtt); })
      .await(ready);
    
    function ready(error, topo) {
    
      // Draw the map
      svg.append("g")
        .selectAll("path")
        .data(topo.features)
        .enter()
        .append("path")
          // draw each country
          .attr("d", d3.geoPath()
            .projection(projection)
          )
          // set the color of each country
          .attr("fill", function (d) {
            d.total = data.get(d.id) || 0;
            return colorScale(d.total);
          });
        }
    
    </script>

Что работает, если файл data.csv тот же каталог index. html, но он не работает, если он находится в другом каталоге, и я получаю:

code 404, message File not found

Uncaught TypeError: topo is undefined
    ready http://localhost:8000/:43
    _call https://d3js.org/d3.v4.js:11174
    maybeNotify https://d3js.org/d3.v4.js:11251
    abort https://d3js.org/d3.v4.js:11244
    end https://d3js.org/d3.v4.js:11218
    call https://d3js.org/d3.v4.js:792
    respond https://d3js.org/d3.v4.js:11397

EDIT 2

Попытка для прямой загрузки файла CSV без загрузки его ранее таким образом, но не работает:

if (rows.length == 5) {
   createmap(createcsv(rows))
}
function createcsv(rows) {

    let csvContent = "data:text/csv;charset=utf-8,";

    csvContent ="codice,rtt"+"\r\n";

    rows.forEach(function(rowArray) {

        let row = rowArray.join(",");

        csvContent +=row+"\r\n";

    });

    return csvContent;

}


function createmap(map) {
d3.queue()
          .defer(d3.json, "https://raw.githubusercontent.com/holtzy/D3-graph-gallery/master/DATA/world.geojson")
          .defer(d3.csv, mappa, function(d) { data.set(d.codice, d.rtt); })
          .await(ready)
}

1 Ответ

0 голосов
/ 14 июля 2020

Здесь несколько вещей:

  1. Убедитесь, что ваша номенклатура data.csv и dat.csv не является проблемой.

  2. Вы пытаетесь получить доступ к каталогам, не подпадающим под разрешение локального хоста? Вам необходимо разрешить www-data доступ к пути. Похоже, вы пытаетесь получить доступ к / home / path /, что, скорее всего, не входит в область доступа www-data. Или просто попробуйте разместить data.csv где-нибудь в пределах /var/www/yourapplication/path/. Это может помочь.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...