从 Javascript 读取硬编码 csv 文件的最佳实践答案

【问题标题】：Best practices for reading in hardcoded csv file from Javascript从 Javascript 读取硬编码 csv 文件的最佳实践
【发布时间】：2015-02-11 16:04:39
【问题描述】：

我是 JavaScript 新手，正在制作在线地图可视化。我需要将地理坐标的本地 csv 文件作为数组读取。

例如，我有：

var data = [
  new google.maps.LatLng(40.3456455, -74.6558775),
  new google.maps.LatLng(40.3456456, -74.6558772),
  ];

并且我希望能够使用我在 CSV 文件中的坐标来填充它。

我查看了 jquery-csv，但它需要将 csv 作为字符串传入，并且无法传递文件路径并让 Javascript 读取文件。我应该对字符串进行硬编码，还是尝试在 Python 中读取它并以某种方式将字符串传递给 Javascript？管理此问题的最佳方法是什么？

谢谢！

【问题讨论】：

如果您希望用户能够提供 csv（而不是服务器），那么您需要查看文件 API（如果您想要一个好的 UX，还需要查看拖放 API）
不，我希望服务器提供它。我将如何开始实施？
在这种情况下，您可能应该使用 ajax 来获取它

标签： javascript jquery python csv web

【解决方案1】：

如果要读取本地文件，需要使用HTML5 File API。获得 CSV 数据后，我会对其进行解析并转换为 JSON。 Here 是一个很好的例子，包括一个演示链接。

如果您不想使用 HTML5 File API，您可以将 CSV 文件上传到服务器并在那里将 CSV 转换为 JSON。请找到solution in PHP here。

我建议你创建一个这样的 JSON，因为这很容易在客户端使用 JavaScript 处理：

[
  {
    "latitude":40.3456455,
    "longitude":-74.6558775
  },
  {
    "latitude":40.3456456,
    "longitude":-74.6558772
  }
]

【讨论】：

HTML5 文件 API 要求用户上传文件。我不希望这样——我有文件，我希望程序在浏览器打开时自动加载它。
如果可以从服务器加载 CSV，那么您可以使用 JavaScript/jQuery 加载它并像在我的第二个链接中的 the example 中那样处理它。
实际上 david 和 Larry Lane 都提出了类似的建议。你有进步吗？

【解决方案2】：

您可以使用 Jquery get 函数示例读取文件及其内容：

//the path to your csv file
var filePath ="pathToYourCSVFile";

$.get(filePath,function(data){


//do something with the data
//whatever you do with the data needs to been done inside this function


//example of what you could do

//array to hold the lines of your data file
//data string is split up by each new line
var lines = data.split("\n");

//you could then loop through each line and populate the values you need for each line



});

【讨论】：