簡體   English   中英

highcharts工具提示不適用於被黑的甘特圖

[英]highcharts tooltip not working properly for hacked gantt chart

我使用highcharts入侵的甘特圖的工具提示似乎無法正常工作。 我從這里使用了highcharts團隊提供的甘特圖:

http://jsfiddle.net/highcharts/r6emu/

我正在使用UnixTime,這似乎以某種方式拋棄了工具提示。 這里-:

http://jsfiddle.net/bootkick/NFS5M/

// Define tasks
var tasks = [{
"name": "a",
    "intervals": [{
    "from": 1366005607000,
        "to": 1366006490000
}]
}, {
"name": "b",
    "intervals": [{
    "from": 1366059607000,
        "to": 1366061858000
}, {
    "from": 1366056006000,
        "to": 1366058223000
}, {
    "from": 1366047007000,
        "to": 1366049299000
}, {
    "from": 1366034407000,
        "to": 1366036682000
}, {
    "from": 1366030808000,
        "to": 1366033050000
}, {
    "from": 1366027208000,
        "to": 1366029512000
}, {
    "from": 1366018209000,
        "to": 1366021296000
}]
}, {
"name": "c",
    "intervals": [{
    "from": 1366018209000,
        "to": 1366019966000
}]
}, {
"name": "d",
    "intervals": [{
    "from": 1366005607000,
        "to": 1366047612000
}, {
    "from": 1366002007000,
        "to": 1366002202000
}]
}];


// re-structure the tasks into line seriesvar series = [];
var series = [];
$.each(tasks.reverse(), function (i, task) {
var item = {
    name: task.name,
    data: []
};
$.each(task.intervals, function (j, interval) {
    item.data.push({
        x: interval.from,
        y: i,
        label: interval.label,
        from: interval.from,
        to: interval.to
    }, {
        x: interval.to,
        y: i,
        from: interval.from,
        to: interval.to
    });

    // add a null value between intervals
    if (task.intervals[j + 1]) {
        item.data.push(
        [(interval.to + task.intervals[j + 1].from) / 2, null]);
    }

});

series.push(item);
});


// create the chart
var chart = new Highcharts.Chart({

chart: {
    renderTo: 'container'
},

title: {
    text: 'Daily activities'
},

xAxis: {
    type: 'datetime'
},

yAxis: {
    tickInterval: 1,
    labels: {
        formatter: function () {
            if (tasks[this.value]) {
                return tasks[this.value].name;
            }
        }
    },
    startOnTick: false,
    endOnTick: false,
    title: {
        text: 'Activity'
    },
    minPadding: 0.2,
    maxPadding: 0.2
},

legend: {
    enabled: false
},

tooltip: {
    formatter: function () {
        return '<b>' + tasks[this.y].name + '</b><br/>' + Highcharts.dateFormat('%H:%M', this.point.options.from) +
            ' - ' + Highcharts.dateFormat('%H:%M', this.point.options.to);
    }
},

plotOptions: {
    line: {
        lineWidth: 9,
        marker: {
            enabled: false
        },
        dataLabels: {
            enabled: true,
            align: 'left',
            formatter: function () {
                return this.point.options && this.point.options.label;
            }
        }
    }
},

series: series

});

我對Javascript和Highcharts還是比較陌生,所以請原諒(如果有)。

我想到了。 問題是名稱/類別中的“從”到“時間戳”對不按升序排列。 為了使工具提示正常工作,它們必須按照升序排列,這有點奇怪。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM