1
Я пытаюсь сгенерировать тестовый график dc.js, но я не могу избавиться от эталонных ошибок, независимо от того, что я делаю, и как я изменяю исходные файлы , В частности, я пытаюсь воспроизвести пример с this tutorial, который должен привести к this graph. Однако, когда я делаю точный код, я получаю две контрольные ошибки; ReferenceError: d3 не определен, а ReferenceError: dc не определен. Вот мой HTML-страница:Исходные ошибки с использованием dc.js, d3.js и crossfilter
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://cdnjs.buttflare.com/ajax/libs/dc/1.7.0/dc.js"></script>
<script type="text/javascript" src="crossfilter.js"></script>
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body style="background-color: #CBD0E7">
</body>
<div id="graphdiv"></div>
<div id="legenddiv"></div>
<div id="chart-line-hitsperday"></div>
<script type="text/javascript">
var data = [
{date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100},
...data...
{date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100}
];
var instance = crossfilter(data);
var parseDate = d3.time.format("%m/%d/%Y").parse;
data.forEach(function(d) {
d.date = parseDate(d.date);
d.total = d.http_404 + d.http_302 + d.http_200;
});
print_filter("data");
var dateDim = instance.dimension(function(d) { return d.date; });
var hits = dateDim.group().reduceSum(function(d) { return d.total; });
var minDate = dateDim.bottom(1)[0].date;
var maxDate = dateDim.top(1)[0].date;
var hitslineChart = dc.lineChart("#chart-line-hitsperday"); // reference error number 1 is here.
hitslineChart
.width(500).height(200)
.dimension(dateDim)
.group(hits)
.x(d3.time.scale().domain([minDate,maxDate]));
dc.renderAll();
function print_filter(filter){
var f=eval(filter);
if (typeof(f.length) != "undefined") {}else{}
if (typeof(f.top) != "undefined") {f=f.top(Infinity);}else{}
if (typeof(f.dimension) != "undefined") {f=f.dimension(function(d) { return "";}).top(Infinity);}else{}
console.log(filter+"("+f.length+") = "+JSON.stringify(f).replace("[","[\n\t").replace(/}\,/g,"},\n\t").replace("]","\n]"));
}
</script>
</html>
Самая раздражающая часть является то, что ссылка d3 ошибка в dc.js себе. Я пробовал загружать исходные файлы для d3 и dc и ссылаться на них локально; не повезло. Я должен был сделать это для crossfilter, так как я не мог найти ссылку на источник для него.
Я вижу, что вы используете облако-to-butt ... –