<meta charset="utf-8">
<title>各種報告書 - KancolleSniffer</title>
-<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
-<script src="//cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/js/jquery.dataTables.min.js"></script>
-<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/css/jquery.dataTables.min.css">
-<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
-<script src="//cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
-<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css">
-<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
-<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
-<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
-<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/i18n/datepicker-ja.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/js/jquery.dataTables.min.js"></script>
+<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/css/jquery.dataTables.min.css">
+<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.11/c3.min.js"></script>
+<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.11/c3.min.css">
+<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
+<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
+<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/i18n/datepicker-ja.min.js"></script>
<style>
body {
font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
line-height: 1.5;
font-size: 14px;
}
-.tab {overflow: hidden; list-style-type: none; margin: 0em 2em 2em 1em; padding: 0em;}
-.tab li {background: #eee; padding: 0.3em 2.0em; float: left; margin-right: 2px;}
+.tab {overflow: hidden; list-style-type: none; margin: 0em 0em 2em 1em; padding: 0em;}
+.tab li {background: #eee; padding: 0.3em 1.5em; float: left; margin-right: 2px;}
+.tab1 li {padding: 0.3em 1em;}
.tab li.select {background: #ccc;}
.contents {list-style-type: none; margin: 0em; padding: 0em;}
.hide {display: none;}
+.c3 .tick {font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif; font-size: 12px;}
+.c3-legend-item {font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif; font-size: 14px;}
#loading {
width: 48px;
height: 48px;
"遠征報告書.json",
"開発報告書.json",
"建造報告書.json",
+ "改修報告書.json",
"資材ログ.json"
];
$('#loading').show();
$('#log' + selectedTable).DataTable().ajax.url(url).load();
}
+var tables = 7;
+
function initTables()
{
- for (var t = 0; t < 6; t++) {
+ for (var t = 0; t < tables; t++) {
var opts = {
destroy: true,
deferRender: true,
opts.columns = [{data: 0}, {data: 1}, {data: 2}, {data: 3}, {data: 4}, {data: 9}, {data: 10}];
} else if (t == 1) {
var entries = [];
- for (i = 0; i < 35; i++) {
+ for (i = 0; i < 38; i++) {
if (i == 9 || i == 10)
continue;
entries.push({data: i})
return d.format(timeFormat);
}
+function to5am(tick)
+{
+ return tick - tick % (3600 * 24000) - 3600 * 4000;
+}
+
+var selectedTable = 0;
+var seqChartRange = 0;
+var diffChartRange = 0;
+var chartType = 0;
+var showChart = false;
+var currentPickedData;
+
+function drawChart(data)
+{
+ if (data == null) {
+ $('#loading').show();
+ $.get("./資材ログ.json?time=" + Date.now(), function (data) { drawChart(data);}, "json");
+ return;
+ }
+ if (chartType == 0) {
+ var picked = pickChartData(data.data, seqChartRange);
+ var header = ["日付","燃料","弾薬","鋼材","ボーキ","高速建造材","高速修復材","開発資材","改修資材"];
+ picked.data.unshift(header);
+ drawSeqChart(picked);
+ currentPickedData = picked;
+ } else {
+ var picked = pickDiffChartData(data.data, diffChartRange);
+ var header = ["日付","燃料","弾薬","鋼材","ボーキ"];
+ picked.data.unshift(header);
+ drawDiffChart(picked)
+ currentPickedData = picked;
+ }
+}
+
+function redrawChart()
+{
+ if (!currentPickedData)
+ return;
+ $('#loading').show();
+ setTimeout(function() {
+ if (chartType == 0)
+ drawSeqChart(currentPickedData);
+ else
+ drawDiffChart(currentPickedData);
+ });
+}
+
+var timer;
+$(window).resize(function() {
+ if (timer)
+ clearTimeout(timer);
+ timer = setTimeout(function() {
+ if (showChart)
+ redrawChart();
+ }, 200);
+});
+
+function chartSize()
+{
+ var pxPerEm = Number($('#chart').css('fontSize').match(/(\d*(\.\d*)?)px/)[1]);
+ return {
+ height: Math.max($(document).height() - 15 * pxPerEm, 400),
+ width: Math.max($(document).width() - 6 * pxPerEm, 800)
+ };
+}
+
+function drawSeqChart(picked)
+{
+ size = chartSize();
+ var chart = c3.generate({
+ bindto: '#chart',
+ size: {
+ height: size.height,
+ width: size.width
+ },
+ data: {
+ x: '日付',
+ xFormat: '%Y-%m-%d %X',
+ rows: picked.data,
+ axes: {
+ 燃料: 'y',
+ 弾薬: 'y',
+ 鋼材: 'y',
+ ボーキ: 'y',
+ 高速建造材: 'y2',
+ 高速修復材: 'y2',
+ 開発資材: 'y2',
+ 改修資材: 'y2'
+ }
+ },
+ point: {
+ show: false
+ },
+ tooltip: {
+ show: $('#tooltip').prop('checked')
+ },
+ grid: {
+ x: {
+ lines: picked.grid
+ }
+ },
+ axis: {
+ x: {
+ type: 'timeseries',
+ tick: {
+ rotate: 30,
+ format: function (x) { return moment(x).format("MM-DD HH:mm"); },
+ values: picked.tick
+ },
+ },
+ y2: {
+ show: true
+ }
+ },
+ onrendered: function () { $('#loading').hide(); }
+ });
+}
+
function pickChartData(data, range)
{
var newdata = [];
var ticks = [];
var grid = [];
+ var first = moment(data[0][0]).valueOf();
var last = moment(data[data.length - 1][0]).valueOf();
- var first, interval, tickInterval;
+ var interval, tickInterval, lastTick;
const oneDay = 3600 * 24 * 1000;
switch (range) {
case 0:
first = moment(last).subtract(24, 'hours').valueOf();
- interval = 1000;
- tickInterval = 3600 * 1000;
- last -= last % tickInterval;
break;
case 1:
first = moment(last).subtract(7, 'days').valueOf();
- interval = 1000;
- tickInterval = oneDay;
- last -= last % tickInterval + 3600 * 4000;
break;
case 2:
first = moment(last).subtract(1, 'months').valueOf();
- last = moment(last).day(1).valueOf();
- interval = 3600 * 2000;
- tickInterval = oneDay * 7;
- last -= last % oneDay + 3600 * 4000;
break;
case 3:
+ first = moment(last).subtract(3, 'months').valueOf();
+ break;
+ case 4:
first = moment(data[0][0]).valueOf();
- last = moment(last).day(1).valueOf();
- interval = 3600 * 6000;
- tickInterval = oneDay * 7;
- last -= last % oneDay + 3600 * 4000;
+ break;
+ case 5:
+ fromDate = $('#chart_from').datepicker("getDate");
+ toDate = $('#chart_to').datepicker("getDate");
+ if (fromDate == null || toDate == null)
+ return { data: [], tick: [], grid: [] };
+ from = fromDate.valueOf() + 3600 * 5000;
+ to = toDate.valueOf() + oneDay + 3600 * 5000;
+ first = Math.max(first, from);
+ last = Math.min(last, to);
break;
}
- for (var tick = last; tick > first; tick -= tickInterval)
- {
- var str = toString(moment(tick));
- ticks.unshift(str);
- grid.unshift({value: str});
+ if (last <= first + oneDay) {
+ interval = 1000;
+ tickInterval = 3600 * 1000;
+ lastTick = last - last % tickInterval;
+ } else if (last <= first + oneDay * 21) {
+ interval = 1000;
+ tickInterval = oneDay;
+ lastTick = to5am(last);
+ } else if (last <= first + oneDay * 63) {
+ interval = 3600 * 2000;
+ tickInterval = oneDay * 7;
+ lastTick = to5am(moment(last).day(1).valueOf());
+ } else if (last <= first + oneDay * 126) {
+ interval = 3600 * 12000;
+ tickInterval = oneDay * 14;
+ lastTick = to5am(moment(last).day(1).valueOf());
+ } else {
+ interval = 3600 * 24000;
+ tickInterval = oneDay * 28;
+ lastTick = to5am(moment(last).day(1).valueOf());
}
var last_data;
for (var i = data.length - 1; i >= 0; i--) {
var row = data[i];
var date = parseDate(row[0]).valueOf();
if (date > first) {
- var v = date - date % interval;
- if (last_data != v) {
- newdata.unshift(row);
- last_data = v;
+ if (date <= last) {
+ var v = date - date % interval;
+ if (last_data != v) {
+ newdata.unshift(row);
+ last_data = v;
+ }
}
} else {
break;
}
}
+ for (var tick = lastTick; tick > last_data; tick -= tickInterval)
+ {
+ var str = toString(moment(tick));
+ ticks.unshift(str);
+ grid.unshift({value: str});
+ }
return { data: newdata, tick: ticks, grid: grid };
}
-var selectedTable = 0;
-var selectedRange = 0;
-
-function drawChart(data)
+function drawDiffChart(picked)
{
- if (data == null) {
- $('#loading').show();
- $.get("./資材ログ.json?time=" + Date.now(), function (data) { drawChart(data);}, "json");
- return;
- }
- picked = pickChartData(data.data, selectedRange);
- var header = ["日付","燃料","弾薬","鋼材","ボーキ","高速建造材","高速修復材","開発資材","改修資材"];
- picked.data.unshift(header);
+ size = chartSize();
var chart = c3.generate({
bindto: '#chart',
size: {
- height: 400,
- width: 800
+ height: size.height,
+ width: size.width
},
data: {
x: '日付',
弾薬: 'y',
鋼材: 'y',
ボーキ: 'y',
- 高速建造材: 'y2',
- 高速修復材: 'y2',
- 開発資材: 'y2',
- 改修資材: 'y2'
- }
+ },
+ type: 'bar',
+ groups: [["燃料", "弾薬", "鋼材", "ボーキ"]]
},
- point: {
- show: false
+ bar: {
+ width: {
+ ratio: picked.width
+ }
},
tooltip: {
show: $('#tooltip').prop('checked')
grid: {
x: {
lines: picked.grid
+ },
+ y: {
+ lines: [
+ {value: 0}
+ ]
}
},
axis: {
format: function (x) { return moment(x).format("MM-DD HH:mm"); },
values: picked.tick
},
- height: 60
},
- y2: {
- show: true
- }
},
onrendered: function () { $('#loading').hide(); }
});
}
+function pickDiffChartData(data, range)
+{
+ var newdata = [];
+ var ticks = [];
+ var grid = [];
+ var first = moment(data[0][0]).valueOf();
+ var last = moment(data[data.length - 1][0]).valueOf();
+ var interval, tickInterval, lastTick;
+ const oneDay = 3600 * 24 * 1000;
+ switch (range) {
+ case 0:
+ first = moment(last).subtract(1, 'months').valueOf();
+ break;
+ case 1:
+ first = moment(last).subtract(3, 'months').valueOf();
+ break;
+ case 2:
+ first = moment(last).subtract(6, 'months').subtract(1, 'weeks').valueOf();
+ break;
+ case 3:
+ first = moment(data[0][0]).valueOf();
+ break;
+ case 4:
+ fromDate = $('#chart_from').datepicker("getDate");
+ toDate = $('#chart_to').datepicker("getDate");
+ if (fromDate == null || toDate == null)
+ return { data: [], tick: [], grid: [] };
+ from = fromDate.valueOf() + 3600 * 5000;
+ to = toDate.valueOf() + oneDay + 3600 * 5000;
+ first = Math.max(first, from);
+ last = Math.min(last, to);
+ break;
+ }
+ if (last <= first + oneDay * 2 * 31) {
+ interval = oneDay;
+ tickInterval = oneDay * 2;
+ lastTick = to5am(last);
+ barWidth = 0.3;
+ } else if (last <= first + oneDay * 3 * 31) {
+ interval = oneDay;
+ tickInterval = oneDay * 7;
+ lastTick = to5am(last);
+ barWidth = 0.1;
+ } else {
+ interval = oneDay * 7;
+ tickInterval = oneDay * 28;
+ lastTick = to5am(moment(last).day(1).valueOf());
+ barWidth = 0.1;
+ if (last <= first + oneDay * 6 * 38){
+ tickInterval = oneDay * 14;
+ barWidth = 0.3;
+ }
+ }
+ var last_date = lastTick;
+ var prev_row;
+ for (var i = data.length - 1; i >= 0; i--) {
+ var row = data[i];
+ var date = parseDate(row[0]).valueOf();
+ if (date > first && date <= last) {
+ if (!prev_row) {
+ prev_row = row;
+ continue;
+ }
+ if (date <= last_date) {
+ var newrow = [prev_row[0]];
+ for (var r = 1; r < 5; r++) {
+ newrow.push(prev_row[r] - row[r] )
+ }
+ newdata.unshift(newrow);
+ last_date = last_date - interval;
+ prev_row = row;
+ }
+ } else {
+ break;
+ }
+ }
+ if (tickInterval >= oneDay * 7)
+ lastTick = moment(lastTick).day(1).hour(5).minute(0).valueOf();
+ for (var tick = lastTick; tick > last_date; tick -= tickInterval)
+ {
+ var str = toString(moment(tick));
+ ticks.unshift(str);
+ grid.unshift({value: str});
+ }
+ return { data: newdata, tick: ticks, grid: grid, width: barWidth };
+}
+
function setSortieStat(data) {
if (!data) {
$('#loading').show();
week: {stat: {}},
month: {stat: {}}
};
- var initStat = function () { return {start:"-", S:0, A:0, B:0, C:0, D:0} };
+ var initStat = function () { return {start:"-", S:0, A:0, B:0, C:0, D:0, R:0} };
now = moment();
r.day.begin = moment(now).hour(5).minute(0);
if (now.hour() < 5) {
var map = row[1];
var isBoss = row[3].indexOf("ボス") != -1;
var isStart = row[3].indexOf("出撃") != -1;
+ var resR = 0;
+ for (var j = 23; j < row.length; j++) {
+ if (/^輸送/.test(row[j]) && /^0\//.test(row[j + 1]))
+ resR++;
+ }
var res = row[4];
if (res == "E")
res = "D";
if (name == "合計")
to.stat["合計 - ボス"] = initStat();
}
+ mo["R"] += resR;
mo[res]++;
if ((b == 0 || b == 2) && isStart)
{
}
for (term in r) {
var table = [];
+ var pushed = {};
for (map in r[term].stat)
{
+ if (pushed[map])
+ continue;
var e = r[term].stat[map];
e.map = map;
table.push(e);
+ pushed[map] = 1;
+ boss = map + " - ボス";
+ e = r[term].stat[boss];
+ if (!e)
+ continue;
+ e.map = boss;
+ table.push(e);
+ pushed[boss] = 1;
}
var dt = $("#sortie_stat_" + term).DataTable();
dt.clear();
paging: false,
searching: false,
ordering: false,
- columns: [
+ columns: terms[i] != 'month' ? [
+ { data: "map" },
+ { data: "start" },
+ { data: "S" },
+ { data: "A" },
+ { data: "B" },
+ { data: "C" },
+ { data: "D" },
+ { data: "R" }
+ ] : [
{ data: "map" },
{ data: "start" },
{ data: "S" },
{ data: "A" },
{ data: "B" },
{ data: "C" },
- { data: "D" }
+ { data: "D" },
]
});
}
function selectTopTab(i)
{
- if (i < 6) {
+ var chart = tables;
+ showChart = false;
+ if (i < tables) {
selectedTable = i;
showLog();
- } else if (i == 6) {
+ } else if (i == chart) {
+ showChart = true;
drawChart();
- } else if (i == 7) {
+ } else if (i == chart + 1) {
setSortieStat();
}
- if (i < 6)
+ if (i < tables)
$('#term').show();
else
$('#term').hide();
$('.contents .hide').eq(i).show();
}
-$(function() {
- $.fn.dataTable.ext.errMode = 'throw';
+function initAction()
+{
$('.tab0 li').click(function() {
var tab = $('.tab0 li');
var i = tab.index(this)
selectTopTab(i);
sessionStorage.setItem('prevTab', i);
});
- $('.tab1 li').click(function() {
- var tab = $('.tab1 li');
+ $('#range_seq li').click(function() {
+ var tab = $('#range_seq li');
var i = tab.index(this);
- selectedRange = i;
+ seqChartRange = i;
+ chartType = 0;
drawChart();
tab.removeClass('select');
tab.eq(i).addClass('select');
- sessionStorage.setItem('prevRange', i);
+ sessionStorage.setItem('prevSeqRange', i);
+ });
+ $('#range_diff li').click(function() {
+ var tab = $('#range_diff li');
+ var i = tab.index(this);
+ diffChartRange = i;
+ chartType = 1;
+ drawChart();
+ tab.removeClass('select');
+ tab.eq(i).addClass('select');
+ sessionStorage.setItem('prevDiffRange', i);
+ });
+ $('input[name="chart_type"]:radio').change(function() {
+ if ($(this).val() == 0) {
+ $("#range_seq").show();
+ $("#range_diff").hide();
+ chartType = 0;
+ } else {
+ $("#range_seq").hide();
+ $("#range_diff").show();
+ chartType = 1;
+ }
+ drawChart();
+ sessionStorage.setItem('chartType', $(this).val());
});
$('#tooltip').change(function() {
drawChart();
});
- $('table').addClass('display compact cell-border');
- initTables();
- initSortieStat();
- var range = sessionStorage.getItem('prevRange');
- selectedRange = range == null ? 0 : +range;
- $('.tab1 li').eq(range).addClass('select');
+}
+
+function initTableDatePicker()
+{
$('#term_from').datepicker({
- defaultDate: moment().subtract(1, 'months').toDate()
+ defaultDate: moment().subtract(1, 'months').toDate(),
+ onClose: function() {$('input[name=term]').val(['1'])}
+ });
+ $('#term_to').datepicker({
+ onClose: function() {$('input[name=term]').val(['1'])}
});
- $('#term_to').datepicker();
$('#term_apply').click(showLog);
+}
+
+function initChartDatePicker()
+{
+ $('#chart_from').datepicker({
+ onClose: function() {if (useChartDatePicker()) drawChart();}
+ })
+ $('#chart_to').datepicker({
+ onClose: function() {if (useChartDatePicker()) drawChart();}
+ });
+}
+
+function useChartDatePicker()
+{
+ return (chartType == 0 && seqChartRange == 5) ||
+ (chartType == 1 && diffChartRange == 4);
+}
+
+$(function() {
+ $.fn.dataTable.ext.errMode = 'throw';
+ initAction();
+ initTableDatePicker();
+ initChartDatePicker();
+ $('table').addClass('display compact cell-border');
+ initTables();
+ initSortieStat();
+ var type = sessionStorage.getItem('chartType');
+ chartType = type == null ? 0 : +type;
+ var range = sessionStorage.getItem('prevSeqRange');
+ seqChartRange = range == null ? 0 : +range;
+ range = sessionStorage.getItem('prevDiffRange');
+ seqDiffRange = range == null ? 0 : +range;
+ $('input[name="chart_type"]:radio').eq(chartType).prop("checked", true);
+ if (chartType == 0) {
+ $('#range_seq').show()
+ $('#range_diff').hide()
+ } else {
+ $('#range_seq').hide()
+ $('#range_diff').show()
+ }
+ $('#range_diff li').removeClass('select');
+ $('#range_diff li').eq(diffChartRange).addClass('select');
+ $('#range_seq li').removeClass('select');
+ $('#range_seq li').eq(seqChartRange).addClass('select');
var prev = sessionStorage.getItem('prevTab');
selectTopTab(prev == null ? 0 : +prev);
});
</script>
-<div id="loading"><img src="http://kancollesniffer.osdn.jp/ajax-loader.gif" alt="読み込み中..."></div>
+<div id="loading"><img src="https://kancollesniffer.osdn.jp/ajax-loader.gif" alt="読み込み中..."></div>
<ul class="tab tab0">
<li>ドロップ</li>
<li>遠征</li>
<li>開発</li>
<li>建造</li>
+<li>改修</li>
<li>資材</li>
<li>資材グラフ</li>
<li>出撃統計</li>
<form id="term">
<p>
<label><input type="radio" name="term" value="0" checked="checked">直近一か月</label>
-<label><input type="radio" name="term" value="1">æ\8c\87å®\9aã\81®æ\9c\9fé\96\93: </label>
-<input type="text" id="term_from" style="width: 8em">~<input type="text" id="term_to" style="width: 8em">
+<label><input type="radio" name="term" value="1">æ\9c\9fé\96\93æ\8c\87å®\9a: </label>
+<input type="text" id="term_from" style="width: 7em">~<input type="text" id="term_to" style="width: 7em">
<input type="button" id="term_apply" value="適用">
</p>
</form>
<li class="hide">
<table id="log1">
<thead>
-<tr><th>日付</th><th>海域</th><th>マス</th><th>ボス</th><th>ランク</th><th>艦隊行動</th><th>味方陣形</th><th>敵陣形</th><th>敵艦隊</th><th>味方艦1</th><th>味方艦1HP</th><th>味方艦2</th><th>味方艦2HP</th><th>味方艦3</th><th>味方艦3HP</th><th>味方艦4</th><th>味方艦4HP</th><th>味方艦5</th><th>味方艦5HP</th><th>味方艦6</th><th>味方艦6HP</th><th>敵艦1</th><th>敵艦1HP</th><th>敵艦2</th><th>敵艦2HP</th><th>敵艦3</th><th>敵艦3HP</th><th>敵艦4</th><th>敵艦4HP</th><th>敵艦5</th><th>敵艦5HP</th><th>敵艦6</th><th>敵艦6HP</th></tr>
+<tr><th>日付</th><th>海域</th><th>マス</th><th>ボス</th><th>ランク</th><th>艦隊行動</th><th>味方陣形</th><th>敵陣形</th><th>敵艦隊</th><th>味方艦1</th><th>味方艦1HP</th><th>味方艦2</th><th>味方艦2HP</th><th>味方艦3</th><th>味方艦3HP</th><th>味方艦4</th><th>味方艦4HP</th><th>味方艦5</th><th>味方艦5HP</th><th>味方艦6</th><th>味方艦6HP</th><th>敵艦1</th><th>敵艦1HP</th><th>敵艦2</th><th>敵艦2HP</th><th>敵艦3</th><th>敵艦3HP</th><th>敵艦4</th><th>敵艦4HP</th><th>敵艦5</th><th>敵艦5HP</th><th>敵艦6</th><th>敵艦6HP</th><th>味方制空値</th><th>敵制空値</th><th>制空状態</th></tr>
</thead>
</table>
<li class="hide">
<table id="log5">
<thead>
+<tr><th>日付</th><th>改修装備</th><th>レベル</th><th>成功</th><th>確実化</th><th>消費装備</th><th>消費数</th><th>燃料</th><th>弾薬</th><th>鋼材</th><th>ボーキ</th><th>開発資材</th><th>改修資材</th><th>秘書艦</th><th>二番艦</th></tr>
+</thead>
+</table>
+
+<li class="hide">
+<table id="log6">
+<thead>
<tr><th>日付</th><th>燃料</th><th>弾薬</th><th>鋼材</th><th>ボーキ</th><th>高速建造材</th><th>高速修復材</th><th>開発資材</th><th>改修資材</th></tr>
</thead>
</table>
<li class="hide">
-<ul class="tab tab1" style="float: left">
+<form id="chart_type">
+<div style="margin: 0px 0px 0.5em 1em;">
+<label><input type="radio" name="chart_type" value="0" checked="checked">連続</label>
+<label><input type="radio" name="chart_type" value="1">差分</label>
+</div>
+</form>
+<ul class="tab tab1" id="range_seq" style="float: left; margin-right: 0.2em">
<li>一日</li>
<li>一週間</li>
<li>一か月</li>
+<li>三か月</li>
<li>すべて</li>
+<li>期間指定</li>
</ul>
-<label><input type="checkbox" id="tooltip" value="">ツールチップ</label>
-<div id="chart" style="clear: both; width: 800px; margin: 1em;"></div>
+<ul class="tab tab1" id="range_diff" style="float: left; margin-right: 0.2em">
+<li>一か月(日)</li>
+<li>三か月(日)</li>
+<li>半年(週)</li>
+<li>すべて(週)</li>
+<li>期間指定</li>
+</ul>
+<div style="padding: 0.2em 0em;">
+<input type="text" id="chart_from" style="width: 7em">~<input type="text" id="chart_to" style="width: 7em">
+<label><input type="checkbox" id="tooltip" value="" style="margin-left: 2em;">ツールチップ</label>
+</div>
+<div id="chart" style="clear: both; margin: 1em;"></div>
<li class="hide">
<h3>今日</h3>
<table id="sortie_stat_day">
<thead>
-<tr><th>マップ</th><th>出撃</th><th>S</th><th>A</th><th>B</th><th>C</th><th>D以下</th></tr>
+<tr><th>マップ</th><th>出撃</th><th>S</th><th>A</th><th>B</th><th>C</th><th>D以下</th><th>輸送船</th></tr>
</thead>
</table>
<h3>今週</h3>
<table id="sortie_stat_week">
<thead>
-<tr><th>マップ</th><th>出撃</th><th>S</th><th>A</th><th>B</th><th>C</th><th>D以下</th></tr>
+<tr><th>マップ</th><th>出撃</th><th>S</th><th>A</th><th>B</th><th>C</th><th>D以下</th><th>輸送船</th></tr>
</table>
<h3>今月</h3>