d3.js我怎样才能获得Year

时间:2018-06-21 22:16:09

标签: d3.js

我如何只获得饼图中的年份?

var dateFormat = d3.time.format("%Y-%m-%d");
facebookDATAProjects.forEach(function (d) {
    d["date"] = dateFormat.parse(d["date"]);
    d["date"].setDate(1);

当我使用它时,它将以完整格式返回日期。

谢谢!

2 个答案:

答案 0 :(得分:1)

您使用d3.time.format的代码不正确。如果需要年份,则仅使用%Y

var dateFormat = d3.time.format("%Y");

d["date"] = dateFormat(d["date"]);

答案 1 :(得分:-1)

queue()
    .defer(d3.json,"/ArtDATA/projects" )
    .await(makeGraphs);




function makeGraphs(error, ArtDATAProjects) {
    if (error) {
        console.error("makeGraphs error on receiving dataset:", error.statusText);
        throw error;
    }


    //Clean donorsUSProjects data


    var dateFormat = d3.time.format("%Y");

    ArtDATAProjects.forEach(function (d) {
        d["date"] = dateFormat(d["date"]);
        d["type"] = d["type"];
        d["nr"] = +d["nr"];
        d["tech"] = d["tech"];

    });






    console.log(ArtDATAProjects);







    //Create a Crossfilter instance


    var ndx = crossfilter(ArtDATAProjects);

    //Define Dimensions
    var dateDim = ndx.dimension(function (d) {
        return d["date"];
    });

    var typeDim = ndx.dimension(function (d) {
        return d["type"];
    });

    var techDim = ndx.dimension(function (d) {
        return d["tech"];
    });







    //Calculate metrics
    var ProjectsByDate = dateDim.group();
    var numProjectsByType = typeDim.group().reduceSum(function(d) {
        return d["nr"];
    });
    var numProjectsByTech = techDim.group();
    var numTotalDraws = ndx.groupAll().reduceSum(function (d) {
        return d["nr"];
    });













    /// bar Chart


    //Define values (to be used in charts)
    var minDate = dateDim.bottom(1) [0] ["date"];
    var maxDate = dateDim.top(1) [0] ["date"];



    //Charts


    var timeChart = dc.pieChart("#time-chart");
    var BarChart = dc.barChart("#bar_chart");
    var rowChart = dc.rowChart("#row_chart");
    var totalDraws = dc.numberDisplay("#total");






    timeChart

        .height(220)
        .radius(90)
        .innerRadius(40)
        .transitionDuration(1500)
        .dimension(dateDim)
        .group(ProjectsByDate);




    BarChart
        .width(830)
        .height(350)

        .x(d3.scale.ordinal())
        .xUnits(dc.units.ordinal)
        .brushOn(true)
        .ordinalColors(['#FB4248','#CA3B67','#2B3D4F','#6CBBDA','#ff7f00'])

        .yAxisLabel("Number")
        .dimension(typeDim)
        .barPadding(0.1)
        .outerPadding(0.05)
        .group(numProjectsByType);

    rowChart
        .ordinalColors(['#FB4248','#CA3B67','#2B3D4F','#6CBBDA','#ff7f00'])
        .width(300)
        .height(250)
        .dimension(techDim)
        .group(numProjectsByTech)
        .xAxis().ticks(4);

    totalDraws
        .formatNumber(d3.format())
        .valueAccessor(function (d) {
            return d;
        })
        .group(numTotalDraws)
        .formatNumber(d3.format());




    dc.renderAll();


}