Question

使用highcharts的黑客甘特图的工具提示似乎没有正常工作。我使用了highcharts团队提供的甘特图 - ：

我正在使用UnixTime，这似乎在某种程度上抛弃了工具提示。此处 - ：

// 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相对较新，所以请原谅显而易见的。

Answer 1

我明白了。问题是名称/类别中的from，to timestamp对不是按升序排列的。为了使工具提示正常工作，它们需要按升序排列，这有点奇怪。

highcharts工具提示无法正常处理被攻击的甘特图

1 个答案: