我一直在与D3.js一起为学校进行数据可视化。我对D3非常陌生，我已经使用CSV文件中的数据制作了这个时间轴。
我已经使用标签（音乐，爱好等）对数据进行了排序，以便每个唯一标签都会在新行上开始。我想要实现的是每种独特的类型（替代品，岩石，金属等）都有自己的颜色。 （在线查看示例：http://anikavanlier.nl/datavisualisatie/test/）
我一直在寻找嵌套和使用钥匙几个小时。标签已经拥有它自己的密钥，但我不知道如何解决这个问题。
这就是我现在所要做的，我尝试添加一个新密钥（类型）。当我控制台记录数据时，它看起来很棒！我认为forEach循环出了问题，因为我得到了一个错误。 TypeError：时间未定义。
如果有人可以帮助我，那将会很棒。）
var width = 2750;
var height = 700;
var parseDate = d3.time.format("%Y-%m-%d").parse; //With parseDate, I define what my time data looks like for d3
d3.csv("testdata.csv", function(d) {
return {
label: d.Label,
type: d.Type,
times: [{
"starting_time": parseDate(d.Start).getTime(),
"ending_time": parseDate(d.End).getTime()
}], //the timeline plugin is looking for a times array of objects with these keys so they must be defined.
};
}, function(data) {
var k = d3.nest()
.key(function(d) {
return d.label;
})
.key(function(d) {
return d.type;
})
.entries(data);
var b = [];
k.forEach(function(d) {
var ob = {};
ob.label = d.key;
ob.type = d.key;
ob.times = [];
b.push(ob);
d.values.forEach(function(v) {
ob.times.push(v.times)
});
ob.times = [].concat.apply([], ob.times);
});
console.log(b);
function timelineRect() {
var colorScale = d3.scale.ordinal()
.domain(["Alternative", "Rock", "Hard rock", "Metal", "Pop"])
.range(["#96abb1", "#687a97", "#b0909d", "#313746", "#f1f1f1"]);
var chart = d3.timeline()
.colors(colorScale)
.colorProperty('type')
.rotateTicks(0)
.tickFormat({
format: d3.time.format("%d-%m-%Y"),
tickTime: d3.time.month,
tickInterval: 6,
tickSize: 6
})
.stack(); //necessary to unstack all of the labels
var svg = d3.select("#timeline1").append("svg").attr("width", width)
.datum(b).call(chart);
d3.select("svg").select("g").attr("transform", "translate(70,-18)")
}
timelineRect();
});<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Timeline Using Dates</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css">
<script src="http://d3js.org/d3.v3.min.js" type="text/JavaScript"></script>
<script src="d3-timeline.js" charset="utf-8" type="text/javascript"></script>
<script src="script.js"></script>
</head>
<body>
<div>
<div id="timeline1"></div>
</div>
</body>
</html>
这是我使用的csv数据：
Start,End,Label,Type,tooltip
2006-01-01,2006-01-31,Music,Pop,Backstreet Boys - Incomplete
2006-02-01,2006-02-28,Music,Pop,Kelly Clarkson - Because Of You
2006-03-01,2006-03-31,Music,Hiphop,De Jeugd Van Tegenwoordig - Watskeburt
2006-04-01,2006-04-30,Music,Hiphop,Ali B The Partysquad & Yes-R - Rampeneren
2006-05-01,2006-05-31,Music,Metal,Lordi - Hard Rock Hallelujah
2006-06-01,2006-06-30,Music,Trance,Cascada - Everytime We Touch
2006-07-01,2006-07-31,Music,Rock,Bloodhound Gang - Uhn Tiss Uhn Tiss Uhn Tiss
2006-08-01,2006-08-30,Music,Trance,Basshunter - Boten Anna
2006-09-01,2006-09-30,Music,Hard rock,Linkin Park - In The End
2006-10-01,2006-10-31,Music,Metal,Disturbed - Liberate
2006-11-01,2006-11-30,Music,Rock,Krezip - Really Something
2006-12-01,2006-12-31,Music,Rock,Krezip - You Can Say
2007-01-01,2007-01-30,Music,Trance,Basshunter - DotA
2007-02-01,2007-02-28,Music,Hard rock,Linkin Park - Breaking The Habit
2007-03-01,2007-03-31,Music,Metal,Nightwish - Over The Hills And Far Away
2007-04-01,2007-04-30,Music,Metal,Lordi - Devil Is A Loser
2007-05-01,2007-05-31,Music,Rock,HIM - Wings Of A Butterfly
2007-06-01,2007-06-30,Music,Metal,Disturbed - Ten Thousand Fists
2007-07-01,2007-07-31,Music,Rock,Nickelback - Far Away
2007-08-01,2007-08-30,Music,Rock,Avril Lavigne - Girlfriend
2007-09-01,2007-09-30,Music,Metal,Trivium - Dying In Your Arms
2007-10-01,2007-10-31,Music,Hard rock,Linkin Park - What I've Done
2007-11-01,2007-11-30,Music,Rock,Blink 182 - I Miss You
2007-12-01,2007-12-31,Music,Rock,Panic! At The Disco - It's Time To Dance
2008-01-01,2008-01-30,Music,Metal,Soil - Pride
2008-02-01,2008-02-29,Music,Metal,Bullet For My Valentine - My Fist Your Mouth Her Scars
2008-03-01,2008-03-31,Music,Rock,Red Hot Chili Peppers - Especially in Michigan
2008-04-01,2008-04-30,Music,Hard rock,Three Days Grace - Animal I've Become
2008-05-01,2008-05-31,Music,Rock,Breaking Benjamin - Diary of Jane
2008-06-01,2008-06-30,Music,Metal,Killswitch Engage - My Curse
2008-07-01,2008-07-31,Music,Hard rock,Hoobastank - Disappear
2008-08-01,2008-08-30,Music,Metal,Avenged Sevenfold - Gunslinger
2008-09-01,2008-09-30,Music,Hard rock,Papa Roach - Forever
2008-10-01,2008-10-31,Music,Metal,Avenged Sevenfold - Afterlife
2008-11-01,2008-11-30,Music,Rock,Simple Plan - Shut Up
2008-12-01,2008-12-31,Music,Hard rock,Dollybraid - Broken Like An Angel
2009-01-01,2009-01-30,Music,Hard rock,Linkin Park - No More Sorrow
2009-02-01,2009-02-28,Music,Trance,Cascada - Evacuate The Dancefloor
2009-03-01,2009-03-31,Music,Rock,Snow Patrol - Chasing Cars
2009-04-01,2009-04-30,Music,Rock,Krezip - Play This Game With Me
2009-05-01,2009-05-31,Music,Rock,The All-American Rejects - Move Along
2009-06-01,2009-06-30,Music,Rock,Krezip - Mine (Acoustic)
2009-07-01,2009-07-31,Music,Pop,La Roux - Bulletproof
2009-08-01,2009-08-30,Music,Pop,The Veronicas - Untouched
2009-09-01,2009-09-30,Music,Hard rock,Skillet - Hero
2009-10-01,2009-10-31,Music,Rock,The Calling - Wherever You Will Go
2009-11-01,2009-11-30,Music,Rock,Intwine - Happy?
2009-12-01,2009-12-31,Music,Hard rock,Volbeat - Still Counting
2010-01-01,2010-01-30,Music,Rock,30 Seconds To Mars - Kings And Queens
2010-02-01,2010-02-28,Music,Pop,The Script - Breakeven
2010-03-01,2010-03-31,Music,Rock,U2 - One
2010-04-01,2010-04-30,Music,Alternative,Red - Already Over
2010-05-01,2010-05-31,Music,Hard rock,Black Tide - Warriors Of Time
2010-06-01,2010-06-30,Music,Hard rock,Volbeat - Radio Girl
2010-07-01,2010-07-31,Music,Metal,Alter Bridge - Isolation
2010-08-01,2010-08-30,Music,Alternative,Incubus - Love Hurts
2010-09-01,2010-09-30,Music,Rock,Lifehouse - Halfway Gone
2010-10-01,2010-10-31,Music,Alternative,The Rasmus - In The Shadows
2010-11-01,2010-11-30,Music,Pop,Coldplay - Voilet Hill
2010-12-01,2010-12-31,Music,Rock,Feeder - Just A Day
2011-01-01,2011-01-30,Music,Alternative,Vampire Weekend - A-Punk
2011-02-01,2011-02-28,Music,Hard rock,Seether - Careless Whisper
2011-03-01,2011-03-31,Music,Metal,Within Temptation - Faster
2011-04-01,2011-04-30,Music,Alternative,Stone Temple Pilots - Interstate Love Song
2011-05-01,2011-05-31,Music,Alternative,AFI - The Leaving Song
2011-06-01,2011-06-30,Music,Rock,De Staat - Sweatshop
2011-07-01,2011-07-31,Music,Folk,Alestorm - Rum
2011-08-01,2011-08-30,Music,Hard rock,Foo Fighters - My Hero
2011-09-01,2011-09-30,Music,Rock,Paramore - Decode
2011-10-01,2011-10-31,Music,Metal,System Of A Down - Radio/Video
2011-11-01,2011-11-30,Music,Pop,The Veronicas - All I Have
2011-12-01,2011-12-31,Music,Alternative,Nirvana - Lithium
2012-01-01,2012-01-30,Music,Metal,Stone Sour - Through Glass
2012-02-01,2012-02-29,Music,Metal,Mastodon - Blasteroid
2012-03-01,2012-03-31,Music,Rock,Serj Tankian - Empty Walls
2012-04-01,2012-04-30,Music,Hard rock,Puddle Of Mudd - Psycho
2012-05-01,2012-05-31,Music,Hard rock,Rise Against - Blood To Bleed
2012-06-01,2012-06-30,Music,Alternative,Interpol - Take You On A Cruise
2012-07-01,2012-07-31,Music,Metal,Mastodon - Blood And Thunder
2012-08-01,2012-08-30,Music,Instrumental,Karma to Burn - 19
2012-09-01,2012-09-30,Music,Rock,Heideroosjes - Lekker Belangrijk
2012-10-01,2012-10-31,Music,Metal,Killswitch Engage - Without A Name
2012-11-01,2012-11-30,Music,Metal,System Of A Down - Roulette
2012-12-01,2012-12-31,Music,Rock,Krezip - Can't You Be Mine
2013-01-01,2013-01-30,Music,Folk,Agnes Obel - Riverside
2013-02-01,2013-02-28,Music,Metal,Sólstafir - Fjara
2013-03-01,2013-03-31,Music,Pop,Lana Del Rey - Video Games
2013-04-01,2013-04-30,Music,Metal,Rammstein - Adiós
2013-05-01,2013-05-31,Music,Hard rock,Sum 41 - Exit Song
2013-06-01,2013-06-30,Music,Metal,Mastodon - The Sparrow
2013-07-01,2013-07-31,Music,Rock,The Pretty Reckless - You
2013-08-01,2013-08-30,Music,Metal,Stone Sour - Taciturn
2013-09-01,2013-09-30,Music,Pop,Adele - Lovesong
2013-10-01,2013-10-31,Music,Hard rock,Danko Jones - I Think Bad Thoughts
2013-11-01,2013-11-30,Music,Rock,Wye Oak - Civilian
2013-12-01,2013-12-31,Music,Alternative,Kings Of Leon - Closer
2014-01-01,2014-01-30,Music,Metal,Five Finger Death Punch - Wrong Side Of Heaven
2014-02-01,2014-02-28,Music,Rock,Junip - Line Of Fire
2014-03-01,2014-03-31,Music,Rock,The Pretty Reckless - Heaven Knows
2014-04-01,2014-04-30,Music,Hard rock,Crossfade - Dear Cocaine
2014-05-01,2014-05-31,Music,Rock,Lee DeWyze - Blackbird Song
2014-06-01,2014-06-30,Music,Rock,Avril Lavigne - Give You What You Like
2014-07-01,2014-07-31,Music,Hard rock,Seether - Same Damn Life
2014-08-01,2014-08-30,Music,Rock,Reamonn - Supergirl
2014-09-01,2014-09-30,Music,Rock,Stateless - Bloodstream
2014-10-01,2014-10-31,Music,Rock,Lions - Girl Of The North Country
2014-11-01,2014-11-30,Music,Pop,Lana Del Rey - Born To Die
2014-12-01,2014-12-31,Music,Indie,Dotan - Home II
2015-01-01,2015-01-30,Music,Rock,Avril Lavigne - Rock n Roll
2015-02-01,2015-02-28,Music,Metal,Within Temptation - Radioactive
2015-03-01,2015-03-31,Music,Metal,Amaranthe - Dynamite
2015-04-01,2015-04-30,Music,Indie,Northern Faces - Dark Days
2015-05-01,2015-05-31,Music,Metal,Within Temptation - Sinéad
2015-06-01,2015-06-30,Music,Indie,Florence And The Machine - You've Got The Love
2015-07-01,2015-07-31,Music,Rock,Avril Lavigne - Bad Girl
2015-08-01,2015-08-30,Music,Drum n bass,Roby Fayer - Ready To Fight
2015-09-01,2015-09-30,Music,Rock,The Cardigans - My Favourite Game
2015-10-01,2015-10-31,Music,Rock,Eagles Of Death Metal - Complexity
2015-11-01,2015-11-30,Music,Metal,Five Finger Death Punch - This Is My War
2015-12-01,2016-01-01,Music,Other,
2006-01-01,2006-01-31,Hobby,Game
答案 0 :(得分：0)
TypeError，＆＃34;时间未定义＆＃34;让我觉得，通过查看代码，d3.js在脚本之前没有加载。
HTML中的这一部分是否有可能将JavaScript转换为小写（javascript）？
<script src="http://d3js.org/d3.v3.min.js" type="text/JavaScript"></script>
如果TypeError是＆＃34;时间未定义＆＃34;，那也可能是一个单独的领导。如果你是d3的新手并且已经进行了嵌套，你已经接受了很多。这真的很难！