Q&A
コードはコードブロック（```）で囲んだ方が見やすく表示されます。詳しく見ていませんが「変数の値をCSVとして出力したい」というだけの話であればビーコン関連の処理は載せる必要が無いと思います。コード丸々載せるだけでなく、どこで何をしようとしてなぜ詰まっているのかを具体的に記入したほうがいいと思います。
##前置き
monacaを使いスマートフォンアプリを作成しています。
アプリの概要はiBeaconを用いてスタンプラリーを行うというものです。
##やりたいこと
スタンプラリーの拠点にあるiBeaconの近くに行ったとき、拠点に到着した痕跡を残すためにCSVファイルに書き込んで、保存し、チェックシートにある変数に「〇」を入れたいのですがCSVに書き込む方法が分かりません。
##ソースコード
【index.html】
</ons-navigator> </html></head> <body> <!-- ビーコン --> <ons-navigator var="beaconNavigator"> <ons-page ng-controller="TopPageCtrl"> <!-- トップ画面 --> <div data-role="page" id="list-page" bgcolor="#90ee90"> <div data-role="header" data-position="fixed" data-theme="c"></div> <center> <h1>Top page</h1> <img src="top.png" width="350" height="450" alt="map"><br/><br/> <input type="button" onclick="location.href='sheet.html?bk=1'" value="チェックシート" style="WIDTH: 100%; HEIGHT: 40px"> <input type="button" onclick="location.href='map.html?bk=1'" value="地図" style="WIDTH: 100%; HEIGHT: 40px"> </center> </div> </ons-page>
【main.js】
var app = angular.module('BeaconProject', ['onsen']);
var deviceUUid = 12345;
app.service('iBeaconService', function() {
this.currentIdentifier = null; // 監視対象のビーコンID
this.onDetectCallback = function() {};
// ビーコンの情報（配列） var beacons = { "tkd-i-001": { name:'tkd-i-001', uuid:'48534442-4C45-4144-80C0-180000000000', major:200, minor:1, icon:'icon/1.jpg', // url:'http://snowsss.php.xdomain.jp/insert.php', url:'info-page1.html', rssi:-63, proximity:'Unknown', }, "tkd-i-002": { name:'tkd-i-002', uuid:'48534442-4C45-4144-80C0-180000000000', major:1, minor:1, icon:'icon/2.jpg', url:'info-page2.html', rssi:-63, proximity:'Unknown', }, "tkd-i-003": { name:'tkd-i-003', uuid:'48534442-4C45-4144-80C0-180000000000', major:200, minor:2, icon:'icon/3.jpg', url:'info-page3.html', rssi:-63, proximity:'Unknown', }, "tkd-i-004": { name:'tkd-i-004', uuid:'48534442-4C45-4144-80C0-180000000000', major:200, minor:3, icon:'icon/4.jpg', url:'info-page4.html', rssi:-63, proximity:'Unknown', } }; this.beacons = beacons; // ビーコン登録 createBeacons = function() { var result = []; try { angular.forEach(beacons, function(value) { // ビーコンの情報（配列）を基にビーコンを登録する。 result.push(new cordova.plugins.locationManager.BeaconRegion(value.name, value.uuid, value.major, value.minor)); }); } catch(e) { alert('createBeacon error: '+e); } return result; }; // ビーコン監視 this.watchBeacons = function(callback) { document.addEventListener("deviceready", function() { deviceUUid = device.uuid; var beacons = createBeacons(); // ビーコン登録へ try { var delegate = new cordova.plugins.locationManager.Delegate(); // 領域内のビーコンの状態を決定するとき delegate.didDetermineStateForRegion = function(pluginResult) { log('[DOM] didDetermineStateForRegion: '+JSON.stringify(pluginResult)); }; // 領域内のビーコンの監視を開始したとき delegate.didStartMonitoringForRegion = function(pluginResult) { log('[DOM] didStartMonitoringForRegion: '+JSON.stringify(pluginResult)); }; // 領域内のビーコンを受信したとき delegate.didRangeBeaconsInRegion = function(pluginResult) { var beaconData = pluginResult.beacons[0]; var uuid = pluginResult.region.uuid.toUpperCase(); var identifier = pluginResult.region.identifier; if(!beaconData || !uuid) { return; } callback(beaconData, identifier); }; window.locationManager = cordova.plugins.locationManager; locationManager.setDelegate(delegate); // iOS関係？ // required in iOS 8+（iOS8以上なら下の文にする） locationManager.requestWhenInUseAuthorization(); // cordova.plugins.locationManager.requestAlwaysAuthorization(); // beacons.forEach(function(beacon) { locationManager.startRangingBeaconsInRegion(beacon); }); } catch(e) { alert('delegate error: '+e); } }, false); };
});
// 「top-page」の制御
app.controller('TopPageCtrl', ['$scope', 'iBeaconService', function($scope, iBeaconService) {
$scope.beacons = iBeaconService.beacons;
// var testUrl = 'http://snowsss.php.xdomain.jp/test11.php';
var callback = function(deviceData, identifier) { var beacon = $scope.beacons[identifier]; $scope.$apply(function() { beacon.rssi = deviceData.rssi; // ビーコンがかなり近い(rssiが-60以上)のとき if(beacon.rssi > -60) { beacon.proximity = 'Immediate'; // 新しいビーコンの領域に入ったとき if(iBeaconService.currentIdentifier == null) { navigator.vibrate([1000]); // バイブレータ1秒起動 $scope.enterInfoPage(identifier); // 「ページ切り替え」へ } } // ビーコンがまあまあ近い(rssiが-65以上)のとき else if(beacon.rssi > -65) { beacon.proximity = 'Near'; } // ビーコンが遠い(rssiが-70以上)とき else if(beacon.rssi > -70) { beacon.proximity = 'Far'; // 現在監視しているビーコンを監視対象から外す if(iBeaconService.currentIdentifier == identifier) { iBeaconService.currentIdentifier = null; //ビーコンからでたらここにとぶ $scope.beaconNavigator.pushPage('index.html'); } } else { beacon.proximity = 'Unknown'; } }); }; iBeaconService.watchBeacons(callback); var win = null;
// 「info-page」ページの制御
app.controller('InfoPageCtrl', ['$scope', 'iBeaconService', function($scope, iBeaconService) {
$scope.beacon = iBeaconService.beacons[iBeaconService.currentIdentifier];
}]);
【sheet.html】
<!DOCTYPE HTML> <html ng-app="BeaconProject"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="components/loader.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/styles.css"> <link rel="stylesheet" href="css/design.css"> <script src="js/main.js"></script> </head><!-- <center><h1>チェックシート</h1></center> --> <br /> </div><body> <!-- チェックシート画面 --> <div data-role="page" id="ranking-page"> <div data-role="header" data-position="fixed" data-theme="c">
</html><div data-role="content"> <center> <table id="rankingTable" border="1" width="90%" cellspacing="1" cellpadding="5"> <tr> <th align="right" nowrap>畑</th> <td id = "check_2" align="center" width="150">-</td> </table> <br /> <img src="futter.png" width="100%" height="200"> <input type="button" onclick="location.href='index.html?bk=1'" value="戻る" style="WIDTH: 100%; HEIGHT: 40px"> </center> </div> </div> </body>
回答1件
0
ベストアンサー
案件を読んでみる限り、localStorage.setItemで対応可能かと思います。
どうしてもcsvで・・・というのであれば、
https://docs.monaca.io/ja/reference/cordova_6.2/file/
このプラグインを使うのが近道ですが、koronatail様が書き込まれたように、まずは必要な機能の周りのみを記述してください。
投稿2017/01/05 09:49
総合スコア726
回答ありがとうございます。
今後投稿する際は気を付けたいと思います。
どうしてもcsvというわけではないのですが、データベースを使って試みたんですが
、私自身プログラミングが苦手でうまくいかなく、
csvなら簡単に作れるといわれたのでcsvを使ってみようと思いました。
localStorage.setItemとcsvではどちらのほうが容易に実現できますでしょうか。
あなたの回答
tips
プレビュー
