--- /dev/null
+<!DOCTYPE html>
+<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+ <meta charset="utf-8">
+ <link rel="stylesheet" href="CSS/bootstrap-grid.css">
+ <link rel="stylesheet" href="CSS/get_coordinate.css">
+ <title>WITs-coordinate</title>
+</head>
+<body onLoad="main()">
+ <header>
+ <a href="./index.html">Go to WITs-home</a>
+ <h2>Get coordinate</h2>
+ </header>
+ <main>
+
+ <div class="container">
+ <div class="row">
+ <div class="col-md-6" id="coordinate_canvas_block">
+ <h2>Display</h2>
+ <div id="current_coordinate">
+ [Mouse over in canvas]
+ </div>
+ <form name="image_form" onSubmit="return false;">
+ <!--Microscope magnification ×<input type="number" name="magnification_microscope" value="1"><br>-->
+ length of pixel <input type="number" name="pixel_length" placeholder="is none" step="0.001">
+ <select id="order1">
+ <option value="3">mm</option>
+ <option value="6">μm</option>
+ <option value="9">nm</option>
+ <option value="10">Å</option>
+ </select>
+ </form>
+ <canvas id="coordinate_canvas"></canvas>
+ <div id="manipulation_area">
+ <h2>Manipulate Display</h2>
+ <form name="form1" onSubmit="return false;">
+ <input type="file" name="image" accept="image/*" onChange="loadFile(this.files)">
+ <p>
+ Scaling × <input type="number" name="magnification" value="1.00" min="1.00" step="0.01" style="width: 50px;" onChange="scaling()"><br>
+ Move x <input type="number" name="movex" value="0" onChange="moving()"><br>
+ Move y <input type="number" name="movey" value="0" onChange="moving()"><br>
+ <input type="button" name="reset" value="Reset manipulation" onClick="reseting()"><br>
+ </p>
+ </form>
+ </div>
+ </div>
+ <div class="col-md-6">
+ <div id="table_area">
+ <h2>Coordinate list</h2>
+ <form name="list_form" onSubmit="return false;">
+ <font>-CSV format Upload-</font>
+ <input type="file" value="Upload" onChange="upload_csv(this.files)">
+ <br>
+ <font>-STAR format Upload-</font>
+ <input type="file" value="Upload" onChange="upload_star(this.files)">
+ <br>
+ <font>unit [</font>
+ <select id="order2">
+ <option value="3">mm</option>
+ <option value="6">μm</option>
+ <option value="9">nm</option>
+ <option value="10">Å</option>
+ </select>
+ <font>]</font>
+ <input type="button" value="All clear" onClick="all_clear()">
+ </form>
+ <div id="table">
+ <table id="coordinate_table">
+ <thead id="coordinate_table_thead">
+ <tr>
+ <th id="number">No.</th>
+ <th id="coordinate_x">x</th>
+ <th id="coordinate_y">y</th>
+ <th id="coordinate_z">z</th>
+ <th id="button">button</th>
+ </tr>
+ </thead>
+ <tbody id="coordinate_table_tbody">
+ </tbody>
+ </table>
+ </div>
+ <form name="download_form" onSubmit="return false;">
+ <font>-CSV format Download-</font><br>
+ <input type="text" id="filename" placeholder="filename" >.txt
+ <input type="button" value="Download" onClick="download()">
+ <a id="download_link"></a><br>
+ <font>-STAR format Download-</font><br>
+ <input type="text" id="filename_star" placeholder="filename" >.txt
+ <input type="button" value="Download" onClick="download_star()">
+ <a id="download_link_star"></a>
+ </form>
+ </div>
+ </div>
+ </div>
+ </div>
+ </main>
+ <footer>
+ <p></p>
+ </footer>
+ <!--script-->
+ <script type="text/javascript" src="JS/coordinate.js"></script>
+</body>
+</html>
\ No newline at end of file