Q&A
いつもお世話になっております。
javaの変数をJavascript側に渡す方法で質問があります。
※使用しているフレームワークはspringframeworkです
Jsonconver.classで取得したjsonvalue(json値格納変数)をmap.js
側に渡して、map.js上でjsonvalueを使用できるようにしたいのですが
どうすれば渡すことができるでしょうか?
以上、宜しくお願いします
Java
1//Jsonconver.class 2@Controller 3@EnableAutoConfiguration 4public class Jsonconver { 5 6 @Autowired //リポジトリを紐づけます 7 NewaccountRepository repository; 8 @Autowired //リポジトリを紐づけます 9 DataAccessRepository dataAccessRepository; 10 @Autowired 11 ObjectMapper objectMapper; 12 @RequestMapping(value="/login") 13 @ResponseBody 14 public String home(){ 15 //json値格納変数※jsonvalueをJavascript側に渡す用 16 String jsonvalue; 17 //全件取得します 18 Iterable<Newaccount> list = repository.findAll(); 19 // 取得した内容を出力します 20 for(Newaccount newaccount: list){ 21 try { 22 //jsonvalueをJavascript側に渡します 23 jsonvalue = objectMapper.writeValueAsString(newaccount); 24 return jsonvalue; 25 }catch (JsonProcessingException e) { 26 e.printStackTrace(); 27 } 28 } 29 return null; 30 31 }
javascript
1//map.js 2var getMap = (function() { 3 4 function codeAddress(address) { 5 6 // google.maps.Geocoder()コンストラクタのインスタンスを生成 7 var geocoder = new google.maps.Geocoder(); 8 9 // 地図表示に関するオプション 10 var mapOptions = { 11 zoom: 18, 12 mapTypeId: google.maps.MapTypeId.ROADMAP, 13 // マウスホイールによるズーム操作を無効 14 scrollwheel: false 15 }; 16 17 // 地図を表示させるインスタンスを生成 18 var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 19 20 // geocoder.geocode()メソッドを実行 21 geocoder.geocode( { 'address': address}, function(results, status) { 22 23 // ジオコーディングが成功した場合 24 if (status == google.maps.GeocoderStatus.OK) { 25 26 // google.maps.Map()コンストラクタに定義されているsetCenter()メソッドで 27 // 変換した緯度・経度情報を地図の中心に表示 28 map.setCenter(results[0].geometry.location); 29 30 // 地図上に目印となるマーカーを設定います。 31 // google.maps.Marker()コンストラクタにマーカーを設置するMapオブジェクトと 32 // 変換した緯度・経度情報を渡してインスタンスを生成 33 // →マーカー詳細 34 var marker = new google.maps.Marker({ 35 map: map, 36 position: results[0].geometry.location 37 }); 38 39 // ジオコーディングが成功しなかった場合 40 } else { 41 console.log('Geocode was not successful for the following reason: ' + status); 42 } 43 44 }); 45 46 } 47 48 return { 49 50 getAddress: function() { 51 52 // ボタンに指定したid要素を取得 53 var button = document.getElementById("button"); 54 55 // ボタンが押された時の処理 56 button.onclick = function() { 57 58 // フォームに入力された住所情報を取得 59 var address = document.getElementById("address").value; 60 // 取得した住所を引数に指定してcodeAddress()関数を実行 61 codeAddress(address); 62 63 } 64 65 } 66 67 }; 68 69})(); 70getMap.getAddress(); 71
回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
2017/10/02 07:36