D3.tsv与D3.csv加载数据

最新推荐文章于 2023-07-10 00:22:16 发布
最新推荐文章于 2023-07-10 00:22:16 发布
阅读量1.2k 收藏 4
点赞数
文章标签： json
原文链接：http://www.cnblogs.com/volodya/p/11296620.html
版权

1.D3加载数据的方法

  D3提供了方法可以对不同的数据类型进行加载，比如d3.text(), d3.xml(), d3.json(), d3.csv(), d3.tsv()和d3.html().

   index.html       

 1 <!DOCTYPE html>
 2 <meta charset="utf-8">
 3 
 4 <script src="https://d3js.org/d3.v4.min.js"></script>
 5 <script>
 6     d3.tsv("nemployment.tsv", data => {
 7 
 8         console.log(data)
 9 
10     });
11 
12     d3.csv("nemployment.csv", data => {
13 
14         console.log(data)
15 
16     });
17 </script>
18 </body>
19 
20 </html>
nemployment.tsv 
name    2000-01    2000-02    2000-03    2000-04    2000-05    2000-06    2000-07    2000-08    2000-09    2000-10    2000-11    2000-12    2001-01    2001-02    2001-03    2001-04    2001-05    2001-06    2001-07    2001-08    2001-09    2001-10    2001-11    2001-12    2002-01    2002-02    2002-03    2002-04    2002-05    2002-06    2002-07    2002-08    2002-09    2002-10    2002-11    2002-12    2003-01    2003-02    2003-03    2003-04    2003-05    2003-06    2003-07    2003-08    2003-09    2003-10    2003-11    2003-12    2004-01    2004-02    2004-03    2004-04    2004-05    2004-06    2004-07    2004-08    2004-09    2004-10    2004-11    2004-12    2005-01    2005-02    2005-03    2005-04    2005-05    2005-06    2005-07    2005-08    2005-09    2005-10    2005-11    2005-12    2006-01    2006-02    2006-03    2006-04    2006-05    2006-06    2006-07    2006-08    2006-09    2006-10    2006-11    2006-12    2007-01    2007-02    2007-03    2007-04    2007-05    2007-06    2007-07    2007-08    2007-09    2007-10    2007-11    2007-12    2008-01    2008-02    2008-03    2008-04    2008-05    2008-06    2008-07    2008-08    2008-09    2008-10    2008-11    2008-12    2009-01    2009-02    2009-03    2009-04    2009-05    2009-06    2009-07    2009-08    2009-09    2009-10    2009-11    2009-12    2010-01    2010-02    2010-03    2010-04    2010-05    2010-06    2010-07    2010-08    2010-09    2010-10    2010-11    2010-12    2011-01    2011-02    2011-03    2011-04    2011-05    2011-06    2011-07    2011-08    2011-09    2011-10    2011-11    2011-12    2012-01    2012-02    2012-03    2012-04    2012-05    2012-06    2012-07    2012-08    2012-09    2012-10    2012-11    2012-12    2013-01    2013-02    2013-03    2013-04    2013-05    2013-06    2013-07    2013-08    2013-09    2013-10
Bethesda-Rockville-Frederick, MD Met Div    2.6    2.6    2.6    2.6    2.7    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.7    2.7    2.8    2.8    2.9    3    3.1    3.3    3.4    3.5    3.5    3.6    3.6    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.3    3.3    3.3    3.3    3.3    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.3    3.3    3.3    3.3    3.2    3.2    3.1    3.1    3    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.9    3    3    3    2.9    2.9    2.9    2.9    2.8    2.8    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.6    2.6    2.5    2.5    2.6    2.7    2.8    2.9    3.1    3.2    3.4    3.6    3.9    4.2    4.5    4.9    5.2    5.5    5.7    5.8    5.9    6    6    6.1    6.2    6.2    6.3    6.3    6.3    6.2    6.1    6    5.9    5.9    5.9    5.9    5.9    5.8    5.8    5.7    5.6    5.5    5.5    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.4    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.2    5.2    5.2    5.2    5.2    5.2    5.1    5.2    5.3    5.5    5.5    5.3    5.2    5.2
Boston-Cambridge-Quincy, MA NECTA Div    2.7    2.6    2.6    2.5    2.4    2.4    2.3    2.3    2.3    2.3    2.3    2.4    2.5    2.6    2.8    2.9    3    3.2    3.4    3.6    3.8    4    4.2    4.4    4.6    4.7    4.8    4.9    4.9    5    5    5    5.1    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.2    4.2    4.2    4.2    4.1    4.1    4.1    4    4    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    4    4.1    4.2    4.3    4.5    4.7    4.8    5    5.3    5.6    5.9    6.2    6.5    6.7    6.9    7.1    7.3    7.4    7.5    7.6    7.6    7.6    7.6    7.6    7.5    7.5    7.4    7.3    7.2    7.1    7    7    6.9    6.9    6.8    6.6    6.5    6.4    6.3    6.3    6.2    6.2    6.1    6.1    6    5.9    5.8    5.7    5.7    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.5    5.4    5.5    5.6    5.9    6    6    5.9    6
Boston-Cambridge-Quincy, MA-NH Met NECTA    2.8    2.7    2.7    2.6    2.6    2.5    2.5    2.5    2.4    2.4    2.5    2.5    2.6    2.8    2.9    3.1    3.2    3.4    3.6    3.8    4.1    4.3    4.5    4.7    4.9    5    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.7    5.8    5.8    5.9    5.8    5.8    5.7    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5    4.9    4.9    4.8    4.7    4.7    4.6    4.6    4.6    4.6    4.5    4.5    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.2    4.3    4.4    4.5    4.7    4.9    5.1    5.3    5.5    5.8    6.1    6.5    6.8    7.1    7.3    7.5    7.7    7.8    7.9    8    8    8    8    8    7.9    7.9    7.8    7.6    7.5    7.4    7.3    7.3    7.2    7.2    7.1    6.9    6.8    6.8    6.7    6.6    6.6    6.6    6.5    6.5    6.4    6.3    6.2    6.1    6.1    6.1    6    6    6.1    6.1    6.1    6.1    6.1    6.1    6.1    6.1    5.9    5.9    5.9    6    6.3    6.3    6.3    6.2    6.3
Brockton-Bridgewater-Easton, MA NECTA Div    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.8    2.8    2.9    2.9    3.1    3.2    3.3    3.4    3.5    3.6    3.8    3.9    4.1    4.3    4.4    4.6    4.8    4.9    5    5.1    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.7    5.8    5.9    6    6.1    6.2    6.2    6.3    6.2    6.2    6.1    6.1    6    5.9    5.9    5.9    5.8    5.7    5.7    5.6    5.5    5.5    5.4    5.4    5.4    5.3    5.3    5.3    5.2    5.2    5.2    5.3    5.3    5.4    5.3    5.3    5.3    5.2    5.2    5.3    5.3    5.3    5.4    5.3    5.3    5.3    5.3    5.2    5.2    5.1    5.1    5.1    5    5    5    5    5    5.1    5.1    5.1    5.2    5.2    5.3    5.4    5.6    5.8    6    6.2    6.5    6.8    7.1    7.5    7.9    8.2    8.5    8.7    8.9    9.1    9.3    9.5    9.6    9.7    9.8    9.9    9.9    9.9    9.9    9.8    9.6    9.5    9.4    9.4    9.3    9.3    9.2    9.1    9    8.8    8.7    8.6    8.5    8.5    8.4    8.4    8.3    8.2    8.1    7.9    7.8    7.7    7.7    7.7    7.7    7.7    7.7    7.6    7.5    7.5    7.5    7.4    7.4    7.2    7.1    7.2    7.4    7.8    7.9    7.9    7.7    7.8
Camden, NJ Met Div    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.5    3.6    3.6    3.6    3.5    3.5    3.5    3.5    3.6    3.7    3.8    3.9    4.1    4.3    4.5    4.6    4.8    5    5.1    5.2    5.3    5.4    5.4    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5.1    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.2    4.1    4.2    4.3    4.4    4.5    4.6    4.7    4.7    4.7    4.7    4.8    4.8    4.9    4.8    4.8    4.7    4.6    4.5    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.7    4.8    4.8    4.9    5.1    5.2    5.4    5.7    5.9    6.3    6.7    7.1    7.6    8    8.4    8.7    9    9.2    9.4    9.6    9.7    9.9    10    10.1    10.2    10.2    10.2    10.1    10    10    9.9    9.9    10    10    10    10    9.9    9.8    9.7    9.7    9.7    9.8    9.8    9.9    9.8    9.8    9.7    9.7    9.6    9.7    9.8    9.9    10    10    10.1    10.1    10.1    10.1    10.1    10.1    9.9    9.7    9.4    9.1    9    9    8.8    8.7    8.7    8.6
Chicago-Joliet-Naperville, IL Met Div    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.7    4.9    5.1    5.3    5.4    5.4    5.4    5.4    5.5    5.6    5.8    6    6.2    6.4    6.6    6.7    6.8    6.9    7    7    7    7    7    7    7    6.9    6.9    6.8    6.8    6.9    7    7.1    7.2    7.2    7.1    7    6.8    6.6    6.5    6.4    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.2    6.2    6.1    6    5.8    5.7    5.5    5.3    5.1    4.9    4.7    4.5    4.5    4.4    4.4    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.6    4.7    4.8    4.9    5    5.1    5.1    5.2    5.2    5.2    5.2    5.3    5.4    5.6    5.9    6.1    6.3    6.4    6.5    6.9    7.1    7.4    7.9    8.5    9.1    9.5    9.9    10.2    10.4    10.7    10.9    11.1    11.2    11.3    11.2    11.1    10.9    10.7    10.5    10.4    10.2    10.1    10    9.9    9.7    9.5    9.4    9.3    9.4    9.6    9.8    10.2    10.4    10.5    10.5    10.3    9.9    9.5    9.2    8.9    8.8    8.7    8.8    8.9    8.9    8.9    8.9    8.9    8.9    8.9    9    9.4    9.5    9.4    9.3    9.4    9.4    9.4    9.3    9.1
Chicago-Joliet-Naperville, IL-IN-WI MSA    4.1    4.2    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.9    5    5.1    5.1    5.2    5.2    5.3    5.5    5.7    5.9    6.1    6.3    6.5    6.6    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.8    6.8    6.7    6.7    6.7    6.6    6.7    6.8    6.9    7    7    6.9    6.8    6.7    6.5    6.4    6.3    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.1    6.1    6.1    6    5.9    5.8    5.8    5.6    5.5    5.3    5.1    4.9    4.7    4.6    4.5    4.4    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.6    4.7    4.7    4.8    4.9    5    5.1    5.2    5.3    5.3    5.3    5.3    5.4    5.6    5.8    6    6.2    6.3    6.5    6.8    7.1    7.6    8.1    8.7    9.2    9.7    10    10.2    10.3    10.5    10.7    10.9    11.1    11.3    11.3    11.3    11.1    10.9    10.6    10.4    10.2    10    9.9    9.8    9.7    9.6    9.5    9.4    9.5    9.6    9.8    10    10.2    10.2    10.1    10    9.7    9.5    9.2    9    8.9    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    9.1    9.6    9.7    9.6    9.4    9.4    9.3    9.2    9    8.8
Dallas-Fort Worth-Arlington, TX MSA    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4    4.2    4.5    4.7    5    5.3    5.6    5.9    6.1    6.3    6.4    6.5    6.5    6.5    6.5    6.5    6.5    6.5    6.6    6.6    6.7    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.7    5.7    5.7    5.7    5.7    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5.1    5.1    5.1    5    5    4.9    4.9    4.9    4.9    4.9    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.8    4.9    5.1    5.4    5.6    6    6.3    6.6    6.9    7.2    7.4    7.6    7.8    8    8.1    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.2    8.2    8.2    8.1    8    8    7.9    7.9    7.9    7.9    7.9    7.8    7.6    7.4    7.3    7.1    7    7    6.9    6.9    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.2    6.2    6.3    6.3    6.4    6.3    6.2    6    6    6
Dallas-Plano-Irving, TX Met Div    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4.1    4.3    4.6    4.9    5.2    5.5    5.9    6.2    6.4    6.5    6.7    6.7    6.7    6.8    6.8    6.7    6.7    6.7    6.8    6.8    6.9    6.9    6.9    7    7    7    7    6.9    6.9    6.7    6.6    6.4    6.3    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.8    5.8    5.8    5.7    5.6    5.6    5.4    5.3    5.2    5.2    5.1    5.1    5.1    5.1    5.1    5.1    5    5    5    5    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.6    4.7    4.8    5    5.2    5.5    5.7    6.1    6.4    6.7    7    7.2    7.5    7.7    7.9    8    8.1    8.2    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.1    8.2    8.1    8.1    8    8    8    8    8    8    7.9    7.8    7.7    7.5    7.3    7.2    7.1    7.1    7    7    6.9    6.8    6.6    6.5    6.3    6.2    6.1    6.2    6.3    6.3    6.3    6.4    6.4    6.2    6.1    6    6
Detroit-Livonia-Dearborn, MI Met Div    4.1    4.1    4.2    4.2    4.3    4.3    4.3    4.3    4.4    4.5    4.7    5    5.3    5.6    5.7    5.7    5.7    5.7    5.8    6    6.3    6.7    7    7.2    7.3    7.3    7.3    7.3    7.2    7.2    7.1    7.1    7.1    7.3    7.5    7.8    8.1    8.4    8.6    8.7    8.8    8.8    8.7    8.7    8.6    8.4    8.3    8.2    8.1    8.1    8.2    8.3    8.4    8.5    8.7    8.8    9    9.1    9.1    9.1    9.1    9    8.9    8.8    8.7    8.6    8.5    8.4    8.4    8.5    8.5    8.4    8.3    8.2    8.2    8.1    8.2    8.3    8.4    8.5    8.6    8.7    8.6    8.5    8.4    8.3    8.3    8.3    8.4    8.6    8.7    8.9    9    9    8.9    8.8    8.7    8.6    8.7    8.8    9.1    9.4    9.7    10    10.5    11.1    11.9    12.7    13.7    14.5    15.3    15.9    16.3    16.7    16.9    17    16.9    16.7    16.6    16.4    16.2    16    15.7    15.4    15.1    14.8    14.5    14.3    14.1    14    13.7    13.5    13.2    13    12.9    12.9    12.9    12.9    12.8    12.7    12.4    12.2    11.9    11.7    11.5    11.4    11.4    11.4    11.5    11.6    11.7    11.7    11.8    11.8    11.9    12    12    11.8    11.4    11    10.7    10.7    10.5    10.5    10.5    10.4
nemployment.csv 
name    2000-01    2000-02    2000-03    2000-04    2000-05    2000-06    2000-07    2000-08    2000-09    2000-10    2000-11    2000-12    2001-01    2001-02    2001-03    2001-04    2001-05    2001-06    2001-07    2001-08    2001-09    2001-10    2001-11    2001-12    2002-01    2002-02    2002-03    2002-04    2002-05    2002-06    2002-07    2002-08    2002-09    2002-10    2002-11    2002-12    2003-01    2003-02    2003-03    2003-04    2003-05    2003-06    2003-07    2003-08    2003-09    2003-10    2003-11    2003-12    2004-01    2004-02    2004-03    2004-04    2004-05    2004-06    2004-07    2004-08    2004-09    2004-10    2004-11    2004-12    2005-01    2005-02    2005-03    2005-04    2005-05    2005-06    2005-07    2005-08    2005-09    2005-10    2005-11    2005-12    2006-01    2006-02    2006-03    2006-04    2006-05    2006-06    2006-07    2006-08    2006-09    2006-10    2006-11    2006-12    2007-01    2007-02    2007-03    2007-04    2007-05    2007-06    2007-07    2007-08    2007-09    2007-10    2007-11    2007-12    2008-01    2008-02    2008-03    2008-04    2008-05    2008-06    2008-07    2008-08    2008-09    2008-10    2008-11    2008-12    2009-01    2009-02    2009-03    2009-04    2009-05    2009-06    2009-07    2009-08    2009-09    2009-10    2009-11    2009-12    2010-01    2010-02    2010-03    2010-04    2010-05    2010-06    2010-07    2010-08    2010-09    2010-10    2010-11    2010-12    2011-01    2011-02    2011-03    2011-04    2011-05    2011-06    2011-07    2011-08    2011-09    2011-10    2011-11    2011-12    2012-01    2012-02    2012-03    2012-04    2012-05    2012-06    2012-07    2012-08    2012-09    2012-10    2012-11    2012-12    2013-01    2013-02    2013-03    2013-04    2013-05    2013-06    2013-07    2013-08    2013-09    2013-10
Bethesda-Rockville-Frederick, MD Met Div    2.6    2.6    2.6    2.6    2.7    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.7    2.7    2.8    2.8    2.9    3    3.1    3.3    3.4    3.5    3.5    3.6    3.6    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.3    3.3    3.3    3.3    3.3    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.3    3.3    3.3    3.3    3.2    3.2    3.1    3.1    3    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.9    3    3    3    2.9    2.9    2.9    2.9    2.8    2.8    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.6    2.6    2.5    2.5    2.6    2.7    2.8    2.9    3.1    3.2    3.4    3.6    3.9    4.2    4.5    4.9    5.2    5.5    5.7    5.8    5.9    6    6    6.1    6.2    6.2    6.3    6.3    6.3    6.2    6.1    6    5.9    5.9    5.9    5.9    5.9    5.8    5.8    5.7    5.6    5.5    5.5    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.4    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.2    5.2    5.2    5.2    5.2    5.2    5.1    5.2    5.3    5.5    5.5    5.3    5.2    5.2
Boston-Cambridge-Quincy, MA NECTA Div    2.7    2.6    2.6    2.5    2.4    2.4    2.3    2.3    2.3    2.3    2.3    2.4    2.5    2.6    2.8    2.9    3    3.2    3.4    3.6    3.8    4    4.2    4.4    4.6    4.7    4.8    4.9    4.9    5    5    5    5.1    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.2    4.2    4.2    4.2    4.1    4.1    4.1    4    4    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    4    4.1    4.2    4.3    4.5    4.7    4.8    5    5.3    5.6    5.9    6.2    6.5    6.7    6.9    7.1    7.3    7.4    7.5    7.6    7.6    7.6    7.6    7.6    7.5    7.5    7.4    7.3    7.2    7.1    7    7    6.9    6.9    6.8    6.6    6.5    6.4    6.3    6.3    6.2    6.2    6.1    6.1    6    5.9    5.8    5.7    5.7    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.5    5.4    5.5    5.6    5.9    6    6    5.9    6
Boston-Cambridge-Quincy, MA-NH Met NECTA    2.8    2.7    2.7    2.6    2.6    2.5    2.5    2.5    2.4    2.4    2.5    2.5    2.6    2.8    2.9    3.1    3.2    3.4    3.6    3.8    4.1    4.3    4.5    4.7    4.9    5    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.7    5.8    5.8    5.9    5.8    5.8    5.7    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5    4.9    4.9    4.8    4.7    4.7    4.6    4.6    4.6    4.6    4.5    4.5    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.2    4.3    4.4    4.5    4.7    4.9    5.1    5.3    5.5    5.8    6.1    6.5    6.8    7.1    7.3    7.5    7.7    7.8    7.9    8    8    8    8    8    7.9    7.9    7.8    7.6    7.5    7.4    7.3    7.3    7.2    7.2    7.1    6.9    6.8    6.8    6.7    6.6    6.6    6.6    6.5    6.5    6.4    6.3    6.2    6.1    6.1    6.1    6    6    6.1    6.1    6.1    6.1    6.1    6.1    6.1    6.1    5.9    5.9    5.9    6    6.3    6.3    6.3    6.2    6.3
Brockton-Bridgewater-Easton, MA NECTA Div    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.8    2.8    2.9    2.9    3.1    3.2    3.3    3.4    3.5    3.6    3.8    3.9    4.1    4.3    4.4    4.6    4.8    4.9    5    5.1    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.7    5.8    5.9    6    6.1    6.2    6.2    6.3    6.2    6.2    6.1    6.1    6    5.9    5.9    5.9    5.8    5.7    5.7    5.6    5.5    5.5    5.4    5.4    5.4    5.3    5.3    5.3    5.2    5.2    5.2    5.3    5.3    5.4    5.3    5.3    5.3    5.2    5.2    5.3    5.3    5.3    5.4    5.3    5.3    5.3    5.3    5.2    5.2    5.1    5.1    5.1    5    5    5    5    5    5.1    5.1    5.1    5.2    5.2    5.3    5.4    5.6    5.8    6    6.2    6.5    6.8    7.1    7.5    7.9    8.2    8.5    8.7    8.9    9.1    9.3    9.5    9.6    9.7    9.8    9.9    9.9    9.9    9.9    9.8    9.6    9.5    9.4    9.4    9.3    9.3    9.2    9.1    9    8.8    8.7    8.6    8.5    8.5    8.4    8.4    8.3    8.2    8.1    7.9    7.8    7.7    7.7    7.7    7.7    7.7    7.7    7.6    7.5    7.5    7.5    7.4    7.4    7.2    7.1    7.2    7.4    7.8    7.9    7.9    7.7    7.8
Camden, NJ Met Div    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.5    3.6    3.6    3.6    3.5    3.5    3.5    3.5    3.6    3.7    3.8    3.9    4.1    4.3    4.5    4.6    4.8    5    5.1    5.2    5.3    5.4    5.4    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5.1    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.2    4.1    4.2    4.3    4.4    4.5    4.6    4.7    4.7    4.7    4.7    4.8    4.8    4.9    4.8    4.8    4.7    4.6    4.5    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.7    4.8    4.8    4.9    5.1    5.2    5.4    5.7    5.9    6.3    6.7    7.1    7.6    8    8.4    8.7    9    9.2    9.4    9.6    9.7    9.9    10    10.1    10.2    10.2    10.2    10.1    10    10    9.9    9.9    10    10    10    10    9.9    9.8    9.7    9.7    9.7    9.8    9.8    9.9    9.8    9.8    9.7    9.7    9.6    9.7    9.8    9.9    10    10    10.1    10.1    10.1    10.1    10.1    10.1    9.9    9.7    9.4    9.1    9    9    8.8    8.7    8.7    8.6
Chicago-Joliet-Naperville, IL Met Div    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.7    4.9    5.1    5.3    5.4    5.4    5.4    5.4    5.5    5.6    5.8    6    6.2    6.4    6.6    6.7    6.8    6.9    7    7    7    7    7    7    7    6.9    6.9    6.8    6.8    6.9    7    7.1    7.2    7.2    7.1    7    6.8    6.6    6.5    6.4    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.2    6.2    6.1    6    5.8    5.7    5.5    5.3    5.1    4.9    4.7    4.5    4.5    4.4    4.4    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.6    4.7    4.8    4.9    5    5.1    5.1    5.2    5.2    5.2    5.2    5.3    5.4    5.6    5.9    6.1    6.3    6.4    6.5    6.9    7.1    7.4    7.9    8.5    9.1    9.5    9.9    10.2    10.4    10.7    10.9    11.1    11.2    11.3    11.2    11.1    10.9    10.7    10.5    10.4    10.2    10.1    10    9.9    9.7    9.5    9.4    9.3    9.4    9.6    9.8    10.2    10.4    10.5    10.5    10.3    9.9    9.5    9.2    8.9    8.8    8.7    8.8    8.9    8.9    8.9    8.9    8.9    8.9    8.9    9    9.4    9.5    9.4    9.3    9.4    9.4    9.4    9.3    9.1
Chicago-Joliet-Naperville, IL-IN-WI MSA    4.1    4.2    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.9    5    5.1    5.1    5.2    5.2    5.3    5.5    5.7    5.9    6.1    6.3    6.5    6.6    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.8    6.8    6.7    6.7    6.7    6.6    6.7    6.8    6.9    7    7    6.9    6.8    6.7    6.5    6.4    6.3    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.1    6.1    6.1    6    5.9    5.8    5.8    5.6    5.5    5.3    5.1    4.9    4.7    4.6    4.5    4.4    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.6    4.7    4.7    4.8    4.9    5    5.1    5.2    5.3    5.3    5.3    5.3    5.4    5.6    5.8    6    6.2    6.3    6.5    6.8    7.1    7.6    8.1    8.7    9.2    9.7    10    10.2    10.3    10.5    10.7    10.9    11.1    11.3    11.3    11.3    11.1    10.9    10.6    10.4    10.2    10    9.9    9.8    9.7    9.6    9.5    9.4    9.5    9.6    9.8    10    10.2    10.2    10.1    10    9.7    9.5    9.2    9    8.9    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    9.1    9.6    9.7    9.6    9.4    9.4    9.3    9.2    9    8.8
Dallas-Fort Worth-Arlington, TX MSA    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4    4.2    4.5    4.7    5    5.3    5.6    5.9    6.1    6.3    6.4    6.5    6.5    6.5    6.5    6.5    6.5    6.5    6.6    6.6    6.7    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.7    5.7    5.7    5.7    5.7    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5.1    5.1    5.1    5    5    4.9    4.9    4.9    4.9    4.9    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.8    4.9    5.1    5.4    5.6    6    6.3    6.6    6.9    7.2    7.4    7.6    7.8    8    8.1    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.2    8.2    8.2    8.1    8    8    7.9    7.9    7.9    7.9    7.9    7.8    7.6    7.4    7.3    7.1    7    7    6.9    6.9    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.2    6.2    6.3    6.3    6.4    6.3    6.2    6    6    6
Dallas-Plano-Irving, TX Met Div    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4.1    4.3    4.6    4.9    5.2    5.5    5.9    6.2    6.4    6.5    6.7    6.7    6.7    6.8    6.8    6.7    6.7    6.7    6.8    6.8    6.9    6.9    6.9    7    7    7    7    6.9    6.9    6.7    6.6    6.4    6.3    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.8    5.8    5.8    5.7    5.6    5.6    5.4    5.3    5.2    5.2    5.1    5.1    5.1    5.1    5.1    5.1    5    5    5    5    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.6    4.7    4.8    5    5.2    5.5    5.7    6.1    6.4    6.7    7    7.2    7.5    7.7    7.9    8    8.1    8.2    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.1    8.2    8.1    8.1    8    8    8    8    8    8    7.9    7.8    7.7    7.5    7.3    7.2    7.1    7.1    7    7    6.9    6.8    6.6    6.5    6.3    6.2    6.1    6.2    6.3    6.3    6.3    6.4    6.4    6.2    6.1    6    6
Detroit-Livonia-Dearborn, MI Met Div    4.1    4.1    4.2    4.2    4.3    4.3    4.3    4.3    4.4    4.5    4.7    5    5.3    5.6    5.7    5.7    5.7    5.7    5.8    6    6.3    6.7    7    7.2    7.3    7.3    7.3    7.3    7.2    7.2    7.1    7.1    7.1    7.3    7.5    7.8    8.1    8.4    8.6    8.7    8.8    8.8    8.7    8.7    8.6    8.4    8.3    8.2    8.1    8.1    8.2    8.3    8.4    8.5    8.7    8.8    9    9.1    9.1    9.1    9.1    9    8.9    8.8    8.7    8.6    8.5    8.4    8.4    8.5    8.5    8.4    8.3    8.2    8.2    8.1    8.2    8.3    8.4    8.5    8.6    8.7    8.6    8.5    8.4    8.3    8.3    8.3    8.4    8.6    8.7    8.9    9    9    8.9    8.8    8.7    8.6    8.7    8.8    9.1    9.4    9.7    10    10.5    11.1    11.9    12.7    13.7    14.5    15.3    15.9    16.3    16.7    16.9    17    16.9    16.7    16.6    16.4    16.2    16    15.7    15.4    15.1    14.8    14.5    14.3    14.1    14    13.7    13.5    13.2    13    12.9    12.9    12.9    12.9    12.8    12.7    12.4    12.2    11.9    11.7    11.5    11.4    11.4    11.4    11.5    11.6    11.7    11.7    11.8    11.8    11.9    12    12    11.8    11.4    11    10.7    10.7    10.5    10.5    10.5    10.4

如下图所示，在浏览器直接打开，，在chrome中测试上面的代码，控制台会报如下错误：

d3.v4.min.js:2 Access to XMLHttpRequest at 'file:///C:/Users/volod/Desktop/D3.js%E5%8A%A0%E8%BD%BDcsv%E6%95%B0%E6%8D%AE/nemployment.tsv' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

这是因为安全机制禁止了cross origin request，不允许直接读取本地文件, 所以我们需要一个webserver来server我们的数据

2.VS Code在本地进行调试和打开本地服务器

<1>在扩展中搜索插件 Debugger for Chrome 进行安装。

<2>配置launch.json文件，根据步骤来。file就是你在浏览器中需要运行的文件的路径。

{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

<3>配置好之后，直接使用调试是不行的，需要开启服务器。

3. npm install -g live-server安装，开启服务器

（3与4都能实现VS Code在本地进行调试和打开本地服务器，选择其中一种方法即可）

1.打开vs code制台。选择终端，在终端里输入  npm install -g live-server  进行安装.

npm install -g live-server

2.然后再输入live-server,按下回车，如下图所示：

4.在vs code中安装live server 插件

（3与4都能实现VS Code在本地进行调试和打开本地服务器，选择其中一种方法即可），如下图所示：

5.以下是使用D3 v4实现下图效果：

 index.html

  1 <!DOCTYPE html>
  2 <meta charset="utf-8">
  3 <style>
  4     .axis--y path {
  5         display: none;
  6     }
  7 
  8     .cities {
  9         fill: none;
 10         stroke-linejoin: round;
 11         stroke-linecap: round;
 12         stroke-width: 1.5px;
 13     }
 14 
 15     .focus text {
 16         text-anchor: middle;
 17         text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
 18     }
 19 
 20     .voronoi path {
 21         fill: none;
 22         pointer-events: all;
 23     }
 24 
 25     .voronoi--show path {
 26         stroke: red;
 27         stroke-opacity: 0.2;
 28     }
 29 
 30     #form {
 31         position: absolute;
 32         top: 20px;
 33         right: 30px;
 34     }
 35 </style>
 36 <svg width="960" height="500"></svg>
 37 <!-- <label id="form" for="show-voronoi">
 38     Show Voronoi
 39     <input type="checkbox" id="show-voronoi" disabled>
 40 </label> -->
 41 <script src="https://d3js.org/d3.v4.min.js"></script>
 42 <script>
 43 
 44     var months,
 45         monthKeys,
 46         monthParse = d3.timeParse("%Y-%m");
 47 
 48     var svg = d3.select("svg"),
 49         margin = { top: 20, right: 30, bottom: 30, left: 40 },
 50         width = svg.attr("width") - margin.left - margin.right,
 51         height = svg.attr("height") - margin.top - margin.bottom,
 52         g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");
 53 
 54     var x = d3.scaleTime()
 55         .range([0, width]);
 56 
 57     var y = d3.scaleLinear()
 58         .range([height, 0]);
 59 
 60     var z = d3.scaleOrdinal(d3.schemeCategory10);
 61 
 62     var voronoi = d3.voronoi()
 63         .x(function (d) { return x(d.date); })
 64         .y(function (d) { return y(d.value); })
 65         .extent([[-margin.left, -margin.top], [width + margin.right, height + margin.bottom]]);
 66 
 67     var line = d3.line()
 68         .x(function (d) { return x(d.date); })
 69         .y(function (d) { return y(d.value); });
 70 
 71     d3.tsv("nemployment.tsv", type, function (error, data) {
 72         if (error) throw error;
 73 
 74         x.domain(d3.extent(months));
 75         y.domain([0, d3.max(data, function (c) { return d3.max(c.values, function (d) { return d.value; }); })]).nice();
 76         z.domain(data.map(function (d) { return d.name; }))
 77 
 78         g.append("g")
 79             .attr("class", "axis axis--x")
 80             .attr("transform", "translate(0," + height + ")")
 81             .call(d3.axisBottom(x));
 82 
 83         g.append("g")
 84             .attr("class", "axis axis--y")
 85             .call(d3.axisLeft(y).ticks(10, "%"))
 86             .append("text")
 87             .attr("x", 4)
 88             .attr("y", 0.5)
 89             .attr("dy", "0.32em")
 90             .style("text-anchor", "start")
 91             .style("fill", "#000")
 92             .style("font-weight", "bold")
 93             .text("Unemployment Rate");
 94 
 95         g.append("g")
 96             .attr("class", "cities")
 97             .selectAll("path")
 98             .data(data)
 99             .enter().append("path")
100             .attr("d", function (d) { d.line = this; return line(d.values); })
101             .style("stroke", function (d) { return z(d.name); });
102 
103         var focus = g.append("g")
104             .attr("transform", "translate(-100,-100)")
105             .attr("class", "focus");
106 
107         focus.append("circle")
108             .attr("r", 3.5);
109 
110         focus.append("text")
111             .attr("y", -10);
112 
113         var voronoiGroup = g.append("g")
114             .attr("class", "voronoi");
115 
116         voronoiGroup.selectAll("path")
117             .data(voronoi.polygons(d3.merge(data.map(function (d) { return d.values; }))))
118             .enter().append("path")
119             .attr("d", function (d) { return d ? "M" + d.join("L") + "Z" : null; })
120             .on("mouseover", mouseover)
121             .on("mouseout", mouseout);
122 
123         d3.select("#show-voronoi")
124             .property("disabled", false)
125             .on("change", function () { voronoiGroup.classed("voronoi--show", this.checked); });
126 
127         function mouseover(d) {
128             d3.select(d.data.city.line)
129                 .style('stroke-width', 3)
130                 .style('stroke', d3.hsl(z(d.data.city.name)).brighter(1));
131 
132             d.data.city.line.parentNode.appendChild(d.data.city.line);
133             focus.attr("transform", "translate(" + x(d.data.date) + "," + y(d.data.value) + ")");
134             focus.select("text").text(d.data.city.name + ': ' + d.data.value);
135         }
136 
137         function mouseout(d) {
138             d3.select(d.data.city.line)
139                 .style("stroke-width", 1.5)
140                 .style('stroke', z(d.data.city.name));
141             focus.attr("transform", "translate(-100,-100)");
142         }
143     });
144 
145     function type(d, i, columns) {
146         if (!months) monthKeys = columns.slice(1), months = monthKeys.map(monthParse);
147         var c = { name: d.name.replace(/ (msa|necta div|met necta|met div)$/i, ""), values: null };
148         c.values = monthKeys.map(function (k, i) { return { city: c, date: months[i], value: d[k] / 100 }; });
149         return c;
150     }
151 
152 </script>
153 </body>
154 
155 </html>

nemployment.tsv

name    2000-01    2000-02    2000-03    2000-04    2000-05    2000-06    2000-07    2000-08    2000-09    2000-10    2000-11    2000-12    2001-01    2001-02    2001-03    2001-04    2001-05    2001-06    2001-07    2001-08    2001-09    2001-10    2001-11    2001-12    2002-01    2002-02    2002-03    2002-04    2002-05    2002-06    2002-07    2002-08    2002-09    2002-10    2002-11    2002-12    2003-01    2003-02    2003-03    2003-04    2003-05    2003-06    2003-07    2003-08    2003-09    2003-10    2003-11    2003-12    2004-01    2004-02    2004-03    2004-04    2004-05    2004-06    2004-07    2004-08    2004-09    2004-10    2004-11    2004-12    2005-01    2005-02    2005-03    2005-04    2005-05    2005-06    2005-07    2005-08    2005-09    2005-10    2005-11    2005-12    2006-01    2006-02    2006-03    2006-04    2006-05    2006-06    2006-07    2006-08    2006-09    2006-10    2006-11    2006-12    2007-01    2007-02    2007-03    2007-04    2007-05    2007-06    2007-07    2007-08    2007-09    2007-10    2007-11    2007-12    2008-01    2008-02    2008-03    2008-04    2008-05    2008-06    2008-07    2008-08    2008-09    2008-10    2008-11    2008-12    2009-01    2009-02    2009-03    2009-04    2009-05    2009-06    2009-07    2009-08    2009-09    2009-10    2009-11    2009-12    2010-01    2010-02    2010-03    2010-04    2010-05    2010-06    2010-07    2010-08    2010-09    2010-10    2010-11    2010-12    2011-01    2011-02    2011-03    2011-04    2011-05    2011-06    2011-07    2011-08    2011-09    2011-10    2011-11    2011-12    2012-01    2012-02    2012-03    2012-04    2012-05    2012-06    2012-07    2012-08    2012-09    2012-10    2012-11    2012-12    2013-01    2013-02    2013-03    2013-04    2013-05    2013-06    2013-07    2013-08    2013-09    2013-10
Bethesda-Rockville-Frederick, MD Met Div    2.6    2.6    2.6    2.6    2.7    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.7    2.7    2.8    2.8    2.9    3    3.1    3.3    3.4    3.5    3.5    3.6    3.6    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.4    3.3    3.3    3.3    3.3    3.3    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.2    3.3    3.3    3.3    3.3    3.2    3.2    3.1    3.1    3    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.9    3    3    3    2.9    2.9    2.9    2.9    2.8    2.8    2.7    2.7    2.6    2.6    2.6    2.6    2.6    2.6    2.6    2.5    2.5    2.6    2.7    2.8    2.9    3.1    3.2    3.4    3.6    3.9    4.2    4.5    4.9    5.2    5.5    5.7    5.8    5.9    6    6    6.1    6.2    6.2    6.3    6.3    6.3    6.2    6.1    6    5.9    5.9    5.9    5.9    5.9    5.8    5.8    5.7    5.6    5.5    5.5    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.4    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.3    5.2    5.2    5.2    5.2    5.2    5.2    5.1    5.2    5.3    5.5    5.5    5.3    5.2    5.2
Boston-Cambridge-Quincy, MA NECTA Div    2.7    2.6    2.6    2.5    2.4    2.4    2.3    2.3    2.3    2.3    2.3    2.4    2.5    2.6    2.8    2.9    3    3.2    3.4    3.6    3.8    4    4.2    4.4    4.6    4.7    4.8    4.9    4.9    5    5    5    5.1    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.3    4.2    4.2    4.2    4.2    4.1    4.1    4.1    4    4    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    3.9    4    4.1    4.2    4.3    4.5    4.7    4.8    5    5.3    5.6    5.9    6.2    6.5    6.7    6.9    7.1    7.3    7.4    7.5    7.6    7.6    7.6    7.6    7.6    7.5    7.5    7.4    7.3    7.2    7.1    7    7    6.9    6.9    6.8    6.6    6.5    6.4    6.3    6.3    6.2    6.2    6.1    6.1    6    5.9    5.8    5.7    5.7    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.6    5.5    5.4    5.5    5.6    5.9    6    6    5.9    6
Boston-Cambridge-Quincy, MA-NH Met NECTA    2.8    2.7    2.7    2.6    2.6    2.5    2.5    2.5    2.4    2.4    2.5    2.5    2.6    2.8    2.9    3.1    3.2    3.4    3.6    3.8    4.1    4.3    4.5    4.7    4.9    5    5.1    5.2    5.2    5.3    5.3    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.7    5.8    5.8    5.9    5.8    5.8    5.7    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5    4.9    4.9    4.8    4.7    4.7    4.6    4.6    4.6    4.6    4.5    4.5    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.5    4.4    4.4    4.4    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.1    4.2    4.3    4.4    4.5    4.7    4.9    5.1    5.3    5.5    5.8    6.1    6.5    6.8    7.1    7.3    7.5    7.7    7.8    7.9    8    8    8    8    8    7.9    7.9    7.8    7.6    7.5    7.4    7.3    7.3    7.2    7.2    7.1    6.9    6.8    6.8    6.7    6.6    6.6    6.6    6.5    6.5    6.4    6.3    6.2    6.1    6.1    6.1    6    6    6.1    6.1    6.1    6.1    6.1    6.1    6.1    6.1    5.9    5.9    5.9    6    6.3    6.3    6.3    6.2    6.3
Brockton-Bridgewater-Easton, MA NECTA Div    3    3    2.9    2.9    2.8    2.8    2.8    2.8    2.8    2.8    2.9    2.9    3.1    3.2    3.3    3.4    3.5    3.6    3.8    3.9    4.1    4.3    4.4    4.6    4.8    4.9    5    5.1    5.2    5.3    5.3    5.4    5.4    5.5    5.6    5.6    5.7    5.8    5.9    6    6.1    6.2    6.2    6.3    6.2    6.2    6.1    6.1    6    5.9    5.9    5.9    5.8    5.7    5.7    5.6    5.5    5.5    5.4    5.4    5.4    5.3    5.3    5.3    5.2    5.2    5.2    5.3    5.3    5.4    5.3    5.3    5.3    5.2    5.2    5.3    5.3    5.3    5.4    5.3    5.3    5.3    5.3    5.2    5.2    5.1    5.1    5.1    5    5    5    5    5    5.1    5.1    5.1    5.2    5.2    5.3    5.4    5.6    5.8    6    6.2    6.5    6.8    7.1    7.5    7.9    8.2    8.5    8.7    8.9    9.1    9.3    9.5    9.6    9.7    9.8    9.9    9.9    9.9    9.9    9.8    9.6    9.5    9.4    9.4    9.3    9.3    9.2    9.1    9    8.8    8.7    8.6    8.5    8.5    8.4    8.4    8.3    8.2    8.1    7.9    7.8    7.7    7.7    7.7    7.7    7.7    7.7    7.6    7.5    7.5    7.5    7.4    7.4    7.2    7.1    7.2    7.4    7.8    7.9    7.9    7.7    7.8
Camden, NJ Met Div    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.5    3.6    3.6    3.6    3.5    3.5    3.5    3.5    3.6    3.7    3.8    3.9    4.1    4.3    4.5    4.6    4.8    5    5.1    5.2    5.3    5.4    5.4    5.4    5.4    5.5    5.5    5.5    5.6    5.6    5.6    5.5    5.6    5.6    5.6    5.6    5.5    5.4    5.3    5.2    5.2    5.1    5.1    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.2    4.1    4.2    4.3    4.4    4.5    4.6    4.7    4.7    4.7    4.7    4.8    4.8    4.9    4.8    4.8    4.7    4.6    4.5    4.4    4.3    4.3    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.7    4.8    4.8    4.9    5.1    5.2    5.4    5.7    5.9    6.3    6.7    7.1    7.6    8    8.4    8.7    9    9.2    9.4    9.6    9.7    9.9    10    10.1    10.2    10.2    10.2    10.1    10    10    9.9    9.9    10    10    10    10    9.9    9.8    9.7    9.7    9.7    9.8    9.8    9.9    9.8    9.8    9.7    9.7    9.6    9.7    9.8    9.9    10    10    10.1    10.1    10.1    10.1    10.1    10.1    9.9    9.7    9.4    9.1    9    9    8.8    8.7    8.7    8.6
Chicago-Joliet-Naperville, IL Met Div    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.5    4.5    4.5    4.7    4.9    5.1    5.3    5.4    5.4    5.4    5.4    5.5    5.6    5.8    6    6.2    6.4    6.6    6.7    6.8    6.9    7    7    7    7    7    7    7    6.9    6.9    6.8    6.8    6.9    7    7.1    7.2    7.2    7.1    7    6.8    6.6    6.5    6.4    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.3    6.2    6.2    6.1    6    5.8    5.7    5.5    5.3    5.1    4.9    4.7    4.5    4.5    4.4    4.4    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.6    4.7    4.8    4.9    5    5.1    5.1    5.2    5.2    5.2    5.2    5.3    5.4    5.6    5.9    6.1    6.3    6.4    6.5    6.9    7.1    7.4    7.9    8.5    9.1    9.5    9.9    10.2    10.4    10.7    10.9    11.1    11.2    11.3    11.2    11.1    10.9    10.7    10.5    10.4    10.2    10.1    10    9.9    9.7    9.5    9.4    9.3    9.4    9.6    9.8    10.2    10.4    10.5    10.5    10.3    9.9    9.5    9.2    8.9    8.8    8.7    8.8    8.9    8.9    8.9    8.9    8.9    8.9    8.9    9    9.4    9.5    9.4    9.3    9.4    9.4    9.4    9.3    9.1
Chicago-Joliet-Naperville, IL-IN-WI MSA    4.1    4.2    4.2    4.2    4.3    4.3    4.3    4.4    4.4    4.5    4.6    4.7    4.9    5    5.1    5.1    5.2    5.2    5.3    5.5    5.7    5.9    6.1    6.3    6.5    6.6    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.8    6.8    6.7    6.7    6.7    6.6    6.7    6.8    6.9    7    7    6.9    6.8    6.7    6.5    6.4    6.3    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.2    6.1    6.1    6.1    6    5.9    5.8    5.8    5.6    5.5    5.3    5.1    4.9    4.7    4.6    4.5    4.4    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.6    4.7    4.7    4.8    4.9    5    5.1    5.2    5.3    5.3    5.3    5.3    5.4    5.6    5.8    6    6.2    6.3    6.5    6.8    7.1    7.6    8.1    8.7    9.2    9.7    10    10.2    10.3    10.5    10.7    10.9    11.1    11.3    11.3    11.3    11.1    10.9    10.6    10.4    10.2    10    9.9    9.8    9.7    9.6    9.5    9.4    9.5    9.6    9.8    10    10.2    10.2    10.1    10    9.7    9.5    9.2    9    8.9    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    8.8    9.1    9.6    9.7    9.6    9.4    9.4    9.3    9.2    9    8.8
Dallas-Fort Worth-Arlington, TX MSA    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4    4.2    4.5    4.7    5    5.3    5.6    5.9    6.1    6.3    6.4    6.5    6.5    6.5    6.5    6.5    6.5    6.5    6.6    6.6    6.7    6.7    6.7    6.8    6.8    6.8    6.8    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.7    5.7    5.7    5.7    5.7    5.6    5.6    5.5    5.4    5.3    5.2    5.1    5.1    5.1    5.1    5.1    5    5    4.9    4.9    4.9    4.9    4.9    4.9    4.9    4.8    4.7    4.6    4.5    4.5    4.4    4.4    4.3    4.3    4.2    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.4    4.4    4.5    4.6    4.8    4.9    5.1    5.4    5.6    6    6.3    6.6    6.9    7.2    7.4    7.6    7.8    8    8.1    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.2    8.2    8.2    8.1    8    8    7.9    7.9    7.9    7.9    7.9    7.8    7.6    7.4    7.3    7.1    7    7    6.9    6.9    6.8    6.7    6.6    6.4    6.3    6.2    6.1    6.2    6.2    6.3    6.3    6.4    6.3    6.2    6    6    6
Dallas-Plano-Irving, TX Met Div    3.7    3.7    3.7    3.7    3.6    3.6    3.6    3.6    3.5    3.5    3.4    3.4    3.5    3.6    3.8    4.1    4.3    4.6    4.9    5.2    5.5    5.9    6.2    6.4    6.5    6.7    6.7    6.7    6.8    6.8    6.7    6.7    6.7    6.8    6.8    6.9    6.9    6.9    7    7    7    7    6.9    6.9    6.7    6.6    6.4    6.3    6.3    6.2    6.1    6.1    6    5.9    5.9    5.8    5.8    5.8    5.8    5.7    5.6    5.6    5.4    5.3    5.2    5.2    5.1    5.1    5.1    5.1    5.1    5.1    5    5    5    5    5    5    4.9    4.8    4.7    4.6    4.5    4.4    4.4    4.3    4.3    4.3    4.2    4.2    4.3    4.3    4.4    4.4    4.4    4.4    4.5    4.5    4.5    4.6    4.7    4.8    5    5.2    5.5    5.7    6.1    6.4    6.7    7    7.2    7.5    7.7    7.9    8    8.1    8.2    8.2    8.2    8.3    8.3    8.3    8.3    8.3    8.2    8.1    8.1    8.1    8.1    8.1    8.2    8.1    8.1    8    8    8    8    8    8    7.9    7.8    7.7    7.5    7.3    7.2    7.1    7.1    7    7    6.9    6.8    6.6    6.5    6.3    6.2    6.1    6.2    6.3    6.3    6.3    6.4    6.4    6.2    6.1    6    6
Detroit-Livonia-Dearborn, MI Met Div    4.1    4.1    4.2    4.2    4.3    4.3    4.3    4.3    4.4    4.5    4.7    5    5.3    5.6    5.7    5.7    5.7    5.7    5.8    6    6.3    6.7    7    7.2    7.3    7.3    7.3    7.3    7.2    7.2    7.1    7.1    7.1    7.3    7.5    7.8    8.1    8.4    8.6    8.7    8.8    8.8    8.7    8.7    8.6    8.4    8.3    8.2    8.1    8.1    8.2    8.3    8.4    8.5    8.7    8.8    9    9.1    9.1    9.1    9.1    9    8.9    8.8    8.7    8.6    8.5    8.4    8.4    8.5    8.5    8.4    8.3    8.2    8.2    8.1    8.2    8.3    8.4    8.5    8.6    8.7    8.6    8.5    8.4    8.3    8.3    8.3    8.4    8.6    8.7    8.9    9    9    8.9    8.8    8.7    8.6    8.7    8.8    9.1    9.4    9.7    10    10.5    11.1    11.9    12.7    13.7    14.5    15.3    15.9    16.3    16.7    16.9    17    16.9    16.7    16.6    16.4    16.2    16    15.7    15.4    15.1    14.8    14.5    14.3    14.1    14    13.7    13.5    13.2    13    12.9    12.9    12.9    12.9    12.8    12.7    12.4    12.2    11.9    11.7    11.5    11.4    11.4    11.4    11.5    11.6    11.7    11.7    11.8    11.8    11.9    12    12    11.8    11.4    11    10.7    10.7    10.5    10.5    10.5    10.4

如上所述，运行即可

转载于:https://www.cnblogs.com/volodya/p/11296620.html

weixin_30535913
关注
D3进阶--读取csv文件
ban2413的博客
12-23 6167
在 D3.js 中提供了 d3.csv() 函数来读取 CSV 文件。函数 API 可参见：https://github.com/mbostock/d3/wiki/CSV d3.csv("table.csv",function(error,csvdata){ if(error){ console.log(error); } ...
d3.js读取csv和tsv文件
qq_41700374的博客
10-24 3165
1. CSV格式是什么 CSV使用逗号分隔值，它是以纯文本形式存储表格数据的，每个单元格之间用逗号分隔。 在d3.js中读取csv文件： d3.csv("table.csv", function(error, csvdata){ if(error){ console.log(error) } console.log(csvdata) })...
【D3使用教程】(1) 开始 | 加载数据
前端进阶之路 | 中大厂、外企、国企内推 | 面试培训 | 简历修改
12-21 3430
一、数据 （1）引言 在可视化编程的语境下，数据保存在数字化文件中，一般是文本格式或二进制格式。当然，并不是只有文本内容才算数据，那些表示图像、音频、视频、数据库、流、模型、文档等一切比特和字节也是数据。 对于D3和浏览器可视化的角度来说，我们只讨论文本数据。即那些可以表现为数值或字符串的东西。如果你可以把数据保存到.txt纯文本文件，或者.csv逗号分隔值文件，或者.json文件，那么...
D3 CSV表格文件的读取详解
hsany330的专栏
06-07 6180
前言 之前在入门系列的教程中，我们常用d3.json()函数来读取 json 格式的文件。json 格式很强大，但对于普通用户可能不太适合，普通用户更喜欢的是用 Microsoft Excel 或 OpenOffice Calc 等生成的表格文件，因为简单易懂，容易编辑。 Microsoft Excel 通常会保存为 xls 格式， OpenOffice Calc 通常会保存为 ods 格式。这些格式作为表格文件来说都很强大，但要读取它们是有些麻烦的，D3 中也没有提供这样的方法。但是表格软件都会支..
用d3读取csv再打印到html,在D3中读取CSV文件
weixin_35502466的博客
06-25 475
我正在尝试阅读"employee.csv"的简单CSV文件：Name, AgeJanik, 24Jakob, 45Anna, 30Niklas, 35我必须尝试此"employee.csv"文件的D3脚本如下：Loading CSV file in D3d3.csv("./employee.csv", function(data){for(var i = 0; i < data.length...
D3.js进阶系列之CSV表格文件的读取详解
10-19
D3.js支持从外部读取数据进行图形交互(Loading External Resources)，支持的格式有CSV、txt、Html、tsv、xml文本文件和JSON XML数据结构，下面这篇文章主要给大家介绍了D3.js中CSV表格文件读取的相关资料，需要的...
d3.js v5 数据加载
X01动力装甲的专栏
01-22 637
d3.js v5 数据加载 d3提供了几种数据加载的方式： d3.csv() d3.json() d3.tsv() d3.xml() d3.js 数据加载在 v5 版本之后有重大的变化： D3现在使用Promises而不是异步回调来加载数据。Promises简化了异步代码的结构，尤其是在支持async和await的现代浏览器中。 Changes in D3 5.0 Released March 22, 2018. D3 5.0 introduces only a few non-backwards-c
d3.js示范代码，很多很多，很好用
05-31
通过`d3.csv()`或`d3.json()`等函数加载数据，然后使用`selectAll()`和`data()`方法将数据绑定到选择的元素上。 2. **选择集（Selections）** D3.js的选择集允许开发者操作一组DOM元素。例如，`d3.select()`和`d3....
使用 d3.js 对世界杯数据集进行数据可视化。.zip
最新发布
01-03
首先，我们需要导入数据文件，可以使用d3.dsvFormat()或d3.csv()等函数解析CSV或TSV数据，d3.json()则用于解析JSON数据。然后，我们可以利用d3.scaleLinear()或d3.scaleBand()等函数设置数据的尺度，以便映射到图表...
用d3读取csv再打印到html,在D3中加载CSV文件(Loading a CSV file in D3)
weixin_39653766的博客
06-25 773
在D3中加载CSV文件(Loading a CSV file in D3)加载csv文件时d3存在问题。 它给了我以下错误1)GET http://d3js.org/d3.v.min.js 2)未捕获的ReferenceError：未定义d3(匿名函数)D3 total practice d3.csv("sampath.csv",function(data1){});There is proble...
react中使用d3.csv()
qq_34705819的博客
02-21 818
步骤： 1.安装d3js 默认安装最新版本 npm install --save d3 2.组件中引入d3 import * as d3 from "d3" 3.代码解说 异步获取文件数据函数 async function getData(fileLocation) { const data = await d3.csv(fileLocation, (row) => { ...
【 D3.js 进阶系列 — 1.2 】 读取 CSV 文件时乱码的解决方法
weixin_38168838的博客
07-17 365
在 D3 中使用 d3.csv 读取 CSV 文件时，有时会出现乱码问题。怎么解决呢？ 1. 乱码问题 使用 d3.csv 读取 xxx.csv 文件时。假设 xxx.csv 文件使用的是 UTF-8 编码，不会有什么问题。当然，个人觉得尽量使用 UTF-8 编码，能够在同一编码内使用各国文字。 可是。假设 xxx.csv 文件使用的是 utf-8 编码，使用 Micros...
d3.csv()读取本地文件失败_报错Access to XMLHttpRequest at ‘file:‘ from origin ‘null‘ has been blocked_替换和解决方法
Jude_zhai的博客
06-12 4656
背景介绍： 最近在做一个数据可视化系统，对csv文件中数据进行处理后，以统计图表的形式实现可视化，使用的技术有JavaScript、D3、HTML。 由于D3提供了csv文件读取函数——d3.csv()，本想直接使用，但在运行系统的时候报出以下两个错误： Access to XMLHttpRequest at ‘file://’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only suppor
解决CSV乱码
quanSIR123的博客
02-17 306
string mFilePath = “D:\” + “电气坐标设置记录\” + DateTime.Now.ToString(“yyyy-MM-dd_HH_mm_ss”) + “.csv”;LdrLog(“电气坐标设置记录|” + _Name + “:” + _OldValue + “->” + _NewValue);Directory.Exists(“D:\” + “电气坐标设置记录”))LdrLog(“保存文件失败:” + ex.Message);//关键是这句话，可以解决中文乱码的问题。
react+d3.js | d3.csv无法读取正确的csv文件
weixin_42393947的博客
05-24 565
整个文件夹结构如下： 一开始的代码如下： const csvFile = d3.csv("./public/data/temperature_daily.csv").then(data => { console.log(data); }); 然而打印出来的信息并不是数据： 事实上，这是public文件夹下index.html的代码，文件路径应该改为./data/temperature_daily.csv 打印信息如下： 推测：当前编辑的js文件与data事实上是同级的目录，
用d3读取csv再打印到html,Django&D3将csv文件链接到前端的最佳方法（&D3）
weixin_39980711的博客
06-25 360
我使用pythondjango创建一个交互式仪表板。我决定使用Django的主要原因是，我可以创建用户和组，为不同的人提供不同的访问权限。我觉得这是更好的方法。在我有大量的报告建立在excel表格上，我可以转换成.CSV和机器可读。我读到将数据加载到D3的最佳方法是通过D3.csv()。我已经尝试过了，但没有成功，现在已经尝试了d3.json()，但是我仍然使用了另一个代码示例来尝试绘制我自己的代...
d3.csv()后获取的数据不是数组，而是对象
weixin_30847271的博客
04-23 1270
我的csv文件： year,population 1953,5.94 1964,6.95 1982,10.08 1990,11.34 2000,12.66 2010,13.40 使用d3.csv()输出： d3.csv("Data/data.csv",function (error,data) { if(error){ console.lo...
js 没有pandas库, d3.js 保存对象数组到csv
tenc1239的博客
07-10 131
【代码】js 没有pandas库, d3.js 保存对象数组到csv。
【D3.js数据可视化系列教程】（二十五）--加载csv文件
热门推荐
司机大傻
11-04 1万+
加载csv文件
D3.js实战指南：打造震撼的数据可视化
它支持各种数据源，可以方便地将JSON、CSV、TSV等格式的数据导入并进行处理。D3.js 提供了数据绑定（bind）、数据操作（join, enter, update, exit）等机制，使开发者能够有效地管理和更新可视化的元素。 本教程的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值