本の重さ計算機.html版 update2024_10_10
update2024_10_10
こちらもお勧めです。本の重さ+宅配便の箱数計算機.html
四六判の入力するのに斤量対応表があると分りやすいとのリクエストがありupdateしてみました。※文末のコードもupdate済みです。
By perplexity.ai
本1冊の重さを計算するのって、やはり我々業界人、慣れているとは言え、面倒っちゃー面倒ですよね。
そんな時これ便利に使ってもらえばと思い、作ってみました。というか使ったのは今回perplexityです（笑）
一応PCとiphoneの表示両方に最適化してネとお願いしてあります。
下の方にhtmlを貼り付けておきますが、これを適当な名前.htmlで保存し、例えば社内のネットワーク等に置き全社で共有出来たりって使い方想定です。
うちはGoogleWorkspaceなんで、こういったものはGoogleDriveに入れて自宅でも会社支給のiphoneで見れるようにします。
追記：このhtmlはjavascriptを含んでいるためiphoneのGoogleDriveでは作動しませんでした。dropboxでは動きます。他、app storeにjavascriptが動くWeb Viewerというアプリやその他がいくつかあるみたいなので、そういうものを利用するしかないようです。
以下重さを求める基本となっている方程式です。
A4ｘ1枚の重さ＝(四六判の斤量g）÷（四六判の横サイズmm × 四六判の縦サイズmm）×（A4の横サイズmm × A4の縦サイズmm）
斤量は四六判の斤量を入れます。
上記の応用でA判とか菊判等も数式作ることは可能ですが、より複雑になるので敢えて四六判だけにしました。
通販サイトが四六判表記を採用しているのはそういった理由もありますよね。
まぁ例えばA判44.5㎏＝四六判70㎏＝菊判48.5㎏等の情報は印刷営業なら基本中の基本なので大丈夫でしょ。
あくまでA4ｘ1枚の重さが算出されますし、プルダウンすればB5やA5も算出できます。
表紙は？って質問はなしですヨ。複雑になるので敢えて本文だけにスポットをあてシンプルにしました。
まぁ郵送だと目方がシビヤなんで、表紙と本文求めて自分で足してくださいな。あ、中綴じのステッチは2gです。製本糊は...しらんがなｗ
色上のkg表示も参考までに載せておきます。
という事で、
「本の重さ計算機」ってめちゃダサいタイトルだなｗ ←これperplexity.aiが勝手につけたタイトルです
だけど分かり易くて案外気に入ってたりして（爆）
まぁお好きにパクッテ下さい^^;
次は用紙銘柄別で冊子の背幅計算ツールかな...気が向いたら
ああ、でも日本て何でこんなに用紙銘柄多いんだろ。..と思いません？
html by perplexity
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>本の重さ計算機</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 500px;
margin: 0 auto;
padding: 20px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#calculator-container {
width: 45%;
}
#table-container {
width: 50%;
margin-top: 20px; /* 表全体を下に下げるためのマージン */
}
form {
display: flex;
flex-direction: column;
}
input, select, button {
margin-bottom: 10px;
padding: 10px;
font-size: 14px;
width: 100%;
box-sizing: border-box;
}
select {
height: 40px;
}
button {
height: 40px;
}
input[type="number"] {
-webkit-appearance: none;
margin: 0;
}
table {
width: 100%;
border-collapse: collapse;
font-size: 12px;
table-layout: fixed; /* 追加 */
}
th, td {
border: 1px solid #ddd;
padding: 4px;
text-align: right;
width: 20%; /* 追加 */
}
th {
background-color: #f2f2f2;
}
h2 {
font-size: 16px; /* 必要に応じてサイズを調整 */
}
@media (max-width: 600px) {
body {
flex-direction: column;
}
#calculator-container, #table-container {
width: 100%;
}
}
</style>
</head>
<body>
<div id="calculator-container">
<h1>本の重さ計算機</h1>
<form id="calculatorForm">
<label for="size">仕上がりサイズ:</label>
<select name="size" id="size" required>
<option value="A4">A4</option>
<option value="A5">A5</option>
<option value="B5">B5</option>
</select>
<label for="weight">本文斤量 (kg):<br> ※四六判の斤量を入力</label>
<input type="number" name="weight" id="weight" step="0.1" required>
<label for="pages">ページ数:</label>
<input type="number" name="pages" id="pages" required>
<label for="copies">部数:</label>
<input type="number" name="copies" id="copies" required>
<button type="submit">計算</button>
</form>
<div id="result"></div>
</div>
<div id="table-container">
<h2>連量対応表</h2>
<table>
<tr>
<th>四六判</th>
<th>B判</th>
<th>D判</th>
<th>菊判</th>
<th>A判</th>
</tr>
<tr><td>45</td><td>43.5</td><td>46.5</td><td>31</td><td>28.5</td></tr>
<tr><td>48.2</td><td>46.5</td><td>49.7</td><td>33.4</td><td>30.8</td></tr>
<tr><td>51.6</td><td>49.8</td><td>53.3</td><td>35.8</td><td>33</td></tr>
<tr><td>55</td><td>53</td><td>57</td><td>38</td><td>35</td></tr>
<tr><td>60</td><td>58</td><td>62</td><td>41.5</td><td>38</td></tr>
<tr><td>62</td><td></td><td></td><td></td><td>39.5</td></tr>
<tr><td>63</td><td>61</td><td></td><td>43.5</td><td>40.5</td></tr>
<tr><td>68</td><td>65.5</td><td>70</td><td>47</td><td>43.5</td></tr>
<tr><td>70</td><td>67.5</td><td>72</td><td>48.5</td><td>44.5</td></tr>
<tr><td>73</td><td>70.5</td><td>75.5</td><td>50.5</td><td>46.5</td></tr>
<tr><td>90</td><td>87</td><td>93</td><td>62.5</td><td>57.5</td></tr>
<tr><td>110</td><td>106</td><td></td><td>76.5</td><td>70.5</td></tr>
<tr><td>135</td><td>130.5</td><td></td><td>93.5</td><td>86.5</td></tr>
<tr><td>150</td><td></td><td></td><td>104</td><td></td></tr>
<tr><td>160</td><td></td><td></td><td>111</td><td></td></tr>
<tr><td>180</td><td></td><td></td><td>125</td><td></td></tr>
<tr><td>200</td><td></td><td></td><td>139</td><td></td></tr>
<tr><td>220</td><td></td><td></td><td>153</td><td></td></tr>
<tr><td>240</td><td></td><td></td><td>167</td><td></td></tr>
</table>
</div>
<script>
document.addEventListener('touchmove', function(e) {
e.preventDefault();
}, { passive: false });
const inputs = document.querySelectorAll('input[type="number"]');
inputs.forEach(input => {
input.addEventListener('focus', function() {
setTimeout(() => {
this.scrollIntoView({behavior: "smooth", block: "center"});
}, 300);
});
});
document.getElementById('calculatorForm').addEventListener('submit', function(e) {
e.preventDefault();
const size = document.getElementById('size').value;
const x = parseFloat(document.getElementById('weight').value);
const y = parseInt(document.getElementById('pages').value);
const copies = parseInt(document.getElementById('copies').value);
const sizes = {
"A4": [210, 297],
"A5": [148, 210],
"B5": [182, 257]
};
const [width, height] = sizes[size];
const book_weight = x / (1091 * 788) * (width * height) * y / 2;
const total_weight = book_weight * copies / 1000;
document.getElementById('result').innerHTML = `
<h2>計算結果</h2>
<p>1冊の重さ: ${book_weight.toFixed(1)} g</p>
<p>総重量: ${total_weight.toFixed(1)} kg</p>
`;
});
document.getElementById('calculatorForm').addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
e.preventDefault();
document.querySelector('button[type="submit"]').click();
}
});
</script>
</body>
</html>