如何把一个项目文件拷贝到nw.js上并使该项目文件起作用

步骤1准备工作

1、注册一个小程序账号，注意这里需要用一个没注册过公众号的邮箱注册2、注册过程中需要很多认证，过程比较繁琐，如果暂时只是开发测试，不进行提审、发布的话，只要完成营业执照号填写就可以了，不需要完成微信认证3、注册完账号，登录，在主页面左边列表中点击设置，然后再设置页面中选开发设置就可以看到appID账号，用于登录开发工具使用

步骤2开发工具

1、可以到官网下载微信web开发者工具

步骤3开始项目

1、打开开发者工具，选择小程序选项，到达添加项目页面，这个时候在前面设置页面的appID就能用到了

2、如果项目目录中的文件夹是空的，则会提示是否创建quick start 项目，选择“是”，开发者工具会帮助我们在开发目录里生成一个简单的Demo这个Demo拥有一个完整的小程序的大概框架

步骤4框架1、微信小程序中的每一个页面的（路径+页面名）都需要写在 APPjson 的 pages 中，且 pages 中的第一个页面是小程序的首页

2、在 iOS 上，小程序的 javascript 代码是运行在 JavaScriptCore 中在 Android 上，小程序的 javascript 代码是通过 X5 内核来解析在 开发工具上， 小程序的 javascript 代码是运行在 nwjs（chrome内核） 中，所以开发工具上的效果跟实际效果会有所差异

步骤51、组件

微信提供了许多组件，主要分为八种：视图容器、基础内容、表单组件、 *** 作反馈、导航、媒体组件、地图、画布包含view、scroll-view、form等等普通常用的组件，也提供了地图MAP、画布CANVAS组件主要属于视图层，通过wxml来进行结构布局，类似于html,通过wxss修改样式，类似于CSS组件使用语法实例这是一个普通的视图这是样式修改过的视图更多的组件及相关使用方法可以查看官方文档

步骤61、API网络、数据、媒体、位置、界面、设备、开发接口其中网络请求的使用必须先到公众平台登录小程序账号，在设置页面那里，设置允许访问的域名，网络请求包含了普通的>

微信小程序 setData常用错误解决办法：

1、微信小程序中，在wxrequest({});方法调用成功或者失败之后，有时候会需要获取页面初始化数据data的情况，这个时候，如果使用，thisdata来获取，会出现获取不到的情况，调试页面也会报undefiend。

原因是，在javascript中，this代表着当前对象，会随着程序的执行过程中的上下文改变，在wxrequest({});方法的回调函数中，对象已经发生改变，所以已经不是wxrequest({});方法对象了，data属性也不存在了。官方的解决办法是，复制一份当前的对象，如下：

var that=this;//把this对象复制到临时变量that。在success回调函数中使用thatdata就能获取到数据了。

2、下面就是修改代码，必须setData一下，不然地图不会刷新。

markers: {     iconPath:

"/picture/bikepng",     id: 0,     latitude: 23099994,     longitude:

113324520,     width: 50,     height: 50    }

for(var i = 0; i < resdatalength; i++){         //

thatdatamarkers[i]id=i;          // markid=i;         var param =

{};         var string = "markers["+i+"]id";         param[string] =

resdata[i]Bike_id;                 thatsetData(param);            

var string="markers["+i+"]iconPath";         param[string]

="/picture/bikepng";         thatsetData(param);             var

string = "markers["+i+"]latitude";         param[string] =

resdata[i]BIKE_latitude;                 thatsetData(param);        

          var string = "markers["+i+"]longitude";        

param[string] = resdata[i]BIKE_longitude;                

thatsetData(param);                  var string =

"markers["+i+"]width";         param[string] = 50;                

thatsetData(param);              var string = "markers["+i+"]height";

       param[string] = 50;                 thatsetData(param);        

 / thatsetData({          markers:[{     iconPath:

"/picture/bikepng",     id: 0,     latitude: 23099994,     longitude:

113324520,     width: 50,     height: 50          }]         })/      

  }       //   consolelog(resdata[1])         var

markk=thatdatamarkers;         thatsetData({markers:markk})

小程序setData()设置，百度找到：   >

程序api提供//打图wxopenLocation({longitude:Number(longitude),latitude:Number(latitude),name:name,address:address,scale:1

这里贴下主要代码介绍下：

先是wxml文件：

<map id='parkingMap' class='mp_map' longitude="{{lon}}" latitude="{{lat}}" scale='14' markers='{{markers}}' controls='{{controls}}' bindcontroltap='controltap' bindmarkertap='markertap' show-location='true' bindregionchange='regionchange' bindtap='clickOther'> 1

标签里的属性API文档里都有介绍，应该没什么好说的了；

可以看到在地图上有标记p，点击需要有提示信息，查了下微信map上面无法在继续添加覆盖物，然后看了API文档有个cover-view，于是就用这个来做了个提示信息：

<cover-view class='parkingName'>{{parkingName}}</cover-view>

<cover-view class='space'>

<cover-view class='totalNum'>总车位：<cover-view style='color:red'>{{totalNum}}</cover-view></cover-view>

<cover-view class='leftNum'>剩余车位：<cover-view style='color:red'>{{leftNum}}</cover-view></cover-view>

</cover-view>

</cover-view>

<cover-view class='right'>

<cover-image src='//image/arrow_rightpng' class='arrow'></cover-image>

</cover-view>

</cover-view>

123456789101112131415

注意这里是要添加到map标签里面：<map> <cover-view> </cover-view></map>

加了个if判断，点击地图上的P才显示；

js文件：

初始化data：

//定义全局变量var longitude, latitude, mapCtxvar centerLongitude, centerLatitude, windowWidth, windowHeight /

页面的初始数据

/

data: {

lon: '',

lat: '',

is_show: false,

parkingName:'',

totalNum:'',

leftNum:'',

markers: [],

controls: []

},12345678910111213141516

首先是获取定位，使用微信小程序API提供的方式：

getloca:function(){

var that = this

var time

wxgetLocation({

type: "wgs84 ",

success: function (res) {

consolelog(reslatitude)

consolelog(reslongitude)

latitude = reslatitude

longitude = reslongitude

centerLatitude = latitude

centerLongitude = longitude

thatsetData({

lat: reslatitude,

lon: reslongitude,

})

},

fail: function (res) {

}

})

},1234567891011121314151617181920212223

在实际测试中，发现有的android机掉用改API就是无法定位，测试过所需要的权限都有，最后尝试了下百度地图，居然发现成功了，一下是百度地图定位（具体可以查看百度地图小程序API）的方式：

//引入百度地图apivar bmap = require('//libs/bmap-wxminjs');//百度api定位我的位置

getLocaByBM:function(){

var that = this; var BMap = new bmapBMapWX({

ak: '你自己申请的ak'

}); var fail = function (data) {

consolelog(data)

}; var success = function (data) {

wxMarkerData = datawxMarkerData;

consolelog(wxMarkerData)

centerLatitude = wxMarkerData[0]latitude

centerLongitude = wxMarkerData[0]longitude

thatsetData({

markers: wxMarkerData

});

thatsetData({

lat: wxMarkerData[0]latitude

});

thatsetData({

lon: wxMarkerData[0]longitude

});

} //好像必须要加这个

BMapregeocoding({

fail: fail,

success: success,

iconPath: '//image/centerpng',

iconTapPath: '//img/centerpng',

width:23,

height:40

});

},12345678910111213141516171819202122232425262728293031323334353637

好吧，这次的测试结果苹果，小米，华为，三星均能正常定位了；希望微信以后能改善这个问题吧。

不过这里需要注意一个问题，小程序是基于腾讯地图（使用火星坐标），百度地图定位出来的坐标需要转换才能正确的标识，文末会贴出转换的代码；

下面是map的 *** 作了，常见的几种添加markers，controls，地图移动时的监听处理；

先介绍地图移动的监听处理：

这里可以结合微信API文档来看会更清晰（文笔不好，写的有些乱），先获取map对象：

以上就是关于如何把一个项目文件拷贝到nw.js上并使该项目文件起作用全部的内容，包括:如何把一个项目文件拷贝到nw.js上并使该项目文件起作用、微信小程序的中心经纬度和平常地图的经纬度有什么区别、微信小程序this.setData is not a function报错怎么解决等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！