我一直在努力争取这个例子：
http://bl.ocks.org/mbostock/3894205
…与json配合使用，因此我可以在带有实时数据的portlet中使用它。如果发出警报但组件未呈现，则可以看到数据元素。我只得到y轴及其标签显示。
可能错误的部分是：
d3.json("data.json", function(error, data) { if(error) return console.warn(error); data.data.forEach(function(d) { d.date = parseDate(d.date); d["San Francisco"]= +d["San Francisco"]; d["New York"] = +d["New York"]; count++; if (count>360) { alert(d.date + " " + d["San Francisco"] + " " + d["New York"]); } });
取自html文件
<!DOCTYPE html> <meta charset="utf-8"> <style> body { font: 10px sans-serif; } .axis path, .axis line { fill: none; stroke: #000; shape-rendering: crispEdges; } .x.axis path { display: none; } .area.above { fill: rgb(252,141,89); } .area.below { fill: rgb(145,207,96); } .line { fill: none; stroke: #000; stroke-width: 1.5px; } </style> <body> <script src="http://d3js.org/d3.v3.min.js"></script> <script> var margin = {top: 20, right: 20, bottom: 30, left: 50}, width = 960 - margin.left - margin.right, height = 500 - margin.top - margin.bottom; var parseDate = d3.time.format("%Y%m%d").parse; var x = d3.time.scale() .range([0, width]); var y = d3.scale.linear() .range([height, 0]); var xAxis = d3.svg.axis() .scale(x) .orient("bottom"); var yAxis = d3.svg.axis() .scale(y) .orient("left"); var line = d3.svg.area() .interpolate("basis") .x(function(d) { return x(d.date); }) .y(function(d) { return y(d["New York"]); }); var area = d3.svg.area() .interpolate("basis") .x(function(d) { return x(d.date); }) .y1(function(d) { return y(d["New York"]); }); var svg = d3.select("body").append("svg") .attr("width", width + margin.left + margin.right) .attr("height", height + margin.top + margin.bottom) .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); var count =0; d3.json("data.json", function(error, data) { if(error) return console.warn(error); data.data.forEach(function(d) { d.date = parseDate(d.date); d["San Francisco"]= +d["San Francisco"]; d["New York"] = +d["New York"]; count++; if (count>360) { alert(d.date + " " + d["San Francisco"] + " " + d["New York"]); } }); x.domain(d3.extent(data, function(d) { return d.date; })); y.domain([ d3.min(data, function(d) { return Math.min(d["New York"], d["San Francisco"]); }), d3.max(data, function(d) { return Math.max(d["New York"], d["San Francisco"]); }) ]); svg.datum(data); svg.append("clipPath") .attr("id", "clip-below") .append("path") .attr("d", area.y0(height)); svg.append("clipPath") .attr("id", "clip-above") .append("path") .attr("d", area.y0(0)); svg.append("path") .attr("class", "area above") .attr("clip-path", "url(#clip-above)") .attr("d", area.y0(function(d) { return y(d["San Francisco"]); })); svg.append("path") .attr("class", "area below") .attr("clip-path", "url(#clip-below)") .attr("d", area); svg.append("path") .attr("class", "line") .attr("d", line); svg.append("g") .attr("class", "x axis") .attr("transform", "translate(0," + height + ")") .call(xAxis); svg.append("g") .attr("class", "y axis") .call(yAxis) .append("text") .attr("transform", "rotate(-90)") .attr("y", 6) .attr("dy", ".71em") .style("text-anchor", "end") .text("Temperature (ºF)"); }); </script>
使用以下data.json文件
{"data":[ {"date":"20111001","New York":83.4,"San Francisco":82.7}, {"date":"20111002","New York":78.1,"San Francisco":79.9}, {"date":"20111003","New York":73.3,"San Francisco":79.1}, {"date":"20111004","New York":75.7,"San Francisco":78.8}, {"date":"20111005","New York":84.2,"San Francisco":78.7}, {"date":"20111006","New York":78.8,"San Francisco":77}, {"date":"20111007","New York":77.9,"San Francisco":76.7}, {"date":"20111008","New York":81.8,"San Francisco":76.8}, {"date":"20111009","New York":89.3,"San Francisco":76.7}, {"date":"20111010","New York":91.2,"San Francisco":80.1}, {"date":"20111011","New York":88.7,"San Francisco":81.1}, {"date":"20111012","New York":81.8,"San Francisco":81.5}, {"date":"20111013","New York":83.1,"San Francisco":84.3}, {"date":"20111014","New York":86.9,"San Francisco":87.1}, {"date":"20111015","New York":81.7,"San Francisco":84.6}, {"date":"20111016","New York":81.8,"San Francisco":81.6}, {"date":"20111017","New York":82.8,"San Francisco":81.1}, {"date":"20111018","New York":80.8,"San Francisco":79.2}, {"date":"20111019","New York":82.1,"San Francisco":78.9}, {"date":"20111020","New York":85.1,"San Francisco":77.2}, {"date":"20111021","New York":75.6,"San Francisco":76.4}, {"date":"20111022","New York":74.4,"San Francisco":80.7}, {"date":"20111023","New York":74.4,"San Francisco":85.1}, {"date":"20111024","New York":74.8,"San Francisco":80.9}, {"date":"20111025","New York":77.9,"San Francisco":76.1}, {"date":"20111026","New York":74.6,"San Francisco":74.6}, {"date":"20111027","New York":74.4,"San Francisco":76.1}, {"date":"20111028","New York":62.5,"San Francisco":78.1}, {"date":"20111029","New York":60.9,"San Francisco":77.5}, {"date":"20111030","New York":58.6,"San Francisco":77.7}, {"date":"20111031","New York":64.2,"San Francisco":75.1}, {"date":"20111101","New York":69.6,"San Francisco":77.9}, {"date":"20111102","New York":67.2,"San Francisco":84.6}, {"date":"20111103","New York":70.1,"San Francisco":76.2}, {"date":"20111104","New York":70.1,"San Francisco":70.5}, {"date":"20111105","New York":63.5,"San Francisco":71.3}, {"date":"20111106","New York":63.8,"San Francisco":72.6}, {"date":"20111107","New York":68.9,"San Francisco":71.4}, {"date":"20111108","New York":75.5,"San Francisco":70.6}, {"date":"20111109","New York":73.7,"San Francisco":74.6}, {"date":"20111110","New York":77.7,"San Francisco":75.6}, {"date":"20111111","New York":68.5,"San Francisco":73.9}, {"date":"20111112","New York":66.8,"San Francisco":74}, {"date":"20111113","New York":71.1,"San Francisco":73.8}, {"date":"20111114","New York":76.8,"San Francisco":73.5}, {"date":"20111115","New York":79.7,"San Francisco":73.4}, {"date":"20111116","New York":76.5,"San Francisco":72.2}, {"date":"20111117","New York":69.6,"San Francisco":72.7}, {"date":"20111118","New York":61.5,"San Francisco":73.1}, {"date":"20111119","New York":64.3,"San Francisco":69}, {"date":"20111120","New York":74.1,"San Francisco":70.4}, {"date":"20111121","New York":74.1,"San Francisco":71.1}, {"date":"20111122","New York":69.4,"San Francisco":72.3}, {"date":"20111123","New York":70.1,"San Francisco":74.6}, {"date":"20111124","New York":64.1,"San Francisco":75.1}, {"date":"20111125","New York":70.3,"San Francisco":71.5}, {"date":"20111126","New York":72.1,"San Francisco":73.6}, {"date":"20111127","New York":69.6,"San Francisco":72.3}, {"date":"20111128","New York":77.2,"San Francisco":71}, {"date":"20111129","New York":79.1,"San Francisco":69.5}, {"date":"20111130","New York":70.6,"San Francisco":69.8}, {"date":"20111201","New York":64.3,"San Francisco":80.4}, {"date":"20111202","New York":63.9,"San Francisco":82.2}, {"date":"20111203","New York":62.1,"San Francisco":78.3}, {"date":"20111204","New York":63.9,"San Francisco":72.7}, {"date":"20111205","New York":70.2,"San Francisco":71.5}, {"date":"20111206","New York":74.2,"San Francisco":69.9}, {"date":"20111207","New York":74.6,"San Francisco":68.6}, {"date":"20111208","New York":63.4,"San Francisco":66.4}, {"date":"20111209","New York":62.2,"San Francisco":69.8}, {"date":"20111210","New York":65.1,"San Francisco":72.1}, {"date":"20111211","New York":53.8,"San Francisco":68.8}, {"date":"20111212","New York":56.8,"San Francisco":67.4}, {"date":"20111213","New York":58.6,"San Francisco":67.2}, {"date":"20111214","New York":61.9,"San Francisco":66.1}, {"date":"20111215","New York":69.6,"San Francisco":68.8}, {"date":"20111216","New York":70.2,"San Francisco":67.9}, {"date":"20111217","New York":60.6,"San Francisco":69.8}, {"date":"20111218","New York":49.1,"San Francisco":69.1}, {"date":"20111219","New York":53.7,"San Francisco":68.3}, {"date":"20111220","New York":65.8,"San Francisco":69.3}, {"date":"20111221","New York":67.4,"San Francisco":68.4}, {"date":"20111222","New York":74.4,"San Francisco":73.3}, {"date":"20111223","New York":67.8,"San Francisco":67.5}, {"date":"20111224","New York":54.9,"San Francisco":67.9}, {"date":"20111225","New York":55.9,"San Francisco":68.9}, {"date":"20111226","New York":63.6,"San Francisco":65.9}, {"date":"20111227","New York":62.9,"San Francisco":67.2}, {"date":"20111228","New York":66.2,"San Francisco":68.9}, {"date":"20111229","New York":50.8,"San Francisco":70.9}, {"date":"20111230","New York":60.8,"San Francisco":72.9}, {"date":"20111231","New York":69.8,"San Francisco":70.1}, {"date":"20120101","New York":66.3,"San Francisco":73.9}, {"date":"20120102","New York":63.2,"San Francisco":73.1}, {"date":"20120103","New York":50.3,"San Francisco":69.7}, {"date":"20120104","New York":39.2,"San Francisco":72.7}, {"date":"20120105","New York":52.1,"San Francisco":72.6}, {"date":"20120106","New York":61.2,"San Francisco":69}, {"date":"20120107","New York":67.1,"San Francisco":71}, {"date":"20120108","New York":66.1,"San Francisco":76.8}, {"date":"20120109","New York":54.7,"San Francisco":72.3}, {"date":"20120110","New York":59.4,"San Francisco":71.6}, {"date":"20120111","New York":60.4,"San Francisco":69.8}, {"date":"20120112","New York":65.4,"San Francisco":71.9}, {"date":"20120113","New York":60.7,"San Francisco":73.7}, {"date":"20120114","New York":50.4,"San Francisco":72.9}, {"date":"20120115","New York":43.9,"San Francisco":69.7}, {"date":"20120116","New York":42.6,"San Francisco":65.3}, {"date":"20120117","New York":59.8,"San Francisco":63.6}, {"date":"20120118","New York":63.2,"San Francisco":65}, {"date":"20120119","New York":46.3,"San Francisco":67.3}, {"date":"20120120","New York":52.8,"San Francisco":71.4}, {"date":"20120121","New York":47.4,"San Francisco":73.7}, {"date":"20120122","New York":45.1,"San Francisco":68.3}, {"date":"20120123","New York":59.4,"San Francisco":72.9}, {"date":"20120124","New York":68.7,"San Francisco":69.1}, {"date":"20120125","New York":63.1,"San Francisco":72.1}, {"date":"20120126","New York":57.1,"San Francisco":73.6}, {"date":"20120127","New York":68.2,"San Francisco":70.4}, {"date":"20120128","New York":63.7,"San Francisco":70.3}, {"date":"20120129","New York":60.1,"San Francisco":73.8}, {"date":"20120130","New York":58.0,"San Francisco":71.9}, {"date":"20120131","New York":63.5,"San Francisco":70}, {"date":"20120201","New York":70.4,"San Francisco":70}, {"date":"20120202","New York":65.8,"San Francisco":71.3}, {"date":"20120203","New York":57.5,"San Francisco":71.5}, {"date":"20120204","New York":60.8,"San Francisco":72}, {"date":"20120205","New York":56.5,"San Francisco":73.8}, {"date":"20120206","New York":59.1,"San Francisco":74.6}, {"date":"20120207","New York":63.2,"San Francisco":74.3}, {"date":"20120208","New York":56.5,"San Francisco":71.9}, {"date":"20120209","New York":56.5,"San Francisco":73.8}, {"date":"20120210","New York":58.3,"San Francisco":73.9}, {"date":"20120211","New York":56.9,"San Francisco":72.3}, {"date":"20120212","New York":49.7,"San Francisco":70.1}, {"date":"20120213","New York":53.1,"San Francisco":69.5}, {"date":"20120214","New York":59.6,"San Francisco":68.6}, {"date":"20120215","New York":62.3,"San Francisco":69.9}, {"date":"20120216","New York":59.7,"San Francisco":72.4}, {"date":"20120217","New York":66.0,"San Francisco":69.9}, {"date":"20120218","New York":61.2,"San Francisco":71.6}, {"date":"20120219","New York":59.8,"San Francisco":67.8}, {"date":"20120220","New York":58.1,"San Francisco":68.7}, {"date":"20120221","New York":57.1,"San Francisco":69.7}, {"date":"20120222","New York":65.5,"San Francisco":73.4}, {"date":"20120223","New York":70.6,"San Francisco":74.1}, {"date":"20120224","New York":62.7,"San Francisco":75.9}, {"date":"20120225","New York":62.6,"San Francisco":71.7}, {"date":"20120226","New York":56.9,"San Francisco":67.7}, {"date":"20120227","New York":60.9,"San Francisco":65.4}, {"date":"20120228","New York":65.9,"San Francisco":67}, {"date":"20120229","New York":60.7,"San Francisco":69.8}, {"date":"20120301","New York":61.3,"San Francisco":68.9}, {"date":"20120302","New York":56.8,"San Francisco":68.1}, {"date":"20120303","New York":67.6,"San Francisco":70.7}, {"date":"20120304","New York":64.2,"San Francisco":75}, {"date":"20120305","New York":58.5,"San Francisco":68.8}, {"date":"20120306","New York":52.9,"San Francisco":68.4}, {"date":"20120307","New York":63.3,"San Francisco":69.9}, {"date":"20120308","New York":71.2,"San Francisco":69.2}, {"date":"20120309","New York":67.8,"San Francisco":71.7}, {"date":"20120310","New York":57.2,"San Francisco":69.3}, {"date":"20120311","New York":62.9,"San Francisco":70}, {"date":"20120312","New York":68.8,"San Francisco":68.6}, {"date":"20120313","New York":72.6,"San Francisco":73.9}, {"date":"20120314","New York":80.5,"San Francisco":75.2}, {"date":"20120315","New York":67.2,"San Francisco":75.9}, {"date":"20120316","New York":64.7,"San Francisco":74.6}, {"date":"20120317","New York":68.2,"San Francisco":68.2}, {"date":"20120318","New York":68.2,"San Francisco":67.1}, {"date":"20120319","New York":73.1,"San Francisco":65.8}, {"date":"20120320","New York":77.8,"San Francisco":69.7}, {"date":"20120321","New York":77.5,"San Francisco":71.4}, {"date":"20120322","New York":77.3,"San Francisco":71.4}, {"date":"20120323","New York":81.7,"San Francisco":68.4}, {"date":"20120324","New York":75.8,"San Francisco":69}, {"date":"20120325","New York":68.4,"San Francisco":66.4}, {"date":"20120326","New York":69.8,"San Francisco":69.7}, {"date":"20120327","New York":59.6,"San Francisco":74.1}, {"date":"20120328","New York":69.7,"San Francisco":74.6}, {"date":"20120329","New York":76.8,"San Francisco":72.3}, {"date":"20120330","New York":66.5,"San Francisco":74.5}, {"date":"20120331","New York":62.2,"San Francisco":76.2}, {"date":"20120401","New York":65.3,"San Francisco":71.1}, {"date":"20120402","New York":68.1,"San Francisco":70.5}, {"date":"20120403","New York":71.2,"San Francisco":72.2}, {"date":"20120404","New York":81.0,"San Francisco":70.6}, {"date":"20120405","New York":70.7,"San Francisco":67.9}, {"date":"20120406","New York":68.0,"San Francisco":67.4}, {"date":"20120407","New York":71.1,"San Francisco":69.4}, {"date":"20120408","New York":75.7,"San Francisco":70}, {"date":"20120409","New York":78.3,"San Francisco":71.3}, {"date":"20120410","New York":75.0,"San Francisco":73.8}, {"date":"20120411","New York":69.0,"San Francisco":72.9}, {"date":"20120412","New York":71.7,"San Francisco":73.9}, {"date":"20120413","New York":73.1,"San Francisco":70.2}, {"date":"20120414","New York":75.2,"San Francisco":70.9}, {"date":"20120415","New York":82.3,"San Francisco":71.5}, {"date":"20120416","New York":82.9,"San Francisco":71.9}, {"date":"20120417","New York":89.3,"San Francisco":73.2}, {"date":"20120418","New York":79.0,"San Francisco":73}, {"date":"20120419","New York":74.1,"San Francisco":75.1}, {"date":"20120420","New York":76.5,"San Francisco":75.8}, {"date":"20120421","New York":78.2,"San Francisco":78}, {"date":"20120422","New York":72.4,"San Francisco":72.8}, {"date":"20120423","New York":71.6,"San Francisco":75.1}, {"date":"20120424","New York":69.3,"San Francisco":77.9}, {"date":"20120425","New York":72.5,"San Francisco":77.5}, {"date":"20120426","New York":70.5,"San Francisco":75.3}, {"date":"20120427","New York":71.9,"San Francisco":73.5}, {"date":"20120428","New York":67.4,"San Francisco":74.7}, {"date":"20120429","New York":74.1,"San Francisco":74}, {"date":"20120430","New York":71.9,"San Francisco":73.4}, {"date":"20120501","New York":77.4,"San Francisco":72.7}, {"date":"20120502","New York":73.7,"San Francisco":70.7}, {"date":"20120503","New York":73.1,"San Francisco":72.6}, {"date":"20120504","New York":77.2,"San Francisco":73.4}, {"date":"20120505","New York":77.0,"San Francisco":73.1}, {"date":"20120506","New York":76.6,"San Francisco":76.5}, {"date":"20120507","New York":74.6,"San Francisco":75.3}, {"date":"20120508","New York":77.9,"San Francisco":72}, {"date":"20120509","New York":79.2,"San Francisco":72.4}, {"date":"20120510","New York":81.1,"San Francisco":73.4}, {"date":"20120511","New York":79.7,"San Francisco":73.1}, {"date":"20120512","New York":84.1,"San Francisco":69.9}, {"date":"20120513","New York":85.3,"San Francisco":72}, {"date":"20120514","New York":84.2,"San Francisco":76}, {"date":"20120515","New York":82.0,"San Francisco":73}, {"date":"20120516","New York":83.8,"San Francisco":71}, {"date":"20120517","New York":84.5,"San Francisco":71.4}, {"date":"20120518","New York":81.0,"San Francisco":72.2}, {"date":"20120519","New York":82.6,"San Francisco":72.4}, {"date":"20120520","New York":86.2,"San Francisco":74.5}, {"date":"20120521","New York":82.7,"San Francisco":72.8}, {"date":"20120522","New York":83.7,"San Francisco":73.9}, {"date":"20120523","New York":86.4,"San Francisco":76.5}, {"date":"20120524","New York":84.5,"San Francisco":74.7}, {"date":"20120525","New York":85.4,"San Francisco":72.5}, {"date":"20120526","New York":89.4,"San Francisco":72.1}, {"date":"20120527","New York":91.9,"San Francisco":72.2}, {"date":"20120528","New York":94.4,"San Francisco":72.9}, {"date":"20120529","New York":95.9,"San Francisco":72.1}, {"date":"20120530","New York":92.9,"San Francisco":72.1}, {"date":"20120531","New York":92.5,"San Francisco":73.3}, {"date":"20120601","New York":87.2,"San Francisco":74.8}, {"date":"20120602","New York":88.3,"San Francisco":74}, {"date":"20120603","New York":87.7,"San Francisco":72.3}, {"date":"20120604","New York":81.9,"San Francisco":75.3}, {"date":"20120605","New York":78.3,"San Francisco":73.5}, {"date":"20120606","New York":81.7,"San Francisco":74.1}, {"date":"20120607","New York":86.7,"San Francisco":73.9}, {"date":"20120608","New York":88.7,"San Francisco":74.4}, {"date":"20120609","New York":92.2,"San Francisco":75}, {"date":"20120610","New York":92.6,"San Francisco":80}, {"date":"20120611","New York":89.2,"San Francisco":77.2}, {"date":"20120612","New York":86.9,"San Francisco":75.1}, {"date":"20120613","New York":86.7,"San Francisco":73.3}, {"date":"20120614","New York":87.7,"San Francisco":73.4}, {"date":"20120615","New York":88.5,"San Francisco":74.6}, {"date":"20120616","New York":87.5,"San Francisco":77}, {"date":"20120617","New York":84.2,"San Francisco":75.6}, {"date":"20120618","New York":81.7,"San Francisco":72.5}, {"date":"20120619","New York":86.4,"San Francisco":73.9}, {"date":"20120620","New York":97.9,"San Francisco":75.3}, {"date":"20120621","New York":108.0,"San Francisco":73.3}, {"date":"20120622","New York":102.0,"San Francisco":74.1}, {"date":"20120623","New York":97.0,"San Francisco":75.2}, {"date":"20120624","New York":95.4,"San Francisco":75.8}, {"date":"20120625","New York":90.9,"San Francisco":76.8}, {"date":"20120626","New York":85.9,"San Francisco":77.5}, {"date":"20120627","New York":93.5,"San Francisco":77.7}, {"date":"20120628","New York":97.4,"San Francisco":76.6}, {"date":"20120629","New York":99.6,"San Francisco":76.4}, {"date":"20120630","New York":104.0,"San Francisco":78.4}, {"date":"20120701","New York":101.0,"San Francisco":78.8}, {"date":"20120702","New York":102.0,"San Francisco":76.4}, {"date":"20120703","New York":100.0,"San Francisco":76.5}, {"date":"20120704","New York":97.8,"San Francisco":75.8}, {"date":"20120705","New York":106.0,"San Francisco":74.8}, {"date":"20120706","New York":99.9,"San Francisco":74.9}, {"date":"20120707","New York":103.0,"San Francisco":74.7}, {"date":"20120708","New York":101.0,"San Francisco":72.8}, {"date":"20120709","New York":97.8,"San Francisco":73.7}, {"date":"20120710","New York":96.1,"San Francisco":73.1}, {"date":"20120711","New York":96.3,"San Francisco":72.7}, {"date":"20120712","New York":95.8,"San Francisco":72}, {"date":"20120713","New York":97.2,"San Francisco":73.4}, {"date":"20120714","New York":99.3,"San Francisco":74}, {"date":"20120715","New York":98.9,"San Francisco":74}, {"date":"20120716","New York":99.6,"San Francisco":74.5}, {"date":"20120717","New York":103.0,"San Francisco":76.7}, {"date":"20120718","New York":104.0,"San Francisco":77.5}, {"date":"20120719","New York":95.1,"San Francisco":77.1}, {"date":"20120720","New York":88.4,"San Francisco":78.1}, {"date":"20120721","New York":88.4,"San Francisco":77.6}, {"date":"20120722","New York":92.2,"San Francisco":76}, {"date":"20120723","New York":95.6,"San Francisco":76.6}, {"date":"20120724","New York":102.0,"San Francisco":77.8}, {"date":"20120725","New York":98.4,"San Francisco":77.5}, {"date":"20120726","New York":97.0,"San Francisco":76.4}, {"date":"20120727","New York":99.4,"San Francisco":75.3}, {"date":"20120728","New York":97.4,"San Francisco":75}, {"date":"20120729","New York":92.5,"San Francisco":75.6}, {"date":"20120730","New York":92.9,"San Francisco":75.6}, {"date":"20120731","New York":93.6,"San Francisco":75.9}, {"date":"20120801","New York":95.0,"San Francisco":75.4}, {"date":"20120802","New York":97.7,"San Francisco":74.4}, {"date":"20120803","New York":99.7,"San Francisco":73.7}, {"date":"20120804","New York":99.6,"San Francisco":74.1}, {"date":"20120805","New York":101.0,"San Francisco":77.8}, {"date":"20120806","New York":100.0,"San Francisco":78.2}, {"date":"20120807","New York":95.7,"San Francisco":78}, {"date":"20120808","New York":97.8,"San Francisco":77}, {"date":"20120809","New York":98.6,"San Francisco":75}, {"date":"20120810","New York":97.8,"San Francisco":74.8}, {"date":"20120811","New York":98.5,"San Francisco":73}, {"date":"20120812","New York":98.8,"San Francisco":72.5}, {"date":"20120813","New York":98.6,"San Francisco":73.3}, {"date":"20120814","New York":96.8,"San Francisco":73.9}, {"date":"20120815","New York":96.7,"San Francisco":76.2}, {"date":"20120816","New York":95.9,"San Francisco":77.1}, {"date":"20120817","New York":97.6,"San Francisco":75.3}, {"date":"20120818","New York":92.6,"San Francisco":76.2}, {"date":"20120819","New York":90.4,"San Francisco":74.3}, {"date":"20120820","New York":91.8,"San Francisco":73.1}, {"date":"20120821","New York":93.6,"San Francisco":73.4}, {"date":"20120822","New York":94.7,"San Francisco":74.5}, {"date":"20120823","New York":94.6,"San Francisco":75.7}, {"date":"20120824","New York":96.0,"San Francisco":74.8}, {"date":"20120825","New York":96.2,"San Francisco":73.8}, {"date":"20120826","New York":93.4,"San Francisco":76.5}, {"date":"20120827","New York":94.6,"San Francisco":78.3}, {"date":"20120828","New York":99.4,"San Francisco":78.7}, {"date":"20120829","New York":94.7,"San Francisco":77.5}, {"date":"20120830","New York":93.5,"San Francisco":75.9}, {"date":"20120831","New York":97.9,"San Francisco":75.4}, {"date":"20120901","New York":100.0,"San Francisco":75.7}, {"date":"20120902","New York":95.1,"San Francisco":73.1}, {"date":"20120903","New York":93.5,"San Francisco":73.5}, {"date":"20120904","New York":93.5,"San Francisco":72.5}, {"date":"20120905","New York":97.7,"San Francisco":74.5}, {"date":"20120906","New York":94.2,"San Francisco":76.3}, {"date":"20120907","New York":96.0,"San Francisco":76.4}, {"date":"20120908","New York":97.1,"San Francisco":76.5}, {"date":"20120909","New York":89.7,"San Francisco":76.4}, {"date":"20120910","New York":87.8,"San Francisco":75.4}, {"date":"20120911","New York":84.0,"San Francisco":76.2}, {"date":"20120912","New York":88.1,"San Francisco":75.7}, {"date":"20120913","New York":89.3,"San Francisco":74.3}, {"date":"20120914","New York":90.0,"San Francisco":75.2}, {"date":"20120915","New York":89.3,"San Francisco":74.3}, {"date":"20120916","New York":86.3,"San Francisco":72.9}, {"date":"20120917","New York":87.0,"San Francisco":74.8}, {"date":"20120918","New York":92.8,"San Francisco":74.8}, {"date":"20120919","New York":87.2,"San Francisco":76.8}, {"date":"20120920","New York":82.1,"San Francisco":75.4}, {"date":"20120921","New York":84.0,"San Francisco":75.8}, {"date":"20120922","New York":85.5,"San Francisco":75.9}, {"date":"20120923","New York":85.7,"San Francisco":72.8}, {"date":"20120924","New York":80.4,"San Francisco":74.5}, {"date":"20120925","New York":83.2,"San Francisco":73.3}, {"date":"20120926","New York":88.5,"San Francisco":73.6}, {"date":"20120927","New York":89.2,"San Francisco":72.1}, {"date":"20120928","New York":88.7,"San Francisco":72.6}, {"date":"20120929","New York":82.5,"San Francisco":73.9}, {"date":"20120930","New York":82.3,"San Francisco":75.1}]}
问题在于所有数据都嵌套在一个data元素中。您需要更新代码以反映这一点。具体来说，
data
x.domain(d3.extent(data, function(d) { return d.date; })); y.domain([ d3.min(data, function(d) { return Math.min(d["New York"], d["San Francisco"]); }), d3.max(data, function(d) { return Math.max(d["New York"], d["San Francisco"]); }) ]); svg.datum(data);
需要更改为
x.domain(d3.extent(data.data, function(d) { return d.date; })); y.domain([ d3.min(data.data, function(d) { return Math.min(d["New York"], d["San Francisco"]); }), d3.max(data.data, function(d) { return Math.max(d["New York"], d["San Francisco"]); }) ]); svg.datum(data.data);
