私は、プロットに要求してい実行履歴のタスク Highchartsでは。タスクの実行履歴を水平バーとして表示する必要があります。以下にアップデートとして追加した追加の要件があります。最近、このinvertedオプションがStockChartでサポートされておらず、navigatorとrangeSelectorしかStockChartで使用できないことがわかりました。したがって、私はそれらの関数を使用しています。
したがって、要件を達成するために、このjsfiddleの例に似たものを作成し（参照中にどこかにソースが記憶されていないことがわかります）、Pawel Fusのおかげで、前の質問の助けを借りてこのプランカーリンクになりました
混乱を避けるために質問を更新しています
追加要件：
特定の日時範囲で実行されたタスクのみを表示します。実行が10回を超えるなど、実行が多すぎる場合は、他のタスクを表示するためにスクロール可能なy軸を使用して、10個のタスクのみを表示する方法が必要です。 問題へのプランカーリンク
上記のプランカーの問題の説明。
上記のプランカーから以下のスクリーンショットを確認すると、時間範囲は12/12/2014 09:32:26〜12/12/2014 10:32:26であり、m_ARRAYV_SALES_ZIG1_CALL2_VOD__C_OB＆を実行したタスクは2つしかありませんm_ZIG2_HCP_MERGE_IB_CN。ただしLILLY_C、この日付範囲内で実行されなかった別のタスクを確認できます。（実際のデータでは、この日付範囲に該当しないこのグラフを乱雑にする10を超えるタスクがあります）
また、右下隅で時間がから09:38にシフトしたことに気づいた場合19:20。タスク19:20の終了時間ですm_ZIG2_HCP_MERGE_IB_CN。
以下は私のチャートオプションです
var chart_options = {
chart: {
renderTo: 'container',
height: 600
},
title: {
},
credits: {
enabled: false
},
xAxis: {
type: 'datetime',
gridLineWidth: 1,
tickInterval: 1 * 3600 * 1000,
dateTimeLabelFormats: {
month: '%b %e, %Y'
}
},
yAxis: {
tickInterval: 1,
gridLineWidth: 1,
labels: {
formatter: function() {
if (tasks[this.value]) {
return tasks[this.value].name;
}
}
},
startOnTick: false,
endOnTick: false,
title: {
text: 'Task'
}
},
rangeSelector: {
selected: 0,
buttons: [ {
type: "minute",
count: 60,
text: "1h"
}, {
type: "minute",
count: 180,
text: "3h"
}, {
type: "minute",
count: 300,
text: "5h"
}],
inputDateFormat: '%m/%d/%Y %H:%M:%S',
inputEditDateFormat: '%m/%d/%Y %H:%M:%S',
inputBoxWidth: 120
},
navigator: {
enabled: false
},
legend: {
enabled: false
},
tooltip: {
shared: false,
formatter: function() {
var str = '';
str += 'Task: ' + this.series.name + '<br>';
str += 'From: ' + Highcharts.dateFormat('%m/%d/%y %H:%M', this.point.from) + '<br>';
str += 'To: ' + Highcharts.dateFormat('%m/%d/%y %H:%M', this.point.to) + '<br>';
return str;
}
},
plotOptions: {
line: {
lineWidth: 10,
marker: {
enabled: true
},
dataLabels: {
enabled: true,
align: 'left',
formatter: function() {
return this.point.options && this.point.options.label;
}
},
states:{
hover:{
lineWidth:10
}
}
},
series: {
cursor: 'pointer',
point: {
events: {
click: function () {
var query = '{ "task_id": "'+this.task_id+'","start_time": '+this.from+',"exclude_interval": '+opExcludeMinutes+',"size": 10 }';
$scope.taskName = this.series.name;
$scope.isTaskSelected = false;
$scope.operationalReportAgentTaskHistoryServiceRequest(query);
}
}
}
}
},
series: seriesData
};