微信小程序echart图

一、文件后缀构成

JSON：

1.app.json小程序配置

page——小程序所有的页面路径

window——小程序所有页面的顶部背景颜色，文字颜色

 1 {
 2   "pages": [
 3    
 4     "pages/index/index",
 5     "pages/logs/logs",
 6     "pages/hvscore/hvscore",
 7     "pages/historyscore/his_score",
 8     "pages/index/page1"
 9   ],
10   "window": {
11     "backgroundTextStyle": "light",
12     "navigationBarBackgroundColor": "#fff",
13     "navigationBarTitleText": "小河儿航旅分查询",
14     "navigationBarTextStyle": "black",
15     "enablePullDownRefresh": "true",
16     "backgroundColor": "#eeeeee"
17   },
18   
19   "networkTimeout": {
20     "request": 10000,
21     "downloadFile": 10000
22   },
23   "debug": true
24 }

2. project.config.json工具配置

工具就自动会帮你恢复到当时你开发项目时的个性化配置，其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。

3.page.json页面配置

用来表示 pages/logs 目录下的 logs.json 这类和小程序页面相关的配置;开发者可以独立定义每个页面的一些属性，例如刚刚说的顶部颜色、是否允许下拉刷新等等。

首页示例

前台：

 1 <view class='box3'>
 2 
 3   <view class="container">
 4     <view class="page-body">
 5       <view class="index-hd">
 6         <image class="logo-avatar" src="../images/hanglvlogo.png"></image>
 7       </view>
 8 
 9       <form bindsubmit="formSubmit" bindreset="formReset">
10         <view class="page-section boder">
11           <input style='text-align:center;' type="number" value='{{mobile}}' class="weui-input" name="mobile" confirm-type='next' placeholder="输入手机号查询您的航旅分" bindinput ="mobile" />
12         </view>
13         <view class='lab1'>您输入的手机号用于确保是您本人在进行查询，航旅分会对您的信息进行保护，绝不会向他人泄漏</view>
14 
15         <view class="btn1">
16           <button type='primary' loading='{{loading}}'  form-type='submit'>下一步</button>
17         </view>
18 
19         <view class='lab1'>航旅分是一个航旅人群的评分系统，通过大数据分析方法，用分值来对乘客在航旅市场的出行行为价值进行度量</view>
20       </form>
21 
22     </view>
23   </view>
24 </view>

View Code