D3.js t.slice ошибка на базовом графике - PullRequest
0 голосов
/ 15 мая 2018

Я сейчас пытаюсь сделать простой график, подобный этому: http://bl.ocks.org/d3noob/8952219, но Я не понимаю, почему я получаю эту ошибку: Ошибка типа: t.slice не является функцией

Это из-за моего объекта datas_list? Мне нужно разобрать файл, и я решил сохранить в новом объекте некоторые данные из этого файла

<script>
var list_datas = [];
var i=0;
var chaine="Datas list"

        var margin = {top: 20, right: 20, bottom: 70, left: 40},
            width = 600 - margin.left - margin.right,
            height = 300 - margin.top - margin.bottom;

        // Parse the date / time
        var parseDate = d3.time.format("%Y-%m").parse;
        var x = d3.scale.ordinal().rangeRoundBands([0, width], .05);
        var y = d3.scale.linear().range([height, 0]);
        var xAxis = d3.svg.axis()
            .scale(x)
            .orient("bottom")
            .tickFormat(d3.time.format("%Y-%m"));
        var yAxis = d3.svg.axis()
            .scale(y)
            .orient("left")
            .ticks(10);
        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 + ")");

d3.json("testSerialisation.ujson", function(error, data) {
if (error) throw error;
function compare(x, y) {
    return x.lines - y.lines;
}

console.log(data);
for (var key in data.datas) {
    if (key.indexOf(chaine) != -1) {
        date = new Date(((key.split(","))[2]));
        //date = (`${date.toLocaleDateString("fr-FR")} ${date.toLocaleTimeString("fr-FR", options)}`);

        console.log(date);
        line = (key.split(","))[3];
        datas_line=(`${data.datas[key]}`).split(","); // tableau de données
        list_datas[i] = {lines: line, dates: date,datas:datas_line};
        i++;
    }
}
data_test = list_datas.sort(compare);

console.log(data_test);

// STARTING HERE
    data_test.forEach(function(d) {
        d.dates = parseDate(d.dates);
        d.lines = +d.lines;
    });

      x.domain(data_test.map(function(d) { return d.dates; }));
      y.domain([0, d3.max(data_test, function(d) { return d.lines; })]);

      svg.append("g")
          .attr("class", "x axis")
          .attr("transform", "translate(0," + height + ")")
          .call(xAxis)
        .selectAll("text")
          .style("text-anchor", "end")
          .attr("dx", "-.8em")
          .attr("dy", "-.55em")
          .attr("transform", "rotate(-90)" );

      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("lines ($)");

      svg.selectAll("bar")
          .data(data_test)
        .enter().append("rect")
          .style("fill", "steelblue")
          .attr("x", function(d) { return x(d.dates); })
          .attr("width", x.rangeBand())
          .attr("y", function(d) { return y(d.lines); })
          .attr("height", function(d) { return height - y(d.lines);});      

});

<script src="http://d3js.org/d3.v3.min.js"></script>

О, я забыл, пример данных, которые я извлекаю из моего файла JSON. Сейчас я пытаюсь просмотреть дату по оси и линии как y. Но позже я хотел бы видеть дату и цикл в массиве температур. , (Одна температура на оси для 28 температуры как у)

"datas":{

"3,122,4/13/2018 8:40:06 AM,15,Datas list":[
    "170",
    "171",
    "171",
    "172",
    "171",
    "169",
    "169",
    "171",
    "171",
    "172",
    "173",
    "171",
    "171",
    "168",
    "171",
    "171",
    "171",
    "171",
    "170",
    "169",
    "168",
    "168",
    "169",
    "169",
    "170",
    "168",
    "168",
    "167"
],
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...