javascript 读取csv文件

JavaScript013

javascript 读取csv文件,第1张

js读取CSV格式数据,参考如下:

<script type="text/javascript">     

// This will parse a delimited string into an array of  

// arrays. The default delimiter is the comma, but this  

// can be overriden in the second argument.  

function CSVToArray( strData, strDelimiter ){  

// Check to see if the delimiter is defined. If not,  

// then default to comma.  

strDelimiter = (strDelimiter || ",")  

   

// Create a regular expression to parse the CSV values.  

var objPattern = new RegExp(  

(  

// Delimiters.  

"(\\" + strDelimiter + "|\\r?\\n|\\r|^)" +  

   

// Quoted fields.  

"(?:\"([^\"]*(?:\"\"[^\"]*)*)\"|" +  

   

// Standard fields.  

"([^\"\\" + strDelimiter + "\\r\\n]*))"  

),  

"gi"  

)  

   

   

// Create an array to hold our data. Give the array  

// a default empty first row.  

var arrData = [[]]  

   

// Create an array to hold our individual pattern  

// matching groups.  

var arrMatches = null  

   

   

// Keep looping over the regular expression matches  

// until we can no longer find a match.  

while (arrMatches = objPattern.exec( strData )){  

   

// Get the delimiter that was found.  

var strMatchedDelimiter = arrMatches[ 1 ]  

   

// Check to see if the given delimiter has a length  

// (is not the start of string) and if it matches  

// field delimiter. If id does not, then we know  

// that this delimiter is a row delimiter.  

if (  

strMatchedDelimiter.length &&  

(strMatchedDelimiter != strDelimiter)  

){  

   

// Since we have reached a new row of data,  

// add an empty row to our data array.  

arrData.push( [] )  

   

}  

   

   

// Now that we have our delimiter out of the way,  

// let's check to see which kind of value we  

// captured (quoted or unquoted).  

if (arrMatches[ 2 ]){  

   

// We found a quoted value. When we capture  

// this value, unescape any double quotes.  

var strMatchedValue = arrMatches[ 2 ].replace(  

new RegExp( "\"\"", "g" ),  

"\""  

)  

   

} else {  

   

// We found a non-quoted value.  

var strMatchedValue = arrMatches[ 3 ]  

   

}  

   

   

// Now that we have our value string, let's add  

// it to the data array.  

arrData[ arrData.length - 1 ].push( strMatchedValue )  

}  

   

// Return the parsed data.  

return( arrData )  

}  

   

</script>

这需要使用 JavaScript 进行读取 CSV 文件的操作。通过使用Ajax来读取CSV文件,并实时将其中的数据作为饼图的数据源,从而实现数据的实时更新。以下是根据您提供的图片3所做的示例

Ajax (Asynchronous JavaScript and XML) 是一种创建异步Web应用程序的技术。Ajax允许在不重新加载整个页面的情况下从服务器端加载数据,从而提高了用户体验和网页性能。

Ajax主要使用XMLHttpRequest对象来实现数据交互,并通过JavaScript和CSS来更新页面。Ajax请求在后台与服务器进行通信,因此它不需要阻塞用户界面,用户仍然可以继续与页面交互。

Ajax应用的一个简单的例子是:在页面中输入关键字,立即在页面下方更新搜索结果,而不是整个页面的重新加载。这就是Ajax的一种常见用例,它提高了网页的加载速度,并提高了用户的体验。

如果是基于浏览器,那就不能修改。

js读取CSV格式数据,参考如下:

<script type="text/javascript">

// This will parse a delimited string into an array of

// arrays. The default delimiter is the comma, but this

// can be overriden in the second argument.

function CSVToArray( strData, strDelimiter ){

// Check to see if the delimiter is defined. If not,

// then default to comma.

strDelimiter = (strDelimiter || ",")

// Create a regular expression to parse the CSV values.

var objPattern = new RegExp(

(

// Delimiters.

"(\\" + strDelimiter + "|\\r?\\n|\\r|^)" +

// Quoted fields.

"(?:\"([^\"]*(?:\"\"[^\"]*)*)\"|" +

// Standard fields.

"([^\"\\" + strDelimiter + "\\r\\n]*))"

),

"gi"

)

// Create an array to hold our data. Give the array

// a default empty first row.

var arrData = [[]]

// Create an array to hold our individual pattern

// matching groups.

var arrMatches = null

// Keep looping over the regular expression matches

// until we can no longer find a match.

while (arrMatches = objPattern.exec( strData )){

// Get the delimiter that was found.

var strMatchedDelimiter = arrMatches[ 1 ]

// Check to see if the given delimiter has a length

// (is not the start of string) and if it matches

// field delimiter. If id does not, then we know

// that this delimiter is a row delimiter.

if (

strMatchedDelimiter.length &&

(strMatchedDelimiter != strDelimiter)

){

// Since we have reached a new row of data,

// add an empty row to our data array.

arrData.push( [] )

}