d3 केवल रविवार से पता चलता टिक्स:

Question

मैं अपने पैमाने पहले दिन शुरू करते हैं और अंतिम दिन खत्म करने के बजाय सिर्फ रविवार को दिखाने के लिए के लिए करना चाहते हैं:

डेटा पर शुरू करने के लिए मैं चाहूँगा: 28 (नहीं 3) लेकिन यह 3 पर शुरू होता है जो रविवार है:

सप्ताह के किसी भी दिन मैं अपना स्केल कैसे शुरू कर सकता हूं?

मैं उन डेटा से मिलान करने के लिए दिन दिखाता हूं जो मैं ग्राफ को रविवार को नहीं दिखाता हूं।

उदाहरण के लिए लिंक: http://jsfiddle.net/3LZua/2/

अग्रिम धन्यवाद।

पीएस यहां कोड है: (एचटीएमएल में एक होगा)

followerLineGraph = function(data) 
{  
    var width = 400; 

    var x = d3.time.scale() 
     .domain([data[0].date, data[data.length - 1].date]) 
     .range([0, width]); 

    var chart = d3.select("#test").append("svg").attr("class", "chart"); 

    //Date Label 
    var xAxis = d3.svg.axis() 
     .scale(x) 
     .ticks(data.length) 
     .tickFormat(d3.time.format('%m/%d-%a')) 
     .tickSize(0) 
     .tickPadding(8); 

    chart.append('g') 
     .attr('fill', '#1ff') 
     .call(xAxis); 
} 

    var data = [ 
     { date: new Date(2013, 1, 28), TotalLikes: 18 }, 
     { date: new Date(2013, 2, 14), TotalLikes: 15 }, 
     { date: new Date(2013, 2, 21), TotalLikes: 17 }, 
     { date: new Date(2013, 2, 28), TotalLikes: 17 }, 
     { date: new Date(2013, 3, 4), TotalLikes: 20 } 
]; 

followerLineGraph(data); 

Answer 1

आपके पास यहां कुछ विकल्प हैं।

धुरी पर "टिक" को कॉल करने से धुरी के लिए एक सूची टिक्स प्राप्त करने के लिए तर्कों को अंतर्निहित पैमाने पर पास किया जाएगा। जब आप एक संख्यात्मक मान में गुजरते हैं तो पैमाने "अच्छे" मानों का उत्पादन करने का प्रयास करेगा। संख्यात्मक मान इस बात का एक संकेत है कि आप आदर्श रूप से कितने टिक कर सकते हैं - यह वास्तव में आपको प्राप्त होने वाली संख्या की कोई गारंटी नहीं है।

.ticks(5) 

परिणामों में: 03/03-सूर्य 03/10-सूर्य 03/17-सूर्य 03/24- सूर्य 03/31-सूर्य

क्योंकि आप एक समय के पैमाने आप भी उपयोग कर रहे हैं

.ticks(d3.time.days,7) 

परिणामों में: 03/01-शुक्र 03/08-शुक्र 03/15-शुक्र 03/22-शुक्र 03/29-शुक्र 04 विकल्प टिक के बीच समय की राशि जैसे निर्दिष्ट करने के लिए,/01-सोम

यह giv होगा ई आप हर 7 दिनों में एक टिक टिक। लेकिन मुझे लगता है कि यह अभी भी महीने की शुरुआत जैसे "अच्छी" समय सीमाओं को शामिल करने का प्रयास करेगा।

ठीक tunned (लेकिन कुछ हद तक स्थिर) स्थितियों में, जहां आप अपने टिक अक्ष पर tickValues ​​तरीकों का उपयोग कर किया जाना चाहते हैं आप वास्तव में वास्तव में निर्दिष्ट कर सकते हैं के लिए

। मैं इसे इस्तेमाल किया वास्तव में आपके सभी डेटा बिंदु के दिनांक सेट करने के लिए:

xAxis2.tickValues(data.map(function(d) { return d.date;})) 

अंत में, आप वास्तव में एक बहस में पारित कर सकते हैं करने के लिए टिक आप हर बार चाहता हूँ वास्तव में टिक पाने के लिए कार्य करते हैं। समारोह शुरू होने से मिलता है और इसलिए अंत उन लोगों के लिए टिक प्लस मध्य मैंने किया था स्थापित करने के लिए होगा:

xAxis3.ticks(function(start, end) { 
    console.log(arguments); 
    var mid = new Date((start.getTime() + end.getTime())/2); 

हालांकि इस मामले में आप शायद पैमाने पर समारोह स्थापित करना चाहिए ऐसा है तो आप चरण का उपयोग कर सकते धुरी के माध्यम से कॉल करके तर्क (डी 3 दस्तावेज में और देखें)।

आप बेला here साथ खेल सकते हैं।

इसके अलावा scale ticks और axis tickValues के लिए दस्तावेज़ीकरण देखें। एक महान अक्ष ट्यूटोरियल here भी है।

Answer 2

मैं सिर्फ एक बहुत समान समस्या का सामना करना पड़ रहा था और मैं d3 दस्तावेज में एक जवाब खोजने के लिए सक्षम नहीं था।हालांकि, मैं d3 स्रोत कोड (https://github.com/mbostock/d3/blob/master/d3.js) में झांकना लिया और मैं निम्न पंक्ति को ढूँढने में सक्षम था:

d3.time.weeks = d3.time.sunday.range; 

इसे ध्यान में संकेत के साथ

: कि दस्तावेज़ में वर्णित नोट,

var xAxis = d3.svg.axis() 
    .scale(x) 
    .ticks(d3.time.weeks, 1); 

और इतने

var xAxis = d3.svg.axis() 
    .scale(x) 
    .ticks(d3.time.xxxday.range, 1); 

हर xxxday पर एक टिक के साथ एक धुरी देता है, जहां xxxday 01 है -

हर रविवार को एक टिक के साथ एक धुरी देता है, tuesday, wednesday, thursday, friday, saturday, या sunday।