diff --git a/src/islands/note-x/components/notes/ImageNote/ImageNote.tsx b/src/islands/note-x/components/notes/ImageNote/ImageNote.tsx
index 691eec10..37efb1d1 100644
--- a/src/islands/note-x/components/notes/ImageNote/ImageNote.tsx
+++ b/src/islands/note-x/components/notes/ImageNote/ImageNote.tsx
@@ -1,20 +1,12 @@
 import type { NoteComponent, NoteComponentProps } from "../../notes-utils"
 import { type SetStoreFunction } from "solid-js/store"
-import { createEditorTransaction, createTiptapEditor } from 'solid-tiptap'
-import StarterKit from '@tiptap/starter-kit'
 import type { ImageNoteData } from "./types"
-import { Match, Show, Switch, createEffect, createMemo, createSignal } from "solid-js"
-import { removeIconSize } from "../../../utils/icon/removeIconSize"
+import { Show, createMemo, createSignal } from "solid-js"
 
-import IconNote from '@tabler/icons/note.svg?raw'
-import IconNoteOff from '@tabler/icons/note-off.svg?raw'
-
-import type { Editor } from "@tiptap/core"
 import { Dialog } from "../../utils/Dialog"
 import { Controller } from "../../note-components/Controller"
 import { noteBookState, setNoteBookState } from "../../../store"
 import { ScanedImageEditor } from "./components/ScanedImageEditor"
-import type { Sheets } from "./components/Sheet"
 import Player from "./components/Player"
 
 export interface Props extends NoteComponentProps {
@@ -36,6 +28,9 @@ export const ImageNote = ((props: Props) => {
   const [isShowEditor, setIsShowEditor] = createSignal(false)
   return <div onClick={() => {
     props.focus()
+    if (noteBookState.isEditMode) {
+      setIsShowEditor(true)
+    }
   }}>
     <Show when={isShowCloseDialog()}>
       <Dialog onClose={(result) => {
@@ -56,7 +51,7 @@ export const ImageNote = ((props: Props) => {
         }
         props.setNoteData('blobs', 'scanedImage', data.image)
         props.setNoteData('canToJsonData', 'sheets', data.sheets)
-      }} scanedImage={props.noteData.blobs.scanedImage} sheets={props.noteData.canToJsonData.sheets} />
+      }} noteData={props.noteData} setNoteData={props.setNoteData} />
     </Show>
 
     {/* 本体 */}
diff --git a/src/islands/note-x/components/notes/ImageNote/components/EditorCoreX.tsx b/src/islands/note-x/components/notes/ImageNote/components/EditorCoreX.tsx
index 62074c4e..63ca6071 100644
--- a/src/islands/note-x/components/notes/ImageNote/components/EditorCoreX.tsx
+++ b/src/islands/note-x/components/notes/ImageNote/components/EditorCoreX.tsx
@@ -1,4 +1,4 @@
-import { createEffect, onMount, onCleanup, createSignal } from 'solid-js'
+import { createEffect, onMount, onCleanup, createSignal, Show } from 'solid-js'
 import Sheet, { type Sheets } from './Sheet'
 
 import IconArrowsMove from '@tabler/icons/arrows-move.svg?raw'
@@ -6,17 +6,22 @@ import IconHighlight from '@tabler/icons/highlight.svg?raw'
 import IconEraser from '@tabler/icons/eraser.svg?raw'
 
 import { removeIconSize } from '../../../../utils/icon/removeIconSize'
+import { Dialog } from '../../../utils/Dialog'
 
 export interface Props {
   scanedImage?: Blob | undefined
 
-  changeSheets (sheets: Sheets): void
+  changeSheets(sheets: Sheets): void
 
   sheets?: Sheets
+
+  rescan (): void
 }
 
 export default (props: Props) => {
-  const [editMode, setEditMode] = createSignal<'move' | 'paint' | 'clear'>('move')
+  const [editMode, setEditMode] = createSignal<'move' | 'paint' | 'clear'>(
+    'move'
+  )
 
   const [imageUrl, setImageUrl] = createSignal<string>()
   const [imageSize, setImageSize] = createSignal<{
@@ -27,10 +32,13 @@ export default (props: Props) => {
     h: 0,
   })
   const [sheets, setSheets] = createSignal<Sheets>(props.sheets ?? [])
-  const [tmpSheet, setTmpSheet] = createSignal<{
-    sheet: Sheets[number]
-    pointerId: number
-  } | number>()
+  const [tmpSheet, setTmpSheet] = createSignal<
+    | {
+        sheet: Sheets[number]
+        pointerId: number
+      }
+    | number
+  >()
 
   createEffect(() => {
     props.changeSheets(sheets())
@@ -44,7 +52,7 @@ export default (props: Props) => {
     image.onload = () => {
       setImageSize({
         w: image.width,
-        h: image.height
+        h: image.height,
       })
     }
     image.src = blobImageUrl
@@ -53,11 +61,13 @@ export default (props: Props) => {
   const [editorPosition, setEditorPosition] = createSignal({
     x: 0,
     y: 0,
-    size: 1
+    size: 1,
   })
 
   let editorContainer!: HTMLDivElement
-  const [editorContainerRect, setEditorContainerRect] = createSignal<DOMRect>(new DOMRect())
+  const [editorContainerRect, setEditorContainerRect] = createSignal<DOMRect>(
+    new DOMRect()
+  )
   onMount(() => {
     const observer = new ResizeObserver(() => {
       setEditorContainerRect(editorContainer.getBoundingClientRect())
@@ -69,22 +79,25 @@ export default (props: Props) => {
     const pointerXByEditor = evt.clientX - editorContainerRect().left
     const pointerYByEditor = evt.clientY - editorContainerRect().top
 
-    const positionX = (pointerXByEditor - editorPosition().x) / editorPosition().size
-    const positionY = (pointerYByEditor - editorPosition().y) / editorPosition().size
-    return [
-      Math.floor(positionX),
-      Math.floor(positionY)
-    ]
+    const positionX =
+      (pointerXByEditor - editorPosition().x) / editorPosition().size
+    const positionY =
+      (pointerYByEditor - editorPosition().y) / editorPosition().size
+    return [Math.floor(positionX), Math.floor(positionY)]
   }
-  let pointersData: Record<string, {
-    isDowned: boolean,
-    last: PointerEvent
-  } | undefined> = {}
+  let pointersData: Record<
+    string,
+    | {
+        isDowned: boolean
+        last: PointerEvent
+      }
+    | undefined
+  > = {}
   const pointerDown = (evt: PointerEvent) => {
     evt.preventDefault()
     pointersData[evt.pointerId] = {
       isDowned: true,
-      last: evt
+      last: evt,
     }
     const currentEditMode = editMode()
     if (currentEditMode === 'paint') {
@@ -99,10 +112,10 @@ export default (props: Props) => {
           positions: [],
           startPosition: {
             x: positionX,
-            y: positionY
+            y: positionY,
           },
-          weight: 30 / editorPosition().size
-        }
+          weight: 30 / editorPosition().size,
+        },
       })
     }
   }
@@ -111,13 +124,13 @@ export default (props: Props) => {
     if (!(evt.pointerId in pointersData)) {
       pointersData[evt.pointerId] = {
         isDowned: false,
-        last: evt
+        last: evt,
       }
     }
     const thisPointer = pointersData[evt.pointerId]!
     const currentEditMode = editMode()
     if (currentEditMode === 'move') {
-      if (Object.values(pointersData).filter(e => e?.isDowned).length === 1) {
+      if (Object.values(pointersData).filter((e) => e?.isDowned).length === 1) {
         // タッチしているポインターが一つ
         if (pointersData[evt.pointerId]?.isDowned) {
           const movementX = evt.screenX - thisPointer.last.screenX
@@ -126,7 +139,7 @@ export default (props: Props) => {
           setEditorPosition({
             x: editorPosition().x + movementX,
             y: editorPosition().y + movementY,
-            size: editorPosition().size
+            size: editorPosition().size,
           })
           console.log(editorPosition())
         }
@@ -150,10 +163,10 @@ export default (props: Props) => {
               ...lastTmpSheet.sheet.positions,
               {
                 x: positionX,
-                y: positionY
-              }
-            ]
-          }
+                y: positionY,
+              },
+            ],
+          },
         })
       }
     }
@@ -168,10 +181,7 @@ export default (props: Props) => {
       return
     }
     if (nowTmpSheet?.pointerId === evt.pointerId) {
-      setSheets([
-        ...sheets(),
-        nowTmpSheet?.sheet
-      ])
+      setSheets([...sheets(), nowTmpSheet?.sheet])
       setTmpSheet()
     }
   }
@@ -179,7 +189,7 @@ export default (props: Props) => {
     const lastEditorPosition = editorPosition()
     setEditorPosition({
       ...lastEditorPosition,
-      size: lastEditorPosition.size * (evt.deltaY > 0 ? 0.9 : 1.1)
+      size: lastEditorPosition.size * (evt.deltaY > 0 ? 0.9 : 1.1),
     })
   }
   const sheetClicked = (sheetIndex: number) => {
@@ -190,79 +200,119 @@ export default (props: Props) => {
       setTmpSheet(Math.random())
     }
   }
-  return <div>
-    <div class="w-full h-[calc(100dvh-200px)]">
-      <div class="bg-black w-full h-full overflow-hidden"
-        classList={{
-          'touch-none': editMode() !== 'clear'
-        }}
-        ref={editorContainer}
+  const [getRescanConfirm, setRescanConfirm] = createSignal(false)
+  return (
+    <div>
+      <Show when={getRescanConfirm()}>
+        <Dialog type='confirm' onClose={(ok) => {
+          if (ok) {
+            props.rescan()
+          }
+          setRescanConfirm(false)
+        }} title="Confirm">
+          本当に再スキャンしますか？このデータは失われます。
+        </Dialog>
+      </Show>
+      <div class="w-full h-[calc(100dvh-200px)]">
+        <div
+          class="bg-black w-full h-full overflow-hidden"
+          classList={{
+            'touch-none': editMode() !== 'clear',
+          }}
+          ref={editorContainer}
         >
-        <div class="relative" style={{
-          width: imageSize().w + 'px',
-          height: imageSize().h + 'px',
-        }}>
-          <div class="origin-top-left" style={{
-            transform: `translateX(${editorPosition().x}px) translateY(${editorPosition().y}px) scale(${editorPosition().size})`
-          }}>
-            <div class="absolute top-0 left-0">
-              <img class="pointer-events-none select-none" src={imageUrl()} alt='image' />
-            </div>
-            <div class="absolute top-0 left-0 w-full h-full">
-              <Sheet
-                isPlayMode={false}
-                sheets={[...sheets(), ...(() => {
-                  const nowTmpSheet = tmpSheet()
-                  return (nowTmpSheet && typeof nowTmpSheet !== 'number') ? [nowTmpSheet.sheet] : []
-                })()]}
-                onClickSheet={sheetClicked}
-                width={imageSize().w}
-                height={imageSize().h}
-              />
-            </div>
-          </div>
           <div
-            class="absolute top-0 left-0"
-            classList={{
-              'hidden': editMode() === 'clear'
-            }}
+            class="relative"
             style={{
-              width: editorContainerRect().width + 'px',
-              height: editorContainerRect().height + 'px'
+              width: imageSize().w + 'px',
+              height: imageSize().h + 'px',
             }}
-            onPointerDown={pointerDown}
-            onPointerMove={pointerMove}
-            onPointerUp={pointerUp}
-            onPointerCancel={pointerUp}
-            
-            onWheel={onWheel}>
-
+          >
+            <div
+              class="origin-top-left"
+              style={{
+                transform: `translateX(${editorPosition().x}px) translateY(${
+                  editorPosition().y
+                }px) scale(${editorPosition().size})`,
+              }}
+            >
+              <div class="absolute top-0 left-0">
+                <img
+                  class="pointer-events-none select-none"
+                  src={imageUrl()}
+                  alt="image"
+                />
+              </div>
+              <div class="absolute top-0 left-0 w-full h-full">
+                <Sheet
+                  isPlayMode={false}
+                  sheets={[
+                    ...sheets(),
+                    ...(() => {
+                      const nowTmpSheet = tmpSheet()
+                      return nowTmpSheet && typeof nowTmpSheet !== 'number'
+                        ? [nowTmpSheet.sheet]
+                        : []
+                    })(),
+                  ]}
+                  onClickSheet={sheetClicked}
+                  width={imageSize().w}
+                  height={imageSize().h}
+                />
+              </div>
+            </div>
+            <div
+              class="absolute top-0 left-0"
+              classList={{
+                hidden: editMode() === 'clear',
+              }}
+              style={{
+                width: editorContainerRect().width + 'px',
+                height: editorContainerRect().height + 'px',
+              }}
+              onPointerDown={pointerDown}
+              onPointerMove={pointerMove}
+              onPointerUp={pointerUp}
+              onPointerCancel={pointerUp}
+              onWheel={onWheel}
+            ></div>
           </div>
         </div>
       </div>
+      <div class="flex my-2 justify-center gap-5">
+        <div class="flex gap-2">
+          <button
+            class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
+            onClick={() => {
+              setEditMode('move')
+            }}
+            disabled={editMode() === 'move'}
+          >
+            <div innerHTML={removeIconSize(IconArrowsMove)} class="w-8 h-8" />
+          </button>
+          <button
+            class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
+            onClick={() => {
+              setEditMode('paint')
+            }}
+            disabled={editMode() === 'paint'}
+          >
+            <div innerHTML={IconHighlight} class="w-8 h-8" />
+          </button>
+          <button
+            class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
+            onClick={() => {
+              setEditMode('clear')
+            }}
+            disabled={editMode() === 'clear'}
+          >
+            <div innerHTML={IconEraser} class="w-8 h-8" />
+          </button>
+        </div>
+        <div>
+          <button class="text-button" onClick={() => setRescanConfirm(true)}>ReScan</button>
+        </div>
+      </div>
     </div>
-    <div class="my-2 flex justify-between">
-      <button class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
-        onClick={() => {
-          setEditMode('move')
-        }}
-        disabled={editMode() === 'move'}>
-        <div innerHTML={removeIconSize(IconArrowsMove)} class="w-8 h-8" />
-      </button>
-      <button class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
-        onClick={() => {
-          setEditMode('paint')
-        }}
-        disabled={editMode() === 'paint'}>
-        <div innerHTML={IconHighlight} class="w-8 h-8" />
-      </button>
-      <button class="grid hover:drop-shadow drop-shadow-none disabled:drop-shadow-none disabled:bg-gray-100 rounded-full p-1 bg-white border"
-        onClick={() => {
-          setEditMode('clear')
-        }}
-        disabled={editMode() === 'clear'}>
-        <div innerHTML={IconEraser} class="w-8 h-8" />
-      </button>
-    </div>
-  </div>
+  )
 }
diff --git a/src/islands/note-x/components/notes/ImageNote/components/ScanedImageEditor.tsx b/src/islands/note-x/components/notes/ImageNote/components/ScanedImageEditor.tsx
index e1d78989..852248e4 100644
--- a/src/islands/note-x/components/notes/ImageNote/components/ScanedImageEditor.tsx
+++ b/src/islands/note-x/components/notes/ImageNote/components/ScanedImageEditor.tsx
@@ -1,70 +1,88 @@
-import { Show, createEffect, createSignal, onMount } from "solid-js"
-import { Dialog, createDialog } from "../../../utils/Dialog"
-import EditorCore from "./EditorCoreX"
-import type { Sheets } from "./Sheet"
+import { Show } from 'solid-js'
+import { Dialog, createDialog } from '../../../utils/Dialog'
+import EditorCore from './EditorCoreX'
+import type { Sheets } from './Sheet'
+import type { ImageNoteData } from '../types'
+import type { SetStoreFunction } from 'solid-js/store'
 
 export interface Props {
   onEnd(data: ScanedImageEditedData | null): void
-  scanedImage?: Blob
-  sheets?: Sheets
+  noteData: ImageNoteData
+  setNoteData: SetStoreFunction<ImageNoteData>
 }
 export interface ScanedImageEditedData {
   sheets: Sheets
   image: Blob
 }
 export const ScanedImageEditor = (props: Props) => {
-  const [scanedImageBlob, setScanedImageBlob] = createSignal<Blob | undefined>(props.scanedImage)
   const dialog = createDialog<boolean>()
-  
+
   let scanInputRef!: HTMLInputElement
 
   const reScan = () => {
     scanInputRef.oninput = () => {
-      if (!scanInputRef.files){
+      if (!scanInputRef.files) {
         return
       }
       const imageFile = scanInputRef.files[0]
       if (!imageFile) {
         return
       }
-      setScanedImageBlob(() => imageFile)
+      props.setNoteData('blobs', 'scanedImage', imageFile)
     }
     scanInputRef.click()
   }
-  const [sheets, setSheets] = createSignal<Sheets>(props.sheets ?? [])
-  return <Dialog type="custom" dialog={dialog} title="編集" onClose={(result) => {
-    const nowScanedImageBlob = scanedImageBlob()
-    props.onEnd((result && nowScanedImageBlob) ? {
-      sheets: sheets(),
-      image: nowScanedImageBlob
-    } : null)
-  }} class="ml-5">
-    <input ref={scanInputRef} type="file" class="hidden" />
-    <div>
-      <Show when={!scanedImageBlob()}>
-        <button class="outlined-button" onClick={reScan}>スキャン!</button>
-      </Show>
-    </div>
-    <div>
-      <Show when={scanedImageBlob()}>
-        <div>
-          <EditorCore
-            scanedImage={scanedImageBlob()}
-            changeSheets={(sheets) => {
-              setSheets(sheets)
-            }}
-            sheets={sheets()}
-            />
-        </div>
-        <div class="flex justify-center gap-5 items-center">
-          <button class="outlined-button" onClick={() => dialog.close(false)}>
-            キャンセル
+  return (
+    <Dialog
+      type="custom"
+      dialog={dialog}
+      title="編集"
+      onClose={(result) => {
+        const nowScanedImageBlob = props.noteData.blobs.scanedImage
+        props.onEnd(
+          result && nowScanedImageBlob
+            ? {
+                sheets: props.noteData.canToJsonData.sheets,
+                image: nowScanedImageBlob,
+              }
+            : null
+        )
+      }}
+      class="ml-5"
+    >
+      <input ref={scanInputRef} type="file" class="hidden" />
+      <div>
+        <Show when={!props.noteData.blobs.scanedImage}>
+          <button class="outlined-button" onClick={reScan}>
+            スキャン!
           </button>
-          <button class="filled-button" onClick={() => dialog.close(true)}>
-            完了
-          </button>
-        </div>
-      </Show>
-    </div>
-  </Dialog>
+        </Show>
+      </div>
+      <div>
+        <Show when={props.noteData.blobs.scanedImage}>
+          <div>
+            <EditorCore
+              scanedImage={props.noteData.blobs.scanedImage}
+              changeSheets={(sheets) => {
+                props.setNoteData('canToJsonData', 'sheets', sheets)
+              }}
+              sheets={props.noteData.canToJsonData.sheets}
+              rescan={() => {
+                props.setNoteData('canToJsonData', 'sheets', [])
+                props.setNoteData('blobs', 'scanedImage', undefined)
+              }}
+            />
+          </div>
+          <div class="flex justify-center gap-5 items-center">
+            <button class="outlined-button" onClick={() => dialog.close(false)}>
+              キャンセル
+            </button>
+            <button class="filled-button" onClick={() => dialog.close(true)}>
+              完了
+            </button>
+          </div>
+        </Show>
+      </div>
+    </Dialog>
+  )
 }