上一篇我们讲了如何进行实现坐标反算。在该篇中我们会讲解如何进行实现建筑坐标转测量坐标的程序。
目录
1.什么是建筑坐标转测量坐标
2.代码实现
3.界面展示
侃侃而谈
从该篇开始程序就会慢慢的越往后越开始有点难度了，所以我想大家应该是蛮期待的，希望你无论晴天还是雨天，无论心情好坏，每天安排的任务都按时完成吧，一起加油遇见美好。
你要相信一点，设计程序是特别累得一件事情改了又改，一个程序从开始到完成足以花上一段时间，而且幸运的是你在这个过程会遇到很多困难，他甚至会让你绝望的。
当你不断的挑战程序的难度时，你的成长会越来越快，虽然那看起来那一点也不酷。
01、什么是建筑坐标转测量坐标？
图设计施工图阶段，常常引入施工坐标系(建筑坐标系)， 施工坐标值与大地浏量坐标值之间就存在一个换算问题，即施工坐标系与大地测量坐标系之间有一旋转角θ。
工程设计中, 为方便设计和施工放线，常常在XY坐标系即测量坐标系基础上引入AB坐标系即施工坐标系。然后在坐标系下以设定的基准点为参照，推算确定各个建构筑物的坐标, 来达到给建构筑物定位的目的。
图1-1 建筑坐标转测量坐标图解
计算公式
xp = (xo + xp * cosα) - (yp * sinα)
yp = (yo + xp * sinα) + (yp * cosα)
02、代码实现
因为代码中都有相应注释，这里我不会做过多的说明。你只需要在微信中任意创建一个page页面就可以编写运行，以下文件的名字只是一个参考。其中样式还是与之前第七篇的样式(centralmeridianis.wxss)一致，由于篇幅有限样式不再做过多说明。
buildtocity.wxml
<mynavbar back="true" home="true" tourl="../../../../../pageBar/component/index" color="rgba(0,0,0,.5)" titleText="建筑坐标转测量坐标">mynavbar><view class="header-text"> <image src="../../../../../icon/other.png">image>O′建筑坐标系原点view><block wx:for="{{listStart}}" wx:key="id"> <view class="centralmerid" id="{{item.id}}"> <view class="centralmerid-border {{item.border ? 'selected-border' : '' }}"> <view class="centralmerid-left-icon"> <image class="img-icon" src="{{item.url}}">image> <text class="left-text">{{item.text}}text> view> <input class="{{item.border ? 'selected-border' : '' }}" type="digit" value="{{cleantext}}" bindfocus="{{item.focous}}" bindblur="{{item.name}}" placeholder="{{item.tips}}">input> <view class="centralmerid-right-text">{{item.unit}}view> view> view>block><view class="header-text"> <image src="../../../../../icon/other.png">image>P在建筑坐标系坐标view><block wx:for="{{listEnd}}" wx:key="id"> <view class="centralmerid" id="{{item.id}}"> <view class="centralmerid-border {{item.border ? 'selected-border' : '' }}"> <view class="centralmerid-left-icon"> <image class="img-icon" src="{{item.url}}">image> <text class="left-text">{{item.text}}text> view> <input class="{{item.border ? 'selected-border' : '' }}" type="digit" value="{{cleantext}}" bindfocus="{{item.focous}}" bindblur="{{item.name}}">input> <view class="centralmerid-right-text">{{item.unit}}view> view> view>block><view class="result-btn" bindtap="multipleTap"> <view class="results"> <button type="primary" style="width:90%;">计算button> view>view><scroll-view class="footer" hidden="{{resultShow}}" scroll-y="true"> <view class="result-inner"> <view class="header-text close fixed-header"> <view class="close"> <image src="../../../../../icon/other.png">image>结果 view> <image src="../../../../../icon/close.png" bindtap="myclose">image> view> <view class="result-inner-inner">Xₚ：<text class="resultColor"> {{xp}}text> ᴹ view> <view class="result-inner-inner">Yₚ：<text class="resultColor">{{yp}}text> ᴹ view> view>scroll-view><view class="footer-text" wx:if="{{resultShow}}"> <view class="footer-text-inner"> <view class="footer-inner">小贴士：单击为计算，双击则为清空。view> <view class="footer-inner">一悲一喜一惘然，一草一木一红颜。view> view>view>buildtocity.json
{ "usingComponents": { "mynavbar":"../../../../../common/resources/navbar/navbar" }}buildtocity.js
Page({ /** * 页面的初始数据 */ data: { xoValue: '', yoValue: '', fwjValue: '', xpValue: '', ypValue: '', cleantext: '', selecteBorder: false, resultShow: true, confirmsure: false, listStart: [{ id: 0, name: 'xoValue', focous: 'xofocous', url: '../../../../../icon/coordinate.png', text: "X₀", unit: 'ᴹ', border: false }, { id: 1, name: 'yoValue', focous: 'yofocous', url: '../../../../../icon/coordinate.png', text: "Y₀", unit: 'ᴹ', border: false }, { id: 2, name: 'fwjValue', focous: 'fwjfocous', url: '../../../../../icon/angle.png', text: "α", unit: '°′″', tips: "请您以 度.分.秒 形式输入方位角", border: false } ], listEnd: [{ id: 3, name: 'xpValue', focous: 'xpfocous', unit: 'm', url: '../../../../../icon/coordinate.png', text: "Xₚ′", unit: 'ᴹ', border: false }, { id: 4, name: 'ypValue', focous: 'ypfocous', url: '../../../../../icon/coordinate.png', text: "Yₚ′", unit: 'ᴹ', border: false } ] }, // 关闭答案 myclose() { this.setData({ resultShow: true }) }, // 获取焦点显示边框 xofocous() { this.setData({ 'listStart[0].border': true }) }, yofocous() { this.setData({ 'listStart[1].border': true }) }, fwjfocous() { this.setData({ 'listStart[2].border': true }) }, xpfocous() { this.setData({ 'listEnd[0].border': true }) }, ypfocous() { this.setData({ 'listEnd[1].border': true }) }, // 失去焦点后获取输入框的值和去掉边框 // 获取X0 xoValue(e) { this.setData({ xoValue: e.detail.value, 'listStart[0].border': false }) }, // 获取y0 yoValue(e) { this.setData({ yoValue: e.detail.value, 'listStart[1].border': false }) }, // 获取方位角 fwjValue(e) { this.setData({ fwjValue: e.detail.value, 'listStart[2].border': false }) }, // 获取Xp xpValue(e) { this.setData({ xpValue: e.detail.value, 'listEnd[0].border': false }) }, // 获取yp ypValue(e) { this.setData({ ypValue: e.detail.value, 'listEnd[1].border': false }) }, // 计算 calculations() { const PI = Math.PI var that = this var xo = Number(that.data.xoValue) //xo var yo = Number(that.data.yoValue) //yo var fwj = that.data.fwjValue //fwj var xp = Number(that.data.xpValue) //xp var yp = Number(that.data.ypValue) //yp var fwjarr = fwj.split(".") //将输入的方位角以点号截取 if (fwj.indexOf(".") < 0) { var fwjarrdu = Number(fwjarr[0]) //截取度 var fwjarrfen = 0 //截取分 var fwjarrmiao = 0 //截取秒 } else { var fwjarrdu = Number(fwjarr[0]) //截取度 var fwjarrfen = Number(fwjarr[1]) //截取分 var fwjarrmiao = Number(fwjarr[2]) //截取秒 } var du = fwjarrdu + fwjarrfen / 60 + fwjarrmiao / 3600 //获取到α var xpp = (xo + xp * Math.cos(du * PI / 180)) - (yp * Math.sin(du * PI / 180)) //测量坐标xp var ypp = (yo + xp * Math.sin(du * PI / 180)) + (yp * Math.cos(du * PI / 180)) //测量坐标yp if (that.data.xoValue == '' || that.data.yoValue == '' || that.data.fwjValue == '' || that.data.xpValue == '' || that.data.ypValue == '') { wx.vibrateShort({}) //开启震动 wx.showModal({ title: '友情提示', content: '请您输入完整的值在进行计算！?', showCancel: false, cancelText: "确定" }) } else { if (fwj.indexOf(".") < 0) { wx.vibrateShort({}) //开启震动 wx.showModal({ title: '友情提示', content: '您当前没有以点号隔开，默认按 度.00.00 计算 ?', success(res) { if (res.confirm) { that.setData({ resultShow: false, xp: getApp().fomatFloat(xpp, 5), yp: getApp().fomatFloat(ypp, 5) }) } } }) } else if (fwj.split(".").length - 1 !== 2) { wx.vibrateShort({}) //开启震动 wx.showModal({ title: '友情提示', content: '角度请您按照所给格式输入，如23.23.1中间必须以点隔开。！?' }) } else { that.setData({ resultShow: false, xp: getApp().fomatFloat(xpp, 5), yp: getApp().fomatFloat(ypp, 5) }) } } }, // 调用最终计算 //单击计算 multipleTap: function (e) { var that = this let curTime = e.timeStamp; let lastTime = that.lastTapDiffTime; that.lastTapDiffTime = curTime; //两次点击间隔小于300ms, 认为是双击 let diff = curTime - lastTime; if (diff < 300) { clearTimeout(that.lastTapTimeoutFunc); // 成功触发双击事件时，取消单击事件的执行 that.setData({ xoValue: '', yoValue: '', fwjValue: '', xpValue: '', ypValue: '', cleantext: '', }) } else { //双击清空 // 单击事件延时300毫秒执行，这和最初的浏览器的点击300ms延时有点像。 that.lastTapTimeoutFunc = setTimeout(function () { that.calculations() }, 300); } }})其中最主要的部分为以下的部分这里实现了角度到度分秒的实现，小程序中都是用的JS代码实现，你也可以用各种编程语言去实现，此处仅作为抛砖引玉。
var that = thisvar xo = Number(that.data.xoValue) //xovar yo = Number(that.data.yoValue) //yovar fwj = that.data.fwjValue //fwjvar xp = Number(that.data.xpValue) //xpvar yp = Number(that.data.ypValue) //ypvar fwjarr = fwj.split(".") //将输入的方位角以点号截取if (fwj.indexOf(".") < 0) { var fwjarrdu = Number(fwjarr[0]) //截取度 var fwjarrfen = 0 //截取分 var fwjarrmiao = 0 //截取秒} else { var fwjarrdu = Number(fwjarr[0]) //截取度 var fwjarrfen = Number(fwjarr[1]) //截取分 var fwjarrmiao = Number(fwjarr[2]) //截取秒}var du = fwjarrdu + fwjarrfen / 60 + fwjarrmiao / 3600 //获取到αvar xpp = (xo + xp * Math.cos(du * PI / 180)) - (yp * Math.sin(du * PI / 180)) //测量坐标xpvar ypp = (yo + xp * Math.sin(du * PI / 180)) + (yp * Math.cos(du * PI / 180)) //测量坐标yp03、展示
图3-1 开发现场
-END-
-预告-
以下小程序是本教程最终要开发的产品可以点击体验，下一篇为从0开发《工程测绘大师》小程序之测量坐标转建筑坐标(十四)
●从0开发《工程测绘大师》小程序之玩转角度与弧度的互相转化篇(十)
●从0开发《工程测绘大师》小程序之坐标正算篇(十一)
●从0开发《工程测绘大师》小程序之坐标反算篇(十二)
“雨”见美好 - “雨”见你
我就知道你“在看”
扫一扫
8428
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
