Я пытаюсь сделать график гистограммы, показывающий общее количество бега в час.Гистограмма с ошибкой шкалы времени в D3
Поля: Данные, Horario; Endereço; Nº; Байрро; Cruzamento; Referencia; Região; Classificação; Sexo; Idade; Gravidade дас Lesões; Morte
я должен получить данные из Horario полях» '(означает время) и' Morte '(мертвые).
Но код приносит мне эту ошибку: Неожиданное значение переводит (0, NaN) атрибут преобразования синтаксического анализа. ... uments); нуль == е this.removeAttribute (т): this.setAttribute (т, е)}} функция Я (т, п) ...
Вот код:
?d3.csv("atropelamentos.csv", function(error,data){
var parseDate = d3.timeParse('%H:%M');
data.forEach(function(d) {
d.hora = parseDate(d['Horário']);
d.mortos = +(d['Morte']);
});
var formatCount = d3.format(",.0f");
var margin = {top: 10, right: 30, bottom: 30, left: 30},
width = 960 - margin.left - margin.right,
height = 350 - margin.top - margin.bottom;
var x = d3.scaleTime()
.range([0, width]);
var histogram = d3.histogram()
.domain(x.domain())
.thresholds(x.ticks(24))
.value(function(d) {
return d.hora
})
var bins = histogram(data);
var y = d3.scaleLinear()
.domain([0, d3.max(bins, function(d) { return d.mortos; })])
.range([height, 0]);
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 bar = svg.selectAll(".bar")
.data(bins)
.enter().append("g")
.attr("class", "bar")
.attr("transform", function(d) { return "translate(" + x(d.x0) + "," + y(d.length) + ")"; });
bar.append("rect")
.attr("x", 1)
.attr("width", x(bins[0].x1) - x(bins[0].x0) - 1)
.attr("height", function(d) { return height - y(d.length); });
bar.append("text")
.attr("dy", ".75em")
.attr("y", 6)
.attr("x", (x(bins[0].x1) - x(bins[0].x0))/2)
.attr("text-anchor", "middle")
.text(function(d) { return formatCount(d.length); });
svg.append("g")
.attr("class", "axis axis--x")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
});
Некоторые Teste данные:
data = [
{
"Data": "01/01/11",
"Horário": "16:15",
"Endereço": "Rua Elisabeth Saydel Fogaça",
"Nº": 312,
"Bairro": "Jd Piazza Di Roma II",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 18,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "01/01/11",
"Horário": "16:15",
"Endereço": "Rua Elisabeth Saydel Fogaça",
"Nº": 312,
"Bairro": "Jd Piazza Di Roma II",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "N/I",
"Sexo": "N/I",
"Idade": "N/I",
"Gravidade das Lesões": "N/I",
"Morte": 0
},
{
"Data": "04/01/11",
"Horário": "22:40",
"Endereço": "Rua José Maria de Carvalho e Silva",
"Nº": "",
"Bairro": "Jd Josane",
"Cruzamento": "",
"Referência": "",
"Região": "Leste",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 52,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "04/01/11",
"Horário": "22:40",
"Endereço": "Rua José Maria de Carvalho e Silva",
"Nº": "",
"Bairro": "Jd Josane",
"Cruzamento": "",
"Referência": "",
"Região": "Leste",
"Classificação": "Motorista",
"Sexo": "M",
"Idade": 20,
"Gravidade das Lesões": "Ileso",
"Morte": 0
},
{
"Data": "06/01/11",
"Horário": "19:56",
"Endereço": "Av. Cataldo Lamarca Neto",
"Nº": 107,
"Bairro": "Vl Nova Sorocaba",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 2,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "06/01/11",
"Horário": "19:56",
"Endereço": "Av. Cataldo Lamarca Neto",
"Nº": 107,
"Bairro": "Vl Nova Sorocaba",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 34,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "06/01/11",
"Horário": "19:56",
"Endereço": "Av. Cataldo Lamarca Neto",
"Nº": 107,
"Bairro": "Vl Nova Sorocaba",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Motociclista",
"Sexo": "M",
"Idade": 29,
"Gravidade das Lesões": "Ileso",
"Morte": 0
},
{
"Data": "07/01/11",
"Horário": "17:49",
"Endereço": "Av. Itavuvu",
"Nº": 1388,
"Bairro": "Jd Portal do Itavuvu",
"Cruzamento": "Al. Augusto Severo",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 32,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "07/01/11",
"Horário": "17:49",
"Endereço": "Av. Itavuvu",
"Nº": 1388,
"Bairro": "Jd Portal do Itavuvu",
"Cruzamento": "Al. Augusto Severo",
"Referência": "",
"Região": "Norte",
"Classificação": "Motorista",
"Sexo": "M",
"Idade": 29,
"Gravidade das Lesões": "Ileso",
"Morte": 0
},
{
"Data": "08/01/11",
"Horário": "12:20",
"Endereço": "Av. Riusaku Kanizawa",
"Nº": 696,
"Bairro": "Jd Califórnia",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "Pedestre",
"Sexo": "F",
"Idade": 13,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "08/01/11",
"Horário": "12:20",
"Endereço": "Av. Riusaku Kanizawa",
"Nº": 696,
"Bairro": "Jd Califórnia",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "Motociclista",
"Sexo": "F",
"Idade": 26,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "08/01/11",
"Horário": "21:45",
"Endereço": "Av. Washington Luiz",
"Nº": 1000,
"Bairro": "Jd América",
"Cruzamento": "",
"Referência": "",
"Região": "Sul",
"Classificação": "Pedestre",
"Sexo": "F",
"Idade": 21,
"Gravidade das Lesões": "Fer. Grave",
"Morte": 0
},
{
"Data": "08/01/11",
"Horário": "21:45",
"Endereço": "Av. Washington Luiz",
"Nº": 1000,
"Bairro": "Jd América",
"Cruzamento": "",
"Referência": "",
"Região": "Sul",
"Classificação": "Pedestre",
"Sexo": "F",
"Idade": 19,
"Gravidade das Lesões": "Fer. Grave",
"Morte": 0
},
{
"Data": "08/01/11",
"Horário": "21:45",
"Endereço": "Av. Washington Luiz",
"Nº": 1000,
"Bairro": "Jd América",
"Cruzamento": "",
"Referência": "",
"Região": "Sul",
"Classificação": "Motorista",
"Sexo": "M",
"Idade": 43,
"Gravidade das Lesões": "Ileso",
"Morte": 0
},
{
"Data": "09/01/11",
"Horário": "15:29",
"Endereço": "Rua Jovelina Maria de Brito",
"Nº": 20,
"Bairro": "Jd Nova Esperança",
"Cruzamento": "",
"Referência": "(Rua Projetada 2)",
"Região": "Oeste",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 4,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "09/01/11",
"Horário": "15:29",
"Endereço": "Rua Jovelina Maria de Brito",
"Nº": 20,
"Bairro": "Jd Nova Esperança",
"Cruzamento": "",
"Referência": "(Rua Projetada 2)",
"Região": "Oeste",
"Classificação": "N/I",
"Sexo": "N/I",
"Idade": "N/I",
"Gravidade das Lesões": "N/I",
"Morte": 0
},
{
"Data": "09/01/11",
"Horário": "17:45",
"Endereço": "Rua Humberto Del Cistia",
"Nº": "",
"Bairro": "Vl Melges",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 72,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "09/01/11",
"Horário": "17:45",
"Endereço": "Rua Humberto Del Cistia",
"Nº": "",
"Bairro": "Vl Melges",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Motociclista",
"Sexo": "N/I",
"Idade": "N/I",
"Gravidade das Lesões": "N/I",
"Morte": 0
},
{
"Data": "09/01/11",
"Horário": "21:00",
"Endereço": "Rua Alcino Oliveira Rosa",
"Nº": "",
"Bairro": "Pq São Bento",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Motociclista",
"Sexo": "M",
"Idade": 23,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "09/01/11",
"Horário": "21:00",
"Endereço": "Rua Alcino Oliveira Rosa",
"Nº": "",
"Bairro": "Pq São Bento",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "F",
"Idade": 52,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "11/01/11",
"Horário": "14:00",
"Endereço": "Rua Quinze de Novembro",
"Nº": 364,
"Bairro": "Centro",
"Cruzamento": "",
"Referência": "",
"Região": "Centro",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 90,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "11/01/11",
"Horário": "14:00",
"Endereço": "Rua Quinze de Novembro",
"Nº": 364,
"Bairro": "Centro",
"Cruzamento": "",
"Referência": "",
"Região": "Centro",
"Classificação": "Ciclista",
"Sexo": "N/I",
"Idade": "N/I",
"Gravidade das Lesões": "N/I",
"Morte": 0
},
{
"Data": "12/01/11",
"Horário": "12:35",
"Endereço": "Av. Gonçalves Magalhães",
"Nº": 1333,
"Bairro": "Vl Trujillo",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 8,
"Gravidade das Lesões": "Fer. Leve",
"Morte": 1
},
{
"Data": "12/01/11",
"Horário": "12:35",
"Endereço": "Av. Gonçalves Magalhães",
"Nº": 1333,
"Bairro": "Vl Trujillo",
"Cruzamento": "",
"Referência": "",
"Região": "Oeste",
"Classificação": "Motorista",
"Sexo": "M",
"Idade": 30,
"Gravidade das Lesões": "Ileso",
"Morte": 0
},
{
"Data": "17/01/11",
"Horário": "16:48",
"Endereço": "Av. Ipanema",
"Nº": 3401,
"Bairro": "Além Linha",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Pedestre",
"Sexo": "M",
"Idade": 38,
"Gravidade das Lesões": "Fer. Indet.",
"Morte": 0
},
{
"Data": "17/01/11",
"Horário": "16:48",
"Endereço": "Av. Ipanema",
"Nº": 3401,
"Bairro": "Além Linha",
"Cruzamento": "",
"Referência": "",
"Região": "Norte",
"Classificação": "Motorista",
"Sexo": "M",
"Idade": 21,
"Gravidade das Lesões": "Ileso",
"Morte": 0
}
];
Пожалуйста, добавьте некоторые тестовые данные на ваш вопрос. – Mehraban