質問編集履歴

1

コードの追加

2022/11/22 12:47

投稿

ohmatsu_420
ohmatsu_420

スコア0

test CHANGED
File without changes
test CHANGED
@@ -9,3 +9,66 @@
9
9
  ###
10
10
 
11
11
 
12
+ ```javascript
13
+ #geolocation APIから取得した緯度軽度
14
+ // ボタンを押した時の処理
15
+ function buttonClick(){
16
+ navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
17
+ };
18
+
19
+ // 取得に成功した場合の処理
20
+ function successCallback(position){
21
+ // 緯度を取得し画面に表示
22
+ var latitude = position.coords.latitude;
23
+ // 経度を取得し画面に表示
24
+ var longitude = position.coords.longitude;
25
+ alert(latitude,longitude)
26
+ var data_place = [latitude,longitude]
27
+ $.ajax({
28
+ url: 'app.py',
29
+ type: 'post',
30
+ data: data_place
31
+ }).done(function(data){
32
+ console.log(data);
33
+ }).fail(function(){
34
+ console.log('failed');
35
+ });
36
+ };
37
+ ```
38
+
39
+ ```python
40
+ def index():
41
+ recieve = sys.stdin.readline()
42
+ print(recieve)
43
+ latitude = recieve[0]
44
+ longitude = recieve[1]
45
+ print(latitude)
46
+
47
+ }
48
+ ```
49
+
50
+ ```HTML
51
+ <!DOCTYPE html>
52
+ <html>
53
+ <head>
54
+ <meta charset="UTF-8">
55
+ <title>Geolocation Sample</title>
56
+ <link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='css/style.css') }}">
57
+ </head>
58
+ <body>
59
+ <div class="center">
60
+ <div class="btn-margin">
61
+ <form action="/search" method="get">
62
+ <input id="btn" type="button" onclick="buttonClick()" value="現在地を取得">
63
+ <a href="http://127.0.0.1:5000/search">次へ</a>
64
+ </form>
65
+ </div>
66
+ </div>
67
+ <script src="{{ url_for( 'static', filename='js/geolocation.js') }}"></script>
68
+ <script src="{{ url_for( 'static', filename='js/style.js') }}"></script>
69
+ <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
70
+ </body>
71
+ </html>
72
+
73
+
74
+ ```