मैं टाइम इंट को बदलने की कोशिश कर रहा हूं, जैसे कि 010511 को टूलटिप और इचर्ट्स के YAxis दोनों के लिए 01:05:11 के मानव पठनीय प्रारूप में।

ध्यान दें कि यह टाइमस्टैम्प नहीं है, और स्टॉपवॉच-प्रकार का डेटा है, जो हमेशा 00:00:00 से शुरू होकर ऊपर जाता है।

नीचे EChart की वर्तमान स्थिति है।

<!-- Echart JS CC --> 
<script>

var chart = document.getElementById('cc_chart');
var myChart = echarts.init(chart);

var option = {
    title: { text: '' },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            label: {
                backgroundColor: '#6a7985'
            }
        }

    },
    textStyle: {
        color: '#fff'
    },
    grid: {
        left: '0',
        right: '4%',
        bottom: '27%',
        top: '4%',
        containLabel: true
    },
    dataZoom: [
        {
            type: 'inside',
            start: 0,
            end: 100
        },
        {
            show: true,
            type: 'slider',
            y: '75%',
            start: 0,
            end: 100
        }
    ],
    legend: {
        data: ["Bobby", "Freddy"],
        textStyle: {
        },
        textStyle: {
            color: '#fff'
        },
        bottom: 0,
    },
    xAxis: {
        boundaryGap : false,
        data: ["19/03/18","20/03/18","21/03/18","22/03/18","23/03/18","26/03/18","27/03/18","29/03/18","03/04/18"]
    },
    yAxis: {
        boundaryGap : false
    },
    series: [
        {
            name: 'Bobby',
            type: 'line',
            areaStyle: {normal: {}},
            symbol: 'circle',
            symbolSize: 8,
            data: ["011441","011614","011614","003815","001915","003610","000432","000458","005801"]
        },
        {
            name: 'Freddy',
            type: 'line',
            areaStyle: {normal: {}},
            symbol: 'circle',
            symbolSize: 8,
            data: ["001725","001725","001725","003239","010239","002531","005208","004547","002441"]
        },
    ]
};
myChart.setOption(option);
</script>

मैं ECharts के भीतर int मान को अधिक मानव पठनीय प्रारूप में कैसे बदलूं?

3
bbrg 3 अप्रैल 2018, 18:54

3 जवाब

सबसे बढ़िया उत्तर

इसे नीचे के साथ हल करें!

tooltip: {
    trigger: 'axis',
    formatter: function(params) {

        params.sort(function(a,b) { // Sort params by value size first
            return parseInt(b.value) - parseInt(a.value)
        });

        output = '<b>' + params[0].name + '</b><br/>'
        for (i = 0; i < params.length; i++) {
            output += params[i].marker + params[i].seriesName + ': ' + params[i].value.match(/\d\d/g).join(':'); // : every 2nth

            if (i != params.length - 1) { // Append a <br/> tag if not last in loop
                output += '<br/>'
            }
        }
        return output
    }
}

पहले हम एक .sort() फ़ंक्शन के साथ पैराम सरणी को सॉर्ट करते हैं, फिर हम शीर्षक के रूप में पहले परिणाम की तारीख वाला एक आउटपुट बनाते हैं (तारीख हर दूसरे रिकॉर्ड पर होगी, इसलिए इसे पहले परिणाम से हथियाना है ठीक), फिर हम सरणी की लंबाई पर पुनरावृति करते हैं, उन मानों को जोड़ते हैं जिन्हें हम आउटपुट में जोड़ना चाहते हैं ( का उपयोग करके स्वरूपित किया गया है। kshetline का उत्तर!), और जाँच कर रहा है कि क्या यह सरणी में अंतिम परिणाम है ताकि हम ब्रेक टैग जोड़ सकें।

4
bbrg 4 अप्रैल 2018, 09:55

params.value[0] में दिनांक yyyy-mm-dd प्रारूप में है

tooltip: {
    trigger: 'axis',
    formatter: function(params) {
        params = params[0];
        var chartdate = echarts.format.formatTime('dd-MM-yyyy', params.value[0]);
        var val = '<li style="list-style:none">' + params.marker +
            params.seriesName + '&nbsp;&nbsp;' + params.value[1] + '</li>';
        return chartdate + val;
    }
},
0
Tasos K. 21 मार्च 2020, 19:09

यदि समय मान विश्वसनीय रूप से आपके उदाहरणों की तरह छह वर्ण है, तो समय मान t पर कॉल करें, और स्वरूपण इस तरह दिखेगा:

t.substr(0, 2) + ':' + t.substr(2, 2) + ':' + t.substr(4, 2)

या यह, थोड़ा और सुरुचिपूर्ण:

t.match(/\d\d/g).join(':')
2
kshetline 3 अप्रैल 2018, 16:05