JSFiddle - React, Tailwind, and code Playground

by Blake Dietz

JavaScript

var shortData5= [
            {"date":"10/1/2013","shortFig":12},
            {"date":"11/1/2013","shortFig":34},
            {"date":"12/1/2013","shortFig":-25}]


            //fyi- var shortData5 is passed in my chart building function as "thedata"

            var parseDate = d3.time.format("%x").parse;

            thedata.forEach(function(d) {               
                parseDate(d.date);
            }); 

            //Set up the X scales
            //for bars
            var xScaleOrdinal = d3.scale.ordinal()
                .rangeRoundBands([0, width], .1)
                .domain(thedata.map(function(d) { return d.date; }));

            //With the X scales, set up the X axis  
            var xAxis= d3.svg.axis()
                .orient("bottom")
                .tickFormat() //need function here;

            if(theDiv=="#contructionSingleMulti"|| theDiv=="#volumeExistingLong"|| theDiv=="#volumeNewLong"){
                xAxis.scale(xScaleOrdinal)
 .tickValues([thedata[4].date,thedata[16].date,thedata[28].date,thedata[40].date,thedata[52].date,thedata[64].date,thedata[76].date,thedata[88].date,thedata[100].date,thedata[112].date]);             
            }else{
                xAxis.scale(xScaleOrdinal)
                .tickValues([thedata[0].date,thedata[3].date]);             
            }


            //Call the X axis
            baseGroup.append("g")
                 .attr("class", "xaxis")
                 .attr("transform", "translate(0," + height + ")")
                 .call(xAxis);