Skip to content

Commit b9ac61e

Browse files
changy1105changy1105
committed
feat(examples): mobileNet and wine
1 parent c8d18a2 commit b9ac61e

18 files changed

+425
-67
lines changed

‎packages/paddlejs-examples/mobileNet/index.html

+34-20
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,39 @@
66
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
77
<meta name="viewport" content="width=device-width, initial-scale=1">
88
<style>
9-
.demo-nav {
10-
background-color: #2932e1;
11-
color: #fff;
12-
}
13-
.paddle-demo-card {
14-
margin-right: 0;
15-
margin-left: 0;
16-
background-color: #fff;
17-
border: 1px solid #ddd;
18-
}
19-
.infobox {
20-
background-color: #fff;
21-
border-radius: 6px;
22-
margin-bottom: 30px;
23-
padding: 20px;
24-
position: relative;
25-
min-height: 350px;
26-
box-sizing: border-box;
27-
color: #707070;
28-
}
9+
.demo-nav {
10+
background-color: #2932e1;
11+
color: #fff;
12+
}
13+
.paddle-demo-card {
14+
margin-right: 0;
15+
margin-left: 0;
16+
background-color: #fff;
17+
border: 1px solid #ddd;
18+
}
19+
.infobox {
20+
background-color: #fff;
21+
border-radius: 6px;
22+
margin-bottom: 30px;
23+
padding: 20px;
24+
position: relative;
25+
min-height: 350px;
26+
box-sizing: border-box;
27+
color: #707070;
28+
}
29+
#loading {
30+
position: fixed;
31+
top: 0;
32+
left: 0;
33+
z-index: 10;
34+
width: 100vw;
35+
height: 100vh;
36+
line-height: 100vh;
37+
background-color: rgba(0, 0, 0, .4);
38+
color: #fff;
39+
text-align: center;
40+
font-size: 16px;
41+
}
2942
</style>
3043
</head>
3144
<body>
@@ -76,5 +89,6 @@
7689
</div>
7790
</div>
7891
</div>
92+
<div id="loading">loading...</div>
7993
</body>
8094
</html>

‎packages/paddlejs-examples/mobileNet/index.ts

+15-5
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,20 @@
11
import { Runner } from '@paddlejs/paddlejs-core';
22
import registerWebGLBackend from '@paddlejs/paddlejs-backend-webgl';
33
import map from './data/map.json';
4-
// Register the WebGL backend to the global backend registry before initializing runner
4+
55
registerWebGLBackend();
66

77
declare let window: Window & {
88
statistic: any
99
};
10-
window.statistic = [];
10+
window.statistic = {};
11+
let runner;
1112

12-
async function run(input: HTMLElement) {
13+
load();
14+
15+
async function load() {
1316
const path = 'https://paddlejs.cdn.bcebos.com/models/mobileNetV2/model.json';
14-
const runner = new Runner({
17+
runner = new Runner({
1518
modelPath: path,
1619
fileCount: 4,
1720
feedShape: {
@@ -27,8 +30,12 @@ async function run(input: HTMLElement) {
2730
mean: [0.485, 0.456, 0.406],
2831
std: [0.229, 0.224, 0.225]
2932
});
30-
window.statistic.startTime = (+new Date());
3133
await runner.init();
34+
document.getElementById('loading')!.style.display = 'none';
35+
}
36+
37+
async function run(input: HTMLElement) {
38+
window.statistic.startTime = (+new Date());
3239
const res = await runner.predict(input);
3340
window.statistic.endTime = (+new Date()) - window.statistic.startTime;
3441
const maxItem = getMaxItem(res);
@@ -46,6 +53,9 @@ function selectImage(file) {
4653
return;
4754
}
4855
const reader = new FileReader();
56+
const initInnerHTML: string = '...';
57+
document.getElementById('txt')!.innerHTML = initInnerHTML;
58+
document.getElementById('all-performance-time')!.innerHTML = initInnerHTML;
4959
reader.onload = function (evt) {
5060
const img = document.getElementById('image') as HTMLImageElement;
5161
if (evt.target && typeof evt.target.result === 'string') {

‎packages/paddlejs-examples/mobileNet/package.json

+1-14
Original file line numberDiff line numberDiff line change
@@ -12,28 +12,15 @@
1212
"license": "ISC",
1313
"dependencies": {
1414
"@paddlejs/paddlejs-backend-webgl": "0.0.2-beta.3",
15-
"js-file-download": "^0.4.10",
16-
"source-map-loader": "^2.0.0",
17-
"vconsole": "^3.3.2"
15+
"@paddlejs/paddlejs-core": "0.0.2-beta.9"
1816
},
1917
"devDependencies": {
20-
"@babel/preset-env": "^7.9.6",
21-
"@babel/runtime": "^7.7.2",
22-
"@paddlejs/paddlejs-core": "0.0.2-beta.9",
23-
"babel-loader": "^8.2.2",
24-
"clean-webpack-plugin": "^2.0.1",
25-
"css-loader": "^2.1.1",
26-
"extract-text-webpack-plugin": "^4.0.0-beta.0",
27-
"file-loader": "^3.0.1",
2818
"html-webpack-plugin": "^3.2.0",
2919
"jest": "^26.0.1",
30-
"js-file-download": "^0.4.10",
31-
"@paddlejs/paddlejs-backend-webgl": "0.0.2-beta.3",
3220
"ts-jest": "^26.4.4",
3321
"ts-loader": "^8.0.12",
3422
"typescript": "^3.9.5",
3523
"url-loader": "^1.1.2",
36-
"vconsole": "^3.3.2",
3724
"webpack": "^4.29.6",
3825
"webpack-cli": "^3.3.0",
3926
"webpack-dev-server": "^3.2.1"

‎packages/paddlejs-examples/mobileNet/webpack.config.js

+4-28
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
const path = require('path');
22
const os = require('os');
33
const HtmlWebpackPlugin = require('html-webpack-plugin');
4-
const CleanWebpackPlugin = require('clean-webpack-plugin');
5-
const ExtractTextPlugin = require('extract-text-webpack-plugin');
64

7-
// 定义自动获取本地ip的方法开始
5+
// 定义自动获取本地ip
86
function getNetworkIp() {
97
// 打开的host
108
let needHost = '';
@@ -34,52 +32,30 @@ module.exports = {
3432
devServer: {
3533
hot: true,
3634
host: getNetworkIp(),
37-
port: 9000
35+
port: 9002
3836
},
3937
plugins: [
40-
new CleanWebpackPlugin({
41-
// 允许清除在当前脚本的工作目录外边的匹配的文件
42-
dangerouslyAllowCleanPatternsOutsideProject: true
43-
}),
4438
new HtmlWebpackPlugin({
4539
template: './index.html',
4640
inject: 'body',
4741
filename: 'index.html'
48-
}),
49-
new ExtractTextPlugin({
50-
filename: 'index.css'
5142
})
5243
],
5344
resolve: {
5445
// Add ".ts" and ".tsx" as resolvable extensions.
55-
extensions: ['.ts', '.js', '.json']
46+
extensions: ['.ts', '.js']
5647
},
5748
module: {
5849
rules: [
5950
{
6051
test: /\.ts$/,
6152
loader: 'ts-loader',
6253
exclude: /node_modules/
63-
},
64-
{
65-
test: /\.(es6|js)$/,
66-
exclude: /node_modules/,
67-
use: {
68-
loader: 'babel-loader',
69-
options: {
70-
presets: ['@babel/preset-env'],
71-
plugins: ['@babel/transform-runtime']
72-
}
73-
}
74-
},
75-
{
76-
test: /\.(eot|woff|woff2|ttf|svg|png|jpg)$/,
77-
loader: 'url-loader?limit=30000&name=[name].[ext]'
7854
}
7955
]
8056
},
8157
output: {
82-
filename: 'index.js',
58+
filename: '[name].js',
8359
path: path.resolve(__dirname, 'dist')
8460
}
8561
};

‎packages/paddlejs-examples/wine/app.vue

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<template lang="pug">
2+
div
3+
page
4+
5+
</template>
6+
7+
<script lang="ts">
8+
import page from "./page.vue";
9+
export default {
10+
components: {
11+
page
12+
}
13+
};
14+
</script>
15+
16+
<style lang="less" scoped>
17+
.container {
18+
color: green;
19+
}
20+
.text {
21+
color: red;
22+
}
23+
</style>

‎packages/paddlejs-examples/wine/data/wine.map.json

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
[
2+
"aberfeldy",
3+
"ardbea",
4+
"arran",
5+
"balvenie",
6+
"beefeater",
7+
"ben_nevis",
8+
"benriach",
9+
"brewdog",
10+
"bruichladdich",
11+
"bunnahabhain",
12+
"chimay",
13+
"dalmore",
14+
"edradour",
15+
"erdinger",
16+
"glendronach",
17+
"glenfarclas",
18+
"glenlivet",
19+
"glenmorangie",
20+
"glenscotia",
21+
"gordon_macphail",
22+
"g_vine",
23+
"hakushu",
24+
"hibiki",
25+
"hoegaarden",
26+
"jack_daniels",
27+
"jiangxiaobai",
28+
"jiaopianji",
29+
"jim_beam",
30+
"lazy_guys",
31+
"lemonade",
32+
"luxardo",
33+
"macallan",
34+
"maredsous",
35+
"mastons",
36+
"mortlach",
37+
"paoshangou",
38+
"paulaner",
39+
"pearl_necklace",
40+
"rollercoaster",
41+
"shiqimen"
42+
]

‎packages/paddlejs-examples/wine/imgs/1.jpg

443 KB
Loading

‎packages/paddlejs-examples/wine/imgs/2.jpg

419 KB
Loading

‎packages/paddlejs-examples/wine/imgs/3.jpg

683 KB
Loading

‎packages/paddlejs-examples/wine/imgs/4.jpg

469 KB
Loading

‎packages/paddlejs-examples/wine/imgs/5.jpg

467 KB
Loading

‎packages/paddlejs-examples/wine/imgs/6.jpg

481 KB
Loading

‎packages/paddlejs-examples/wine/imgs/7.jpg

439 KB
Loading

‎packages/paddlejs-examples/wine/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>PaddleJS wine</title>
6+
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
7+
</head>
8+
9+
<body>
10+
<div id="app"></div>
11+
</body>
12+
13+
</html>

‎packages/paddlejs-examples/wine/index.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import Vue from 'vue';
2+
import ElementUI from 'element-ui';
3+
import App from './app.vue';
4+
import 'element-ui/lib/theme-chalk/index.css';
5+
6+
Vue.use(ElementUI);
7+
8+
const vm = new Vue({ render: h => h(App) });
9+
vm.$mount('#app');

‎packages/paddlejs-examples/wine/package.json

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
{
2+
"name": "wine",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"dev": "webpack-dev-server",
8+
"build": "webpack",
9+
"test": "echo \"Error: no test specified\" && exit 1"
10+
},
11+
"author": "",
12+
"license": "ISC",
13+
"dependencies": {
14+
"@paddlejs/paddlejs-backend-webgl": "0.0.2-beta.3",
15+
"@paddlejs/paddlejs-core": "0.0.2-beta.9",
16+
"element-ui": "^2.13.2",
17+
"vue": "^2.6.12"
18+
},
19+
"devDependencies": {
20+
"@babel/preset-env": "^7.9.6",
21+
"@babel/runtime": "^7.7.2",
22+
"@babel/plugin-transform-runtime": "^7.6.2",
23+
"babel-loader": "^8.2.2",
24+
"clean-webpack-plugin": "^2.0.1",
25+
"css-loader": "^2.1.1",
26+
"extract-text-webpack-plugin": "^4.0.0-beta.0",
27+
"file-loader": "^3.0.1",
28+
"html-webpack-plugin": "^3.2.0",
29+
"jest": "^26.0.1",
30+
"js-file-download": "^0.4.10",
31+
"ts-jest": "^26.4.4",
32+
"ts-loader": "^8.0.12",
33+
"typescript": "^3.9.5",
34+
"url-loader": "^1.1.2",
35+
"webpack": "^4.29.6",
36+
"webpack-cli": "^3.3.0",
37+
"webpack-dev-server": "^3.2.1",
38+
"@vue/component-compiler-utils": "^3.1.2",
39+
"less": "^3.9.0",
40+
"less-loader": "^4.1.0",
41+
"pug": "^3.0.0",
42+
"pug-filters": "^4.0.0",
43+
"pug-loader": "^2.4.0",
44+
"pug-plain-loader": "^1.1.0",
45+
"vue-hot-reload-api": "^2.3.4",
46+
"vue-loader": "^15.9.6",
47+
"vue-template-compiler": "^2.6.12",
48+
"style-loader": "^0.23.1"
49+
}
50+
}

0 commit comments

Comments
 (0)