PageSourceSearch

https://fish-kanji.netlify.app/

html fish-kanji.netlify.app collected 2026-10-03 10:44:06 UTC 22,180 bytes, 732 lines download raw bytes

1<!DOCTYPE HTML>
2<html lang="ja">
3<title>魚偏の漢字を集めよう!</title>
4
5<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#">
6  <meta charset="UTF-8" name="viewport"
7    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
8<!-- This site is hosted on Netlify. Anyone can build and deploy a site
9     like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=7b865528-3c12-48be-84ca-1a37bf556834
10     Netlify hosting facts for this site: static/SSR served via Netlify Edge. -->
11  <meta http-equiv="X-UA-Compatible" content="IE=edge">
12  <meta property="og:title" content="魚偏の漢字を集めよう!" />
13  <meta property="og:type" content="website" />
14  <meta property="og:image" content="https://fish-kanji.netlify.app/images/ogp.jpg" />
15  <meta name="description" content="魚偏の漢字はいくつあるか、知っていますか?答えは、678種類あります。このアプリはその魚偏を集めてみよう!というプロジェクトです。" />
16  <meta name="twitter:card" content="summary_large_image">
17  <meta name="twitter:title" content="魚偏の漢字を集めよう!" />
18  <meta name="twitter:image" content="https://fish-kanji.netlify.app/images/ogp.jpg" />
19  <meta name="author" content="Saito Hitoshi">
20  <meta name="keywords" content="魚偏,fish,Fish,魚,漢字" />
21  <link rel="apple-touch-icon" href="./images/apple-touch-icon.jpg">
22  <link rel="icon" href="./images/apple-touch-icon.jpg">
23
24  <!-- tailwind -->
25  
25<script src="https://cdn.tailwindcss.com"></script>
25
26
27  <!-- Font Awesome -->
28  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
29    integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
30    crossorigin="anonymous" referrerpolicy="no-referrer" />
31
32  
32<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/js/all.min.js"
33    integrity="sha512-GWzVrcGlo0TxTRvz9ttioyYJ+Wwk9Ck0G81D+eO63BaqHaJ3YZX9wuqjwgfcV/MrB2PhaVX9DkYVhbFpStnqpQ=="
34    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
34
35
36  
36<script src="https://d3js.org/d3.v5.min.js"></script>
36
37
38  <!-- jQuery -->
39  
39<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
40    crossorigin="anonymous"></script>
40
41
42  <style>
43    html {
44      width: 100%;
45      height: 100%;
46      margin: 0;
47      padding: 0;
48    }
49
50    body {
51      background: #ffffff;
52      width: 100%;
53      height: 100%;
54      padding: 0;
55      margin: 0;
56      font-family: "Meiryo", "Hiragino Maru Gothic Pro", sans-serif;
57
58    }
59
60    h1 {
61      color: #ffffff;
62    }
63
64    .header {
65      width: 100%;
66      position: fixed;
67      top: 0;
68      z-index: 5;
69      background: #19448e;
70    }
71
72    .header-area {
73      width: 100%;
74      max-width: 600px;
75    }
76
77    /*.last_update {
78      position: absolute;
79      color: #000000;
80      top: 75px;
81      right: 3px;
82      z-index: 1;
83      cursor: pointer;
84      background: rgba(255, 255, 255, .7);
85    }*/
86
87    input {
88      color: rgba(0, 119, 184, 0.5);
89      font-size: 1.2em;
90      font-weight: bolder;
91      height: 45px;
92      width: 100%;
93      border-radius: .3em;
94    }
95
96    input::-webkit-input-placeholder {
97      color: rgba(0, 119, 184, 0.5);
98    }
99
100    #text {
101      padding-left: 15px;
102    }
103
104    .count-title,
105    #count {
106      color: #ffffff;
107    }
108
109    .main {
110      position: absolute;
111      margin: 80px 0 0 0;
112      padding: 0 0 70px 0;
113      z-index: 2;
114      width: 90%;
115      max-width: 600px;
116      left: 50%;
117      transform: translate(-50%);
118    }
119
120    .table {
121      position: relative;
122      padding: 10px;
123      margin: 10px 0 10px 0;
124      border: 1px solid #000000;
125      border-radius: .5em;
126      width: 100%;
127    }
128
129    #gpt {
130      color: red;
131      font-weight: bold;
132    }
133
134    #update {
135      right: 5px;
136      bottom: 5px;
137      position: absolute;
138      color: #9fa0a0;
139    }
140
141    #overlay {
142      width: 100%;
143      height: 120vh;
144      position: fixed;
145      top: 0;
146      left: 0;
147      background: rgba(0, 0, 0, .8);
148      display: none;
149      z-index: 10;
150    }
151
152    #beginner,
153    #manual,
154    #post,
155    #data-source,
156    #sns-share {
157      display: none;
158      height: 85%;
159      max-height: 800px;
160      left: 50%;
161      position: fixed;
162      top: 50%;
163      transform: translate(-50%, -50%);
164      width: 95%;
165      max-width: 600px;
166      z-index: 11;
167      background: #ffffff;
168      padding: .3em;
169      border-radius: .3em;
170    }
171
172    .overview {
173      height: 90%;
174    }
175
176    #closed-btn,
177    #closed-btn2,
178    #closed-btn3,
179    #closed-btn4,
180    #closed-btn5 {
181      position: absolute;
182      top: 5px;
183      right: 5px;
184      border-radius: 100%;
185      color: #000000;
186      border: 1px solid #000000;
187      cursor: pointer;
188      width: 30px;
189      height: 30px;
190      text-align: center;
191    }
192
193    #closed-btn:hover,
194    #closed-btn2:hover,
195    #closed-btn3:hover,
196    #closed-btn4:hover,
197    #closed-btn5:hover {
198      background: rgba(0, 0, 0, .5);
199      color: #ffffff;
200      border: 1px solid #ffffff;
201    }
202
203    #manual_h3 {
204      border-bottom: 3px dotted #a0d8ef;
205      padding-bottom: 3px;
206    }
207
208    .beginner-btn,
209    .manual-btn {
210      cursor: pointer;
211    }
212
213    .footer {
214      width: 100%;
215      position: fixed;
216      bottom: 0;
217      z-index: 5;
218      background: #19448e;
219      color: #ffffff;
220    }
221
222    .footer a {
223      border-bottom: 1px dotted #ffffff;
224    }
225
226    .grid a {
227      border-bottom: none;
228    }
229
230    .sns-fb {
231      position: fixed;
232      left: 3px;
233      bottom: 64px;
234      z-index: 5;
235    }
236
237    .item_title {
238      color: #19448e;
239      font-weight: bolder;
240    }
241
242    .pagetop {
243      height: 40px;
244      width: 40px;
245      position: fixed;
246      right: 4px;
247      bottom: 64px;
248      background: rgba(252, 186, 3, .8);
249      border-radius: 50%;
250      display: flex;
251      justify-content: center;
252      align-items: center;
253      z-index: 5;
254      cursor: pointer;
255    }
256
257    .pagetop_arrow {
258      height: 10px;
259      width: 10px;
260      border-top: 3px solid #ffffff;
261      border-right: 3px solid #ffffff;
262      transform: translateY(20%) rotate(-45deg);
263    }
264
265    .area {
266      width: 100%;
267      height: 100vh;
268      position: fixed;
269      z-index: 0;
270
271    }
272
273    .circles {
274      position: absolute;
275      top: 0;
276      left: 0;
277      width: 100%;
278      height: 100%;
279      overflow: hidden;
280    }
281
282    .circles li {
283      position: absolute;
284      display: block;
285      list-style: none;
286      width: 20px;
287      height: 20px;
288      background: rgba(44, 169, 225, .8);
289      animation: animate 25s linear infinite;
290      bottom: -150px;
291
292    }
293
294    .circles li:nth-child(1) {
295      left: 25%;
296      width: 80px;
297      height: 80px;
298      animation-delay: 0s;
299    }
300
301
302    .circles li:nth-child(2) {
303      left: 10%;
304      width: 20px;
305      height: 20px;
306      animation-delay: 2s;
307      animation-duration: 12s;
308    }
309
310    .circles li:nth-child(3) {
311      left: 70%;
312      width: 20px;
313      height: 20px;
314      animation-delay: 4s;
315    }
316
317    .circles li:nth-child(4) {
318      left: 40%;
319      width: 60px;
320      height: 60px;
321      animation-delay: 0s;
322      animation-duration: 18s;
323    }
324
325    .circles li:nth-child(5) {
326      left: 65%;
327      width: 20px;
328      height: 20px;
329      animation-delay: 0s;
330    }
331
332    .circles li:nth-child(6) {
333      left: 75%;
334      width: 110px;
335      height: 110px;
336      animation-delay: 3s;
337    }
338
339    .circles li:nth-child(7) {
340      left: 35%;
341      width: 150px;
342      height: 150px;
343      animation-delay: 7s;
344    }
345
346    .circles li:nth-child(8) {
347      left: 50%;
348      width: 25px;
349      height: 25px;
350      animation-delay: 15s;
351      animation-duration: 45s;
352    }
353
354    .circles li:nth-child(9) {
355      left: 20%;
356      width: 15px;
357      height: 15px;
358      animation-delay: 2s;
359      animation-duration: 35s;
360    }
361
362    .circles li:nth-child(10) {
363      left: 85%;
364      width: 150px;
365      height: 150px;
366      animation-delay: 0s;
367      animation-duration: 11s;
368    }
369
370    @keyframes animate {
371
372      0% {
373        transform: translateY(0) rotate(0deg);
374        opacity: 1;
375        border-radius: 0;
376      }
377
378      100% {
379        transform: translateY(-1000px) rotate(720deg);
380        opacity: 0;
381        border-radius: 50%;
382      }
383
384    }
385  </style>
386
387  <link rel="manifest" href="./manifest.json">
388  
388<script>
389    if ('serviceWorker' in navigator) {
390      navigator.serviceWorker.register('./service-worker.js').then(function () {
391        console.log('Service Worker Registered');
392      });
393    }
394  </script>
394
395
396</head>
397
398<body>
399
400  <div class="header p-3">
401    <center>
402      <div class="flex flex-row items-center header-area">
403        <div class="basis-3/5"><input type="text" name="text1" id="text" size="15" autocomplete="off" autofocus
404            placeholder="Search" /></div>
405        <div class="basis-2/5 count-title">現在の掲載数<br><span id="count"></span></div>
406      </div>
407    </center>
408    <!--<div class="last_update text-xs px-1"><time datetime="2024-06-03" itemprop="modified">最終更新日:2024.06.03</time> ver
409      1.1</div>-->
410  </div>
411
412  <div class="area">
413    <ul class="circles">
414      <li></li>
415      <li></li>
416      <li></li>
417      <li></li>
418      <li></li>
419      <li></li>
420      <li></li>
421      <li></li>
422      <li></li>
423      <li></li>
424    </ul>
425  </div>
426
427  <div class="main">
428
429    <div id="result"></div>
430
431  </div>
432
433  <!-- ポップアップ用のoverlay -->
434  <div id="overlay"></div>
435
436  <!-- 使い方 -->
437  <div id="beginner"><span id="closed-btn">×</span>
438    <h3 class="text-2xl text-center"><i class="fa-solid fa-user"></i> はじめに</h3>
439
440    <div class="overflow-y-scroll overview mt-5 mx-2">
441      <img src="./images/fish.jpg" width="100%" alt="魚の写真">
442
443      <h3 class="text-2xl mt-7" id="manual_h3">魚偏の漢字を集めよう!</h3>
444
445      <p class="mt-5">魚偏の漢字はいくつあるか、ご存知ですか?</p>
446      <p class="mt-5">答えは、678種類あります。</p>
447      <p class="mt-5">全ての魚偏の漢字を書ける方は、いらっしゃいますでしょうか?</p>
448      <p class="mt-5">なかなか難しいと思います。</p>
449      <p class="mt-5">生成AIにも聞いてみました。</p>
450      <p class="mt-5">AIにより、240種類とか400種類以上とか、様々な答えが返ってきました。</p>
451      <p class="mt-5">でも、678種類と正確に答えたAIは存在しませんでした。</p>
452
453      <h3 class="text-2xl mt-7" id="manual_h3">AIが知らない?では、どうする?</h3>
454
455      <p class="mt-5">ここからが本題です。</p>
456      <p class="mt-5">AIが答えを持っていない課題となりました。</p>
457      <p class="mt-5">あなたなら、どうやって678種類集めますか?</p>
458      <p class="mt-5">AIへの聞き方を変えてみる!良いですね。</p>
459      <p class="mt-5">図書館に行く、寿司屋に行く!その行動力、大変良いと思います。</p>
460      <p class="mt-5">このアプリの本髄は「そこ」にあります。</p>
461
462      <h3 class="text-2xl mt-7" id="manual_h3">規制は簡単、でもそれだけで良いの?</h3>
463
464      <p class="mt-5">僕の学生時代、先生方からよく言われました。</p>
465      <p class="mt-5">「電子辞書は使わないように!」</p>
466      <p class="mt-5">「WikiPediaは使わないように!」</p>
467      <p class="mt-5">この言葉には、先生達の「意図」があります。</p>
468      <p class="mt-5">電子辞書では、その単語周辺の知識が得られづらい。</p>
469      <p class="mt-5">WikiPediaなど、ネットに載っている情報は全て正しいとは限らない。</p>
470      <p class="mt-5">電子辞書、WikiPediaから今は生成AIに代わっているだけで、やっていることは変わっていないと思います。</p>
471      <p class="mt-5">でも、本当にそれだけで良いのでしょうか?</p>
472
473      <h3 class="text-2xl mt-7" id="manual_h3">どんな題材を子ども達に提供するのか?</h3>
474
475      <p class="mt-5">僕は、生成AIはどんどん使っていくべきと思っています。</p>
476      <p class="mt-5">これからの時代は、AIを使いこなす人間が生き残っていくと思っているからです。</p>
477      <p class="mt-5">そこを理解していないと、本当にAIに仕事を奪われる人が増えていきます。</p>
478      <p class="mt-5">だからこそ、AIと人間の共生を考えていく、そのような教育が必要と考えます。</p>
479      <p class="mt-5">規制するのは簡単です。でも、それだけでは全く足りていません。</p>
480      <p class="mt-5">大事なのは、AIも知らないような課題を大人が考え、子ども達に提供していく。</p>
481      <p class="mt-5">そして、AIと、とことん向き合ってもらう、そういう環境を整えること。</p>
482      <p class="mt-5">今の時代の教育の「本質」はここにあると思っています。</p>
483      <p class="mt-5">魚偏の漢字が何種類あるのか、AIは知らなかった。</p>
484      <p class="mt-5">これだ!と思いました。</p>
485      <p class="mt-5">まだまだ、探せば色んな課題を作れると思います。</p>
486      <p class="mt-5">このアプリがAIと人間の共生を考える、そんな機会を与えられたら本望です。</p>
487
488      <p class="mt-5">齋藤 仁志. </p>
489    </div>
490
491  </div>
492
493  <!-- 使い方 -->
494  <div id="manual"><span id="closed-btn2">
494×</span>
495    <h3 class="text-2xl text-center"><i class="fa-solid fa-book-open"></i> 使い方</h3>
496
497    <div class="overflow-y-scroll overview mt-5 mx-2">
498
499      <h3 class="text-2xl" id="manual_h3">インストール方法</h3>
500      <p class="mt-5">PWAに対応しているので、iPhone、Androidともに、WEBブラウザの「ホーム画面に追加」からインストールできます。</p>
501      <img src="./images/install.jpg" width="100%" class="mt-5" alt="インストール方法の画像">
502
503      <h3 class="text-2xl mt-7" id="manual_h3">あいうえお順</h3>
504      <p class="mt-5">魚偏の漢字はあいうえお順に並んでいます。</p>
505      <p class="mt-5">どんな漢字があるのか、ザクっと眺めてみましょう!</p>
506      <p class="mt-5">生成AIが知っていた漢字は◯、知らなかった感じには×がついています。</p>
507      <p class="mt-5">データ更新日は生成AIからの回答が得られた日です。</p>
508      <p class="mt-5">その時は、答えられなくても、今は答えられるかもしれません。</p>
509
510      <h3 class="text-2xl mt-7" id="manual_h3">検索機能</h3>
511      <p class="mt-5">Searchのテキストボックスに漢字やかなと入れると、検索できます。</p>
512      <p class="mt-5">この漢字は登録されているかな?と思ったら、検索してみてください。</p>
513
514      <h3 class="text-2xl mt-7" id="manual_h3">投稿をお待ちしています</h3>
515      <p class="mt-5">もし、アプリに登録されていない漢字を見つけたら「投稿する」ボタンより、情報提供をお願いします。</p>
516      <p class="my-5">皆さまの投稿をお待ちしております。</p>
517
518    </div>
519
520  </div>
521
522
523  <!--<div class="sns-fb">
524    <div class="fb-share-button" data-href="https://fish-kanji.netlify.app/" data-layout="button_count"
525      data-size="small"></div>
526  </div>-->
527
528  <div class="pagetop">
529    <div class="pagetop_arrow"></div>
530  </div>
531
532  <!-- フッター -->
533  <div id="footer" class="footer p-2 text-center">
534    <div class="grid gap-4 grid-cols-3 grid-rows-1">
535      <div class="beginner-btn"><i class="fa-solid fa-user"></i> はじめに</div>
536      <div class="manual-btn"><i class="fa-solid fa-book-open"></i> 使い方</div>
537      <a href="https://forms.gle/teKKGRseRjFs7Jxu9" target="_blank">
538        <div class="post"><i class="fa-solid fa-envelope"></i> 投 稿</div>
539      </a>
540    </div>
541    <p class="text-xs mt-1">
542      <i class="fa-regular fa-copyright"></i> <a href="https://hitoshi2s.netlify.app/" target="_blank">齋藤 仁志</a>. ver
543      1.0
544    </p>
545
546  </div>
547
548  
548<script type="module">
549
550    const result = document.querySelector("#result");
551    const count = document.querySelector("#count");
552    let gpt;
553
554    result.innerHTML = "";
555
556    /* 最初のロード時 */
557    onload = async () => {
558
559      const topButton = document.querySelector(".pagetop");
560
561      topButton.addEventListener("click", () => {
562
563        $('body,html').animate({ scrollTop: 0 }, 1000);
564        return false;
565
566      });
567
568      const id = "AKfycbw8pOlBgPxDYeYhRqqkp7qJFFK0e456Osr0FSiKvEEtTZHvhEHOuXK82OxB2JfuP7m7";
569
570      const res = await fetch("https://script.google.com/macros/s/" + id + "/exec");
571      const data = await res.json();
572      console.log(data);
573
574
575      //const data = await d3.csv('./data/word.csv');
576      const max = data.length;
577
578      //data.sort((a, b) => a.yomi.localeCompare(b.yomi), 'ja');
579
580      count.innerHTML = max + " 件 / 678 件"
581
582      for (let i = 0; i < max; i++) {
583
584        /*if (data[i].ai == "y") {
585          gpt = "◯";
586        }
587        else {
588          gpt = "×";
589        }*/
590
591        let dd = new Date(data[i].update);
592        let day = dd.toLocaleDateString();
593
594        result.innerHTML += '<div class="table grid grid-rows-3 grid-cols-3 grid-flow-col gap-2 items-center"><div class="item_title text-8xl row-span-3">' + data[i].word + '</div><div class="text-lg col-span-3">' + data[i].yomi + '</div><div class="text-sm row-span-1 col-span-3">' + data[i].meaning + " 画数:" + data[i].stroke + "</span><span id='update'>データ更新日:" + day + '</span></div>';
595
596      };
597
598    };
599
600    /* 検索ボタン押下時 */
601    document.getElementById('text').addEventListener('keyup',
602
603      async () => {
604
605        const id = "AKfycbw8pOlBgPxDYeYhRqqkp7qJFFK0e456Osr0FSiKvEEtTZHvhEHOuXK82OxB2JfuP7m7";
606        const res = await fetch("https://script.google.com/macros/s/" + id + "/exec");
607        const data = await res.json();
608
609        //const data = await d3.csv('./data/word.csv');
610        const max = data.length;
611
612        //data.sort((a, b) => a.yomi.localeCompare(b.yomi), 'ja');
613
614        if (text.value != "") {
615
616          result.innerHTML = "";
617
618          let kensaku = text.value;
619
620          let count = 0;
621
622          for (let j = 0; j < max; j++) {
623
624            if (data[j].word.indexOf(kensaku) != -1 || data[j].yomi.indexOf(kensaku) != -1 || data[j].meaning.indexOf(kensaku) != -1) {
625
626              /*if (data[j].ai == "y") {
627                gpt = "◯";
628              }
629              else {
630                gpt = "×";
631              }*/
632
633              let dd = new Date(data[j].update);
634              let day = dd.toLocaleDateString();
635
636              result.innerHTML += '<div class="table grid grid-rows-3 grid-cols-3 grid-flow-col gap-2 items-center"><div class="item_title text-8xl row-span-3">' + data[j].word + '</div><div class="text-lg col-span-3">' + data[j].yomi + '</div><div class="text-sm row-span-1 col-span-3">' + data[j].meaning + " 画数:" + data[j].stroke + "</span><span id='update'>データ更新日:" + day + '</span></div>';
637
638              count += 1;
639
640
641            } else {
642
643            };
644
645          };
646
647        } else {
648
649          result.innerHTML = "";
650
651          const id = "AKfycbw8pOlBgPxDYeYhRqqkp7qJFFK0e456Osr0FSiKvEEtTZHvhEHOuXK82OxB2JfuP7m7";
652          const res = await fetch("https://script.google.com/macros/s/" + id + "/exec");
653          const data = await res.json();
654
655          //const data = await d3.csv('./data/word.csv');
656          const max = data.length;
657
658          //data.sort((a, b) => a.yomi.localeCompare(b.yomi), 'ja');
659
660          for (let i = 0; i < max; i++) {
661
662            /*if (data[i].ai == "y") {
663              gpt = "◯";
664            }
665            else {
666              gpt = "×";
667            }*/
668
669            result.innerHTML += '<div class="table grid grid-rows-3 grid-cols-3 grid-flow-col gap-2 items-center"><div class="item_title text-8xl row-span-3">' + data[i].word + '</div><div class="text-lg col-span-3">' + data[i].yomi + '</div><div class="text-sm row-span-1 col-span-3">' + data[i].meaning + " 画数:" + data[i].stroke + "</span><span id='update'>データ更新日:" + data[i].update + '</span></div>';
670
671          };
672
673        };
674
675      }
676
677    );
678
679    /* 使い方のポップアップ表示 */
680    const beginner_btn = document.querySelector('.beginner-btn');
681    const manual_btn = document.querySelector('.manual-btn');
682    const overlay = document.querySelector('#overlay');
683
684    beginner_btn.addEventListener('click', () => {
685      $('#overlay').fadeIn();
686      $('#beginner').fadeIn();
687    });
688
689    manual_btn.addEventListener('click', () => {
690      $('#overlay').fadeIn();
691      $('#manual').fadeIn();
692    });
693
694    overlay.addEventListener('click', () => {
695      $('#overlay').fadeOut();
696      $('#beginner').fadeOut();
697      $('#manual').fadeOut();
698    });
699
700    const closed_btn = document.querySelector("#closed-btn");
701    const closed_btn2 = document.querySelector("#closed-btn2");
702
703    closed_btn.addEventListener('click', () => {
704      $('#overlay').fadeOut();
705      $('#beginner').fadeOut();
706    });
707
708    closed_btn2.addEventListener('click', () => {
709      $('#overlay').fadeOut();
710      $('#manual').fadeOut();
711    });
712
713  </script>
713
714
715  <!-- Facebookシェアボタン 
716  <div id="fb-root"></div>
717  
717<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v19.0"
718    nonce="Pm3nh7PB"></script>
718-->
719
720  <!-- Google tag (gtag.js) -->
vendor: 66 bytes, lines 720-721
720
721  <script async src="https://www.googletagmanager.com/gtag/js?id=
721G-MPP84V2NHB
vendor: 14 bytes, lines 721-722
721"></script>
722  
722<script>
723    
vendor: 143 bytes, lines 723-727
723window.dataLayer = window.dataLayer || [];
724    function gtag() { dataLayer.push(arguments); }
725    gtag('js', new Date());
726
727    gtag('config', '
727G-MPP84V2NHB
vendor: 6 bytes, lines 727-728
727');
728  
728</script>
728
729
730</body>
731
732</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.