【工具】公用方法抽离——封装共用方法之对象式引入、函数式引入 & 二维数组for循环重新赋值
原始数据处理
var arr = [[1,2],[3,4],[5,6],[7,8]];
var temp = new Array(); //或 var temp = [];
for(var i= 0 ;i< arr.length; i++){
//temp[i] = new Array(); // js二维数组 的赋值 要重新定义一个Arrray
temp[i] = []; // js二维数组 的赋值 要重新定义一个Arrray
temp[i][0] = arr[i][0];
temp[i][1] = arr[i][1];
}
var data = temp[0][0];
console.log(data); // 1
console.log(temp) // [[1, 2], [3, 4], [5, 6], [7, 8]]
方式1:函数式-单独抽离出js文件
第一步:新建方法文件
src/utils/accurate.js
function accurate (arr) {
let temp = [] // 二维数组赋值--坐标数组
for (let i = 0; i < arr.length; i++) {
temp[i] = [];
temp[i][0] = Number(arr[i][0].toFixed(7));
temp[i][1] = Number(arr[i][1].toFixed(7));
}
return temp; // 最终坐标
}
export default accurate
第二步:在页面文件引入使用
index.vue
<script>
import accurate from '@/utils/accurate.js';
// 元数据
attrObj.coordinates[0] =[
[116.3552164, 39.9893523],
[116.3573195, 39.9863926],
[116.3599805, 39.9884973],
[116.3552164, 39.9893523]
]
attrObj.coordinates[0] = accurate(attrObj.coordinates[0]) // 最终坐标
</script>
方式2:对象式-集合到方法对象中
第一步:在方法对象中添加方法
src/utils/algorithm.js
class algorithm {
/**
* 坐标数据处理——支持7位精度方法
* @param {Array} arr 操作坐标数组
* @return {[]}
*/
accurate (arr) { // 传入数组
let temp = [] // 二维数组赋值--坐标数组
for (let i = 0; i < arr.length; i++) {
temp[i] = [];
temp[i][0] = Number(arr[i][0].toFixed(7));
temp[i][1] = Number(arr[i][1].toFixed(7));
}
return temp; // 最终坐标
}
/**
* 编辑平台需求——支持7位精度方法
* @param {Object} obj 操作坐标数组所在对象
* @return {Object} 修改后对象
*/
accurateData (obj) { // 传入对象
if (obj.type === 'Point') { //点
obj.coordinates = obj.coordinates.map(v => Number(v.toFixed(7))) // 最终坐标
}
// 调用当前方法使用 this
if (obj.type === 'LineString') { //线
obj.coordinates = this.accurate(obj.coordinates) // 最终坐标
}
if (obj.type === 'Polygon') { // 面
obj.coordinates[0] = this.accurate(obj.coordinates[0]) // 最终坐标
}
return obj
}
}
export default new algorithm();
第二步:在页面文件引入使用
index.vue
<script>
import algorithm from '@/utils/algorithm.js';
// 第一种情况 调用-传入数组
// 元数据
attrObj.coordinates[0] =[
[116.3552164, 39.9893523],
[116.3573195, 39.9863926],
[116.3599805, 39.9884973],
[116.3552164, 39.9893523]
]
// 最终坐标
attrObj.coordinates[0] = algorithm.accurate(attrObj.coordinates[0])
// 第二种情况 调用-传入对象
// 坐标数组所在对象
attrObj = algorithm.accurateData(attrObj)
</script>