1|--public
2|  |--model
3|     |--model.json
4|     |--chunk_n.dat
5|--src
6|  |--components
7|  |--App.vue
8|  |--config.json
9|  |--env.d.ts
10|  |--label.json
11|  |--main.ts
12|  |--modelInfo.json
13|  |--usePredict.ts
14|--index.html
15|--package.json
16|--READ.md
17|--tsconfig.json
18|--tsconfig.node.json
19|--vite.config.ts
20|--yarn.lock

1vite v2.8.4 dev server running at:
2 > Local: http://localhost:3000/
3 > Network: use `--host` to expose

1[0.4450492858886719, 0.3961234986782074, 0.0122891990467906, 0.14653800427913666]

1[[1, 0.2247152328491211, 0.11200979351997375, 0.07523892819881439, 0.8540866374969482, 0.5503567457199097], [2, 0.1224712328491211, 0.511200979351997375, 0.27523892819881439, 0.8540866374969482, 0.5503567457199097],...]

1// 加载推理引擎
2import {Runner, env} from '@paddlejs/paddlejs-core'; 
3// 使用webgl计算方案(暂不能使用wasm、webgpu等计算方案)
4import '@paddlejs/paddlejs-backend-webgl';
5...
6// 注册引擎
7const runner = new Runner({
8        modelPath: '/model',
9        keepRatio: config.rescale_mode === 'keep_ratio',
10        mean: config.img_mean.reduce((memo, v) => [...memo, +((v / 255).toFixed(3))], [] as number[]),
11        std: config.scale.reduce((memo, v) => [...memo, +((1 / 255 / v).toFixed(3))], [] as number[]),
12        bgr: config.colorFormat === 'BGR',
13        feedShape: {
14            fw: config.resize[0],
15            fh: config.resize[1]
16        }
17    });
18...
19// init runner
20await runner.init();
21...
22// predict and get result
23await runner.predict(img);

1{
2    "dynamicLib": {
3        // 定义一个别名，小程序中用这个别名引用动态库。
4        "paddlejs": {
5            "provider": "paddlejs"
6        }
7    }
8}

1{
2    "usingSwanComponents": {
3        "paddlejs": "dynamicLib://paddlejs/paddlejs"
4    }
5}

1<view class="container">
2    <view>下面这个自定义组件来自于动态库</view>
3    <paddlejs />
4</view>

1<view class="container">
2    <!--index.wxml-->
3    <image style="width:100%; height: 300px; " src="{{imgPath}}"></image>
4    <button bindtap="chooseImage">选择图片</button>
5    <button bindtap="doPredict" class="btn" type="primary">新鲜度预测</button>
6    <!-- 返回结果 -->
7    <view class="result" s-if="resultType">预测结果：{{resultType}}</view>
8    <view class="result" s-if="resultVal">预测可信度：{{resultVal}}</view>
9    <paddlejs options="{{options}}" status="{{status}}" imgBase64="{{imgBase64}}" bindchildmessage="predict" />
10</view>

1Page({
2    data: {
3        imgPath: '',
4        content: '',
5        resultType: '',
6        resultVal: '',
7        isShow: true,
8        options: { // 模型配置项
9            modelPath: 'http://localhost:3000/model',
10            fileCount: 3,
11            needPreheat: true,
12            feedShape: {
13                fw: 224,
14                fh: 224
15            },
16            fetchShape: [1, 7, 1, 1],
17            fill: [255, 255, 255, 255],
18            scale: 256,
19            targetSize: { height: 224, width: 224 },
20            mean: [0.485, 0.456, 0.406],
21            std: [0.229, 0.224, 0.225]
22        },
23        status: '' // 初始值为''， 变为'predict'时会触发模型预测
24    },
25    /**
26     * 选择图片
27     */
28    chooseImage: function () {
29        const me = this;
30        this.setData({
31            ishow: false
32        });
33        swan.chooseImage({
34            count: 1,
35            sizeType: ['original', 'compressed'],
36            sourceType: ['album', 'camera'],
37            success(res) {
38                const path = res.tempFilePaths[0];
39                swan.getFileSystemManager().readFile({
40                    filePath: path,
41                    encoding: 'base64',
42                    success: res => {
43                        me.setData({
44                            imgBase64: res && res.data,
45                            imgPath: path
46                        });
47                    },
48                    fail: res => {
49                        console.log(res);
50                    }
51                });
52            }
53        });
54    },
55    predict(e) {
56        const status = e && e.detail && e.detail.status;
57        if (status === 'loaded') {
58            this.setData({status: 'loaded', isShow: false});
59        }
60        else if (status === 'complete') {
61            const data = e.detail.data;
62            const maxItem = this.getMaxItem(data);
63            this.setData({status: '', resultType: maps[maxItem.index], resultVal: maxItem.value});
64        }
65    },
66    doPredict() {
67        this.setData({status: 'predict'});
68    },
69    getMaxItem(datas = []) {
70        let max = Math.max.apply(null, datas);
71        let index = datas.indexOf(max);
72        return {value: max, index};
73    },
74});