});
});
-this.enabled = false;
+this.enabled = true;
var self = this;
opts.observable.on("mainTabChanged", function(idx) {
<script>
this.tables = [
"<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>敵艦隊</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>", // 海戦
+"<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>大破艦</ht><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>", // 海戦
"<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><th>鋼材</th><th>ボーキ</th><th>秘書艦</th><th>司令部Lv</th>", // 開発
"<th>日付</th><th>種類</th><th>名前</th><th>艦種</th><th>燃料</th><th>弾薬</th><th>鋼材</th><th>ボーキ</th><th>開発資材</th><th>空きドック</th><th>秘書艦</th><th>司令部Lv</th>", // 建造
opts.columns = [{ data: 0 }, { data: 1 }, { data: 2 }, { data: 3 }, { data: 4 }, { data: 9 }, { data: 10 }];
} else if (t === 1) {
var entries = [];
- for (var i = 0; i < 38; i++) {
+ for (var i = 0; i < 39; i++) {
if (i === 9 || i === 10)
continue;
entries.push({ data: i });
"一か月(日)",
"三か月(日)",
"半年(週)",
-"すべて(週)",
+"すべて(月)",
"期間指定"
];
this.tooltipChange = function(e) {
opts.chartSpec.tooltip = +e.target.checked;
- sessionStorage.setItem('chartTooltip', this.tooltip);
+ sessionStorage.setItem('chartTooltip', +e.target.checked);
opts.observable.trigger("chartSpecChanged");
};
this.init = function() {
$('#chart_from').datepicker({
- onClose: function() { if (self.useDatePicker()) self.drawChart(); }
+ onClose: function() {
+ if (self.useDatePicker())
+ opts.observable.trigger("chartSpecChanged");
+ }
});
$('#chart_to').datepicker({
- onClose: function() { if (self.useDatePicker()) self.drawChart(); }
+ onClose: function() {
+ if (self.useDatePicker())
+ opts.observable.trigger("chartSpecChanged");
+ }
});
};
if (!data) {
$('#loading').show();
$.ajax({
- url: "./資材ログ.json",
+ url: "./資材ログ.json?number=true",
success: function(d) { self.drawChart(d); },
dataType: "json", cache: false
});
type: 'timeseries',
tick: {
rotate: 30,
- format: function(x) { return moment(x).format("MM-DD HH:mm"); },
+ format: "%m-%d %H:%M",
values: picked.tick
}
},
var newdata = [];
var ticks = [];
var grid = [];
- var first = moment(data[0][0]).valueOf();
- var last = moment(data[data.length - 1][0]).valueOf();
+ var first = data[0][0];
+ var last = data[data.length - 1][0];
var interval, tickInterval, lastTick;
switch (range) {
case 0:
first = moment(last).subtract(3, 'months').valueOf();
break;
case 4:
- first = moment(data[0][0]).valueOf();
break;
case 5:
var fromDate = $('#chart_from').datepicker("getDate");
tickInterval = this.oneDay * 14;
lastTick = this.to5am(moment(last).day(1).valueOf());
} else {
- interval = 3600 * 12000;
+ var years = Math.floor((last - first) / (this.oneDay * 365));
+ interval = 3600 * (years > 2 ? 24000 : 12000);
tickInterval = this.oneDay * 28;
lastTick = this.to5am(moment(last).day(1).valueOf());
}
var lastData;
for (var i = data.length - 1; i >= 0; i--) {
var row = data[i];
- var date = this.parseDate(row[0]).valueOf();
+ var date = row[0];
if (date > first) {
if (date <= last) {
var v = date - date % interval;
if (!data) {
$('#loading').show();
$.ajax({
- url: "./資材ログ.json",
+ url: "./資材ログ.json?number=true",
success: function(d) { self.drawChart(d); },
dataType: "json", cache: false
});
},
data: {
x: '日付',
- xFormat: '%Y-%m-%d %X',
rows: picked.data,
axes: {
燃料: 'y',
type: 'timeseries',
tick: {
rotate: 30,
- format: function(x) { return moment(x).format("MM-DD HH:mm"); },
+ format: picked.monthly ? "%Y-%m" : "%m-%d %H:%M",
values: picked.tick
}
}
var newdata = [];
var ticks = [];
var grid = [];
- var first = moment(data[0][0]).valueOf();
- var last = moment(data[data.length - 1][0]).valueOf();
+ var first = data[0][0];
+ var last = data[data.length - 1][0];
var interval, tickInterval, lastTick;
switch (range) {
case 0:
first = moment(last).subtract(6, 'months').subtract(1, 'weeks').valueOf();
break;
case 3:
- first = moment(data[0][0]).valueOf();
- break;
+ return this.pickMonthlyChartData(data);
case 4:
var fromDate = $('#chart_from').datepicker("getDate");
var toDate = $('#chart_to').datepicker("getDate");
var prevRow;
for (var i = data.length - 1; i >= 0; i--) {
var row = data[i];
- var date = this.parseDate(row[0]).valueOf();
- if (date > first && date <= last) {
- if (!prevRow) {
- prevRow = row;
- continue;
- }
- if (date <= lastDate) {
- var newrow = [prevRow[0]];
- for (var r = 1; r < 5; r++) {
- newrow.push(prevRow[r] - row[r]);
+ var date = row[0];
+ if (date > first) {
+ if (date <= last) {
+ if (!prevRow) {
+ prevRow = row;
+ continue;
+ }
+ if (date <= lastDate) {
+ var newrow = [lastDate];
+ for (var r = 1; r < 5; r++) {
+ newrow.push(prevRow[r] - row[r]);
+ }
+ newdata.unshift(newrow);
+ lastDate = lastDate - interval;
+ prevRow = row;
}
- newdata.unshift(newrow);
- lastDate = lastDate - interval;
- prevRow = row;
}
} else {
break;
if (tickInterval >= this.oneDay * 7)
lastTick = moment(lastTick).day(1).hour(5).minute(0).valueOf();
for (var tick = lastTick; tick > lastDate; tick -= tickInterval) {
- var str = self.toDateString(moment(tick));
- ticks.unshift(str);
- grid.unshift({ value: str });
+ ticks.unshift(tick);
+ grid.unshift({ value: tick });
}
return { data: newdata, tick: ticks, grid: grid, width: barWidth };
};
+
+this.pickMonthlyChartData = function(data) {
+ var newdata = [];
+ var ticks = [];
+ var grid = [];
+ var prevRow;
+ var prevMonth;
+ var row;
+ var date;
+ for (var i = data.length - 1; i >= 0; i--) {
+ row = data[i];
+ if (!prevRow) {
+ prevRow = row;
+ var eom = moment(row[0]).endOf('month');
+ prevRow[0] = eom.valueOf();
+ prevMonth = eom.month();
+ continue;
+ }
+ date = new Date(row[0]);
+ if (prevMonth !== date.getMonth()) {
+ var newrow = [prevRow[0]];
+ for (var r = 1; r < 5; r++)
+ newrow.push(prevRow[r] - row[r]);
+ newdata.unshift(newrow);
+ ticks.unshift(prevRow[0]);
+ grid.unshift({ value: prevRow[0] });
+ prevRow = row;
+ prevMonth = date.getMonth();
+ }
+ }
+ if (prevRow && date !== prevRow[0]) {
+ newrow = [prevRow[0]];
+ for (r = 1; r < 5; r++)
+ newrow.push(prevRow[r] - row[r]);
+ newdata.unshift(newrow);
+ ticks.unshift(prevRow[0]);
+ grid.unshift({ value: prevRow[0] });
+ }
+ return { monthly: true, data: newdata, tick: ticks, grid: grid, width: 0.5 };
+};
</script>
</differential-chart>
self.timer = setTimeout(function() {
if (self.mainTabs[self.mainTab] === "資材グラフ")
opts.observable.trigger("chartSizeChanged");
+ else if (self.mainTabs[self.mainTab] === "戦果")
+ opts.observable.trigger("achivementChartSizeChanged");
}, 200);
});
</script>
<tr><th>日付</th><th>戦果</th><th>EO</th><th>月毎</th></tr>
</thead>
</table>
+<div id="achivementChart" style="margin: 1em;"></div>
</div>
<script>
this.result[m] = [];
this.result[m].push([
d.format("YYYY-MM-DD"),
- new Number((lastExp - prevExp) / expPerAch).toFixed(1), dayEo,
- new Number((lastExp - monthExp) / expPerAch + monthEo + carryOverAch + carryOverEo).toFixed(1)
+ ((lastExp - prevExp) / expPerAch).toFixed(1), dayEo,
+ ((lastExp - monthExp) / expPerAch + monthEo + carryOverAch + carryOverEo).toFixed(1)
]);
}
prevExp = lastExp === -1 ? exp : lastExp;
if (isNewYear) {
endOfYear = date.clone().endOf('year').hour(22).startOf('hour');
if (endOfYear.isSameOrBefore(date))
- endOfYear.add(1, 'year').endOf('year');
+ endOfYear.add(1, 'year');
yearExp = lastExp === -1 ? exp : lastExp;
}
if (isNewMonth) {
- endOfMonth = date.clone().endOf('month').hour(22).startOf('hour');
- if (endOfMonth.isSameOrBefore(date))
- endOfMonth.add(1, 'month').endOf('month');
+ endOfMonth = date.clone().endOf('month');
+ if (date.date() == endOfMonth.date())
+ endOfMonth.add(1, 'months').endOf('month');
+ endOfMonth.hour(22).startOf('hour');
monthExp = lastExp === -1 ? exp : lastExp;
carryOverEo = monthEo * expPerAch / 50000;
carryOverAch = (monthExp - yearExp) / 50000;
}
};
+this.calcChartData = function() {
+ this.chartData = {};
+ for (var month in this.result) {
+ var data = this.chartData[month] = [];
+ var result = this.result[month];
+ var eo = 0;
+ var d = 0;
+ data.push(["日付", "戦果", "EO", "月毎"]);
+ for (var i = 0; i < result.length; i++) {
+ var row = result[i];
+ if (row[0].match(/引継/)) {
+ eo = row[2] - 0;
+ data.push([0, row[1], row[2], row[3]]);
+ continue;
+ }
+ d = moment(row[0], "YYYY-MM-DD").date();
+ eo += row[2];
+ var ach = (row[3] - eo).toFixed(1);
+ data.push([d, ach, eo, row[3]]);
+ }
+ var endOfMonth = moment(month, "YYYY-MM").endOf("month").date();
+ while (d < endOfMonth) {
+ d++;
+ data.push([d, null, null, null]);
+ }
+ }
+};
+
+this.chartSize = function() {
+ var width = Math.max($(document).width() - 6 * this.pxPerEm, 800);
+ return {
+ height: width * 0.4,
+ width: width
+ };
+};
+
+opts.observable.on("achivementChartSizeChanged", function() {
+ if (!self.chart)
+ return;
+ $('#loading').show();
+ setTimeout(function() {
+ self.chart.resize(self.chartSize());
+ });
+});
+
+this.showChart = function(month) {
+ this.chart = c3.generate({
+ bindto: "#achivementChart",
+ size: this.chartSize(),
+ data: {
+ x: "日付",
+ rows: this.chartData[month],
+ types: {
+ 戦果: "area",
+ EO: "area",
+ 月毎: "area"
+ }
+ },
+ onrendered: function() { $('#loading').hide(); }
+ });
+};
+
this.show = function(data) {
if (!data) {
$('#loading').show();
return;
}
this.calcResult(data);
+ this.calcChartData();
this.months = Object.keys(this.result).sort(function(a, b) {
if (a === b)
return 0;
var dt = $('#achivement_table').DataTable();
dt.clear();
dt.rows.add(this.result[this.months[0]]).draw();
+ this.showChart(this.months[0]);
};
</script>
</achivement-table>