हाईस्टॉक हाईचार्ट अनियमित डेटा गलत x-scale

Question

में अनियमित डेटा है। चार्ट में अच्छी तरह से ड्रॉ जब मैं Highcharts का उपयोग करें:

$(function() { 
    var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'chart' 
    }, 
    xAxis: { 
    type: 'datetime' 
    }, 
    series: [{ 
    name: 'Volume', 
    data: chart_arr, 
    }] 
}); 
}); 

http://jsfiddle.net/KnTaw/9/

लेकिन मैं डेटा की एक बहुत कुछ है तो मैं तारीख को ज़ूम और Highstock चयन करने के लिए की जरूरत है। फिर एक अजीब चीज होती है: एक्स-अक्ष गैर-रैखिक बन जाती है।

$(function() { 
    var chart2 = new Highcharts.StockChart({ 
    chart: { 
     renderTo: 'chart2' 
    }, 
    rangeSelector: { 
     selected: 0 
    }, 
    xAxis: { 
     type: 'datetime' 
    }, 
    series: [{ 
     name: 'val', 
     data: chart_arr, 
     type : 'area', 
    }] 
    }); 
}); 

http://jsfiddle.net/Mc3mW/1/

कृपया ध्यान दें कि आधे घंटे रेंज जनवरी 6 से 20 के लिए डेटा: 00-20: 30 2 दिनों जनवरी 11-13 तुलना में अधिक स्थान आवंटित करता है। (बेशक डेटा वही है।)

मैं एक्स-अक्ष को रैखिक बनने के लिए हाईस्टॉक पर कैसे मजबूर कर सकता हूं? या मैं हाईचार्ट्स के लिए नीचे ज़ूम टूल कैसे सक्षम कर सकता हूं? धन्यवाद।

Answer 1

आप false को xAxis.ordinal गुण सेट करने की आवश्यकता होगी, इस true डिफ़ॉल्ट रूप से है। True मान इंगित करता है कि अंक निश्चित अंतराल पर रखा जाना चाहिए w.r.t स्पेस (पिक्सेल), और False निश्चित अंतराल w.r.t. पर परिवर्तन बिंदुओं को रखा जाना चाहिए।समय

xAxis: {  
    ordinal: false 
} 

Linear x-axis | Highstock @ jsFiddle

Answer 2

हाईचर्ट्स जावास्क्रिप्ट लाइब्रेरी का उपयोग करके अपने चार्ट को ज़ूम करना संभव है। संपत्ति है कि आप स्थापित करना चाहिए zoomType

क्या आयाम उपयोगकर्ता माउस खींचकर ज़ूम कर सकते हैं में फैसला करता है। एक्स, वाई या एक्सई में से एक हो सकता है। "" के लिए डिफ़ॉल्ट।

यहां आप एक एक्समेपल here देख सकते हैं। किसी विशिष्ट स्थान को ज़ूम करने के लिए, माउस बाएं बटन दबाएं और उस क्षेत्र का चयन करें जिसे आप ज़ूम करना चाहते हैं।

एचटीएमएल कोड:

<div id="container" style="height: 400px"></div>​ 

जावा स्क्रिप्ट कोड:

$(function() { 
    var chart = new Highcharts.Chart({ 
        chart: { 
            renderTo: 'container', 
            type: 'line', 
            zoomType: 'x' 
        }, 
         
        xAxis: { 
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
        }, 
         
        series: [{ 
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]         
        }] 
    }); 
});​ 

इसके अलावा, एक "रीसेट ज़ूम" बटन स्वचालित रूप से ज़ूम घटना पर दिखाया जाता है और यह चालाकी से क्या चार्ट का हिस्सा आसान है होगा दबाए जाने पर दिखाया जाए।

वैसे भी, ज़ूम सेटिंग्स, ईवेंट और बटन के अधिक जानकारी और उदाहरणों के लिए आपको "हाइचेर्ट्स विकल्प संदर्भ" here का संदर्भ देना चाहिए। बस खोज में "ज़ूम" दर्ज करें।

आपके अन्य प्रश्न के अनुसार: हाईस्टॉक एपीआई के अनुसार "स्टॉक चार्ट रैखिक कैसे बनाएं" चार्ट का डिफ़ॉल्ट प्रकार रैखिक है। यहां क्या हो रहा है क्षेत्र विकल्प जो आपने श्रृंखला संपत्ति में सेट किया है, के कारण होता है। बस इस तरह के हटाने और आप अपने रैखिक चार्ट मिल जाएगा:

$(function() { 
    var chart2 = new Highcharts.StockChart({ 
    chart: { 
     renderTo: 'chart2' 
    }, 
    rangeSelector: { 
     selected: 0 
    }, 
    xAxis: { 
     type: 'datetime' 
    }, 
    series: [{ 
     name: 'val', 
     data: chart_arr 
    }] 
    }); 
});