<template>
<div class="comCon">
<!-- 你是头部区域的内容 -->
<headback class="header" @back='back'>
<span>地图</span>
</headback>
<!-- 你是内容部分 -->
<div class="bodyCont">
<!-- 内容区 -->
<div class="const-me">
<!-- 个人中心部分-->
<div class="person-content">
获取用户的当前位置信息<br/>
<button @click="getUserLocation()">获取位置</button>
<button @click="getCurrentCenter()">获取中心位置</button>
<div id="map">地图加载中...</div>
</div>
<div>
<button @click="scanFile()">浏览文件</button>
</div>
</div>
</div>
</div>
</template> <script>
import {mixins} from 'assets/js/mixins'
import picker from 'base/picker/picker'
import headback from 'base/head/head-back'
import i18n from "assets/js/vi18n/i18n.js" export default {
mixins:[mixins],
i18n,
components: {
picker,
headback
},
data(){
return {
}
},
mounted(){
// H5 plus事件处理
if(window.plus){
console.log(1);
this.plusReady();
console.log(1.1);
}else{
console.log(2);
document.addEventListener("plusready",this.plusReady(),false);
console.log(2.1);
}
},
methods: {
scanFile(){
var vm=this;
var fileURL='http://report.zkteco.com/file/globalservice/pdf/%E9%9B%86%E8%AE%AD%E8%90%A51_%E7%9C%8B%E5%9B%BE%E7%8E%8B_1526894807867.pdf';
console.log(1001);
if(fileURL !=''){
plus.nativeUI.actionSheet({
cancel: 'Cancel',
buttons: [{
title: 'Download the file'
}, {
title: 'OK'
}]
}, function(e) {
var i = e.index;
if(i == 1) {
}else if(i == 2) {
console.log(1002);
plus.nativeUI.showWaiting('');
var localURL = vm.getLocalImg(fileURL);
vm.openfiles(localURL);/*打开文件*/
}else{
}
});
return false;
}
console.log(1003);
},
/*检测文件是否存在并打开*/
openfiles (localURL) {
let vm=this;
console.log(1004);
plus.io.resolveLocalFileSystemURL(plus.io.convertAbsoluteFileSystem(localURL), function(entry) {
plus.nativeUI.closeWaiting();
// localURL = plus.io.convertLocalFileSystemURL(localURL);
plus.runtime.openFile( plus.io.convertAbsoluteFileSystem(localURL), null, function () {
plus.nativeUI.alert( 'The file could not be opened', function(){}, official, 'OK');
});
}, function(e) {
setTimeout(function() {
console.log(1005);
vm.openfiles(localURL);/*等待图片下载完成*/
},300);
});
},
//获取缓存图片
getLocalImg(source){
let vm=this;
if(source == null || source == '' || source == 'undefined'){
return '';
}else if(source.indexOf('../public')==0){
return source;
} source = source.indexOf('http')<0? (webRoot + source) : source; var lastName = source.split('/').pop();
var localName = "_downloads/" + lastName;
plus.io.resolveLocalFileSystemURL(localName, function(entry) {
}, function(e) {
vm.downloadSource(source,localName);
});
return plus.io.convertLocalFileSystemURL(localName);
},
/*下载图片到缓存*/
downloadSource (source,localName) {
var regChinese = /[\u4E00-\u9FA5]/g;
var tmpLoadUrl = source.replace(regChinese, 'chineseRemoveAfter');
if (tmpLoadUrl.indexOf('chineseRemoveAfter') != -1) {
source = encodeURI(source);
}
var dtask = plus.downloader.createDownload(source,{filename:localName}, function ( d, status ) {
if ( status == 200 ) {
console.log(d.filename);
}else{
console.log('error');
}
});
dtask.start();
},
plusReady(){
console.log(2.12);
var point = new plus.maps.Point(116.347496,39.970191);
plus.maps.Map.reverseGeocode(point,{},function(event){
var address = event.address; // 转换后的地理位置
var point = event.coord; // 转换后的坐标信息
var coordType = event.coordType; // 转换后的坐标系类型
alert("Address:"+address);
},function(e){
alert("Failed:"+JSON.stringify(e));
});
console.log(1.12);
},
// 获取当前地图显示的地图中心点位置
getCurrentCenter(){
map.getCurrentCenter( function ( state, point ){
if( 0 == state ){
alert( JSON.stringify(point) );
}else{
alert( "Failed!" );
}
} );
},
getUserLocation(){
// 获取用户的当前位置信息
map.getUserLocation( function ( state, point ){
if( 0 == state ){
alert( JSON.stringify(point) );
}else{
alert( "Failed!" );
}
} );
},
back(){
this.$router.go(-1);
},
},
watch: { }
}
</script> <style scoped lang="stylus" rel="stylesheet/stylus">
@import '~assets/stylus/veriable.styl'
.comCon
position fixed
top 0
left 0
right 0
bottom 0
z-index 16
background $color-background-all
.const-me
.person-content
background #ffffff
div
min-height 18.75rem </style>
<template>
<div class="comCon">
<!-- 你是头部区域的内容 -->
<headback class="header" @back='back'>
<span>相机</span>
</headback>
<!-- 你是内容部分 -->
<div class="bodyCont">
<!-- 内容区 -->
<div class="const-me">
<!-- 个人中心部分-->
<div class="person-content">
<!-- <div @click="onPlusReady">Camera : 摄像头对象</div> -->
<!-- <div @click="captureImage1">Camera : 拍照1</div> -->
<div @click="captureImage">Camera : 拍照</div>
<div @click="videoCapture">Camera : 摄像头</div>
</div>
</div>
</div>
</div>
</template> <script>
import {mixins} from 'assets/js/mixins'
import picker from 'base/picker/picker'
import headback from 'base/head/head-back'
import i18n from "assets/js/vi18n/i18n.js" export default {
mixins:[mixins],
i18n,
components: {
picker,
headback
},
data(){
return {
probeType:3,
totalHeight:[],
pos:0,
currentIndex:1,
showFooter:false,
data:[],
scrollEndx:true,
person:[
{
text:"edit_password",
icon:'iconfont icon-edit',
path:'editPassword'
},
{
text:"personal_message",
icon:'iconfont icon-wxbzhanghu',
path:'personInfo'
},
{
text:"pay_attention_to_people",
icon:'iconfont icon-group',
path:'attention'
}
]
}
},
created () {
this.keydata=[];
},
methods: {
onPlusReady(){
var cmr = plus.camera.getCamera();
},
captureImage(){
var cmr = plus.camera.getCamera();
var res = cmr.supportedImageResolutions[0];
var fmt = cmr.supportedImageFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
var path='storage/emulated/0/DCIM/Camera/';
///private/var/root/Media/DCIM
var ua = navigator.userAgent.toLowerCase();
if (/iphone|ipad|ipod/.test(ua)) {
path='private/var/root/Media/DCIM/';
} else if (/android/.test(ua)) {
path='storage/emulated/0/DCIM/Camera/';
}
cmr.captureImage(function(path){
  plus.gallery.save(path);
})
// cmr.captureImage( function( path ){
// alert( "Capture image success: " + path );
// },
// function( error ) {
// alert( "Capture image failed: " + error.message );
// },
// {resolution:res,format:fmt}
// );
},
captureImage1(){
// interface CameraOption {
// attribute String 'storage/emulated/0/DCIM/Camera/';
// },
var cmr = plus.camera.getCamera();
var res = cmr.supportedImageResolutions[0];
var fmt = cmr.supportedImageFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
cmr.captureImage( function( path ){
alert( "Capture image success: " + path );
},
function( error ) {
alert( "Capture image failed: " + error.message );
},
{resolution:res,format:fmt}
);
},
videoCapture(){
// interface CameraOption {
// attribute String '/storage/emulated/0/DCIM/Camera/';
// },
var cmr = plus.camera.getCamera();
var res = cmr.supportedVideoResolutions[0];
var fmt = cmr.supportedVideoFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
var path='/storage/emulated/0/DCIM/Camera/';
cmr.captureImage(function(path){
  plus.gallery.save(path);
}),
cmr.startVideoCapture( function( path ){
alert( "Capture video success: " + path );
},
function( error ) {
alert( "Capture video failed: " + error.message );
},
{resolution:res,format:fmt}
);
},
back(){
this.$router.go(-1);
},
},
mounted(){
document.addEventListener( "plusready", onPlusReady, false );
var r = null;
},
watch: { }
}
</script> <style scoped lang="stylus" rel="stylesheet/stylus">
@import '~assets/stylus/veriable.styl'
.comCon
position fixed
top 0
left 0
right 0
bottom 0
z-index 16
background $color-background-all
.const-me
.person-content
background #ffffff
div
padding 8px
</style>
<template>
<div class="comCon">
<!-- 你是头部区域的内容 -->
<headback class="header" @back='back'>
<span>地图this</span>
</headback>
<!-- 你是内容部分 -->
<div class="bodyCont">
<!-- 内容区 -->
<div class="const-me">
<!-- 个人中心部分-->
<div class="person-content">
获取用户的当前位置信息<br/>
<button @click="getUserLocation()">获取位置</button>
<button @click="getCurrentCenter()">获取中心位置</button>
<div id="map">地图加载中...</div>
</div>
</div>
</div>
</div>
</template> <script>
import {mixins} from 'assets/js/mixins'
import picker from 'base/picker/picker'
import headback from 'base/head/head-back'
import i18n from "assets/js/vi18n/i18n.js" export default {
mixins:[mixins],
i18n,
components: {
picker,
headback
},
data(){
return {
em:null,
map:null,
}
},
mounted(){
this.getKey();
},
methods: {
// 获取当前地图显示的地图中心点位置
getCurrentCenter(){
map.getCurrentCenter( function ( state, point ){
if( 0 == state ){
alert( JSON.stringify(point) );
}else{
alert( "Failed!" );
}
} );
},
getKey(){
let vm=this;
// H5 plus事件处理
if(window.plus){
vm.plusReady();
}else{
document.addEventListener("plusready",vm.plusReady(),false);
}
// DOMContentloaded事件处理
document.addEventListener("DOMContentLoaded",function(){
em=document.getElementById("map");
vm.plusReady();
},false);
},
plusReady(){
// 确保DOM解析完成
if(!em||!window.plus||map){return};
map = new plus.maps.Map("map");
map.centerAndZoom( new plus.maps.Point(116.3977,39.906016), 12 );
},
getUserLocation(){
// 获取用户的当前位置信息
map.getUserLocation( function ( state, point ){
if( 0 == state ){
alert( JSON.stringify(point) );
}else{
alert( "Failed!" );
}
} );
},
back(){
this.$router.go(-1);
},
},
watch: { }
}
</script> <style scoped lang="stylus" rel="stylesheet/stylus">
@import '~assets/stylus/veriable.styl'
.comCon
position fixed
top 0
left 0
right 0
bottom 0
z-index 16
background $color-background-all
.const-me
.person-content
background #ffffff
div
min-height 18.75rem </style>

使用hbuilder打包时,调用地图和相机的更多相关文章

  1. 【原创分享·支付宝支付】HBuilder打包APP调用支付宝客户端支付

    前言 最近有点空余时间,所以,就研究了一下APP支付.前面很早就搞完APP的微信支付了,但是由于时间上和应用上的情况,支付宝一直没空去研究.然后等我空了的时候,发现支付宝居然升级了支付逻辑,虽然目前还 ...

  2. springboot+layui实现PC端用户的增删改查 & 整合mui实现app端的自动登录和用户的上拉加载 & HBuilder打包app并在手机端下载安装

    springboot整合web开发的各个组件在前面已经有详细的介绍,下面是用springboot整合layui实现了基本的增删改查. 同时在学习mui开发app,也就用mui实现了一个简单的自动登录和 ...

  3. android 调用地图

    有时候我们需要调用地图显示一下位置,这时候可能还需要导航,导航做起来有点麻烦,如果调用第三方的是不是很简单,本文就是写这个来的: 第一种方式:android Intent调用地图应用客户端 调用百度地 ...

  4. ArcGIS API for Silverlight 当DataGrid选中项时,地图聚焦弹出窗口,并可以播放音频文件

    原文:ArcGIS API for Silverlight 当DataGrid选中项时,地图聚焦弹出窗口,并可以播放音频文件 先看效果图,然后上代码: <UserControl x:Class= ...

  5. 打包时,node内存溢出问题解决方法

    在使用npm run build打包时,遇到node内存溢出问题. 网上查找到的决绝方案.解决方案一: 安装increase-memory-limit插件,扩大node的内存限制 但是,这个解决方案在 ...

  6. 解决Hbuilder打包的apk文件按手机返回键直接退出软件

    问题描述:Hbuilder打包的app如果点击手机返回键,app会直接退出,返回不了上一页. 写在公共js文件中,每个页面均引入该js,代码如下: document.addEventListener( ...

  7. 【方法】移动端H5如何调用相册和相机上传图片、音频、视频

    在移动端上传图片方法很简单,使用HTML5中的input:file供文件上传. <一>常用属性值: 1.accept:规定文件上传来提交的文件类型,此属性只能和type:file配合使用 ...

  8. 刷新或关闭时调用onbeforeunload

    Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于on ...

  9. 利用Maven打包时,如何包含更多的资源文件

    首先,来看下MAVENx项目标准的目录结构: 一般情况下,我们用到的资源文件(各种xml,properites,xsd文件等)都放在src/main/resources下面,利用maven打包时,ma ...

随机推荐

  1. WMPageController设置menuView的左右视图

    效果图如下: 绿色的是自定义的emenuView的rightView哟!!! 代码实现如下: // // CategoryVC.m // JSHui // // Created by Apple on ...

  2. charles修改响应体

    一.修改响应体(只要勾选了主导航Tools--rewrite之后,则请求会一直被修改) 目的:需要测试数据为空,为纯英文,纯数字等多种情况,为了不麻烦后端的技术人员一支来配置,那么咱们就可以改造数据啦 ...

  3. kubeadm安装集群系列-3.添加工作节点

    添加工作节点 worker通过kubeadm join加入集群,加入所需的集群的token默认24小时过期 查看Token kubeadm token list # 如果失效创建一个新的 kubead ...

  4. 安装keystone

    在控制节点上执行 controllerHost='controller' MYSQL_PASSWD='m4r!adbOP' RABBIT_PASSWD='0penstackRMQ' ADMIN_PAS ...

  5. 如何让FasterTransformer支持动态batch和动态sequence length

    FasterTransformer 算子 nvidia在开源的FasterTransformer的代码中,提供tensorrt和tensorflow的自定义算子编译和py调用示例,详见FasterTr ...

  6. D3学习之坐标系绘制

    坐标轴的绘制我们需要搞清楚以下三个要点: 1).axis函数 2)..call()函数用于组合 3).坐标轴的平移旋转 关于第三点其实就是"transform","tra ...

  7. AttributeError: module 'unittest' has no attribute 'TestCase'

    一个自己给自己挖的坑 大家千万不要用库的名称命名,特别是刚刚入门的时候.文件夹.文件,都不要用库的名称. 一旦与库重名,就会出现这种 AttributeError. 引以为戒,以后我再这么命名,我就是 ...

  8. Redis(1.14)Redis日常管理与维护

    [1]持久化 如果不做持久化,用replication去保证可用性,另外最后可以通过引用从数据库同步最新数据. 因此注释掉所有的持久化策略,添加一条带空字符串参数的save指令,也能移除之前所有配置的 ...

  9. Spring Cloud Feign接口返回流

    身无彩凤双飞翼,心有灵犀一点通. 服务提供者 @GetMapping("/{id}") public void queryJobInfoLogDetail(@PathVariabl ...

  10. 小白简单快速搭建lnmp环境(centos7)

    本来想着自己搭建lnmp,由于php包下载不下来因此这次本人使用的lnmp一键包搭建的环境(很遗憾还没有php7.3.5)很详细并且方便快捷网址https://lnmp.org/install.htm ...