anilkay/tfffjs.html

## tfffjs.html
<html>
        <script src="https://unpkg.com/@tensorflow/tfjs"></script>
        <script src="https://unpkg.com/@tensorflow/tfjs-automl"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<body>

    <div id="app">
     <h1> {{message}} </h1>
     <input type="file" accept="image/*" @change="onChange" />
     <img id="img" crossorigin src="https://cdntr2.img.sputniknews.com/images/103144/16/1031441609.jpg" width="224" height="224"/>
     <img id="imf" v-if="item.imageUrl" :src="item.imageUrl" />
     <h1>{{onlar}}</h1>
     <h1>{{prediction}}</h1>
     <h1>{{prediction2}}</h1>
     <button v-on:click="predict">Tahmin Et</button>
    </div>
</body>
<script>
let elo=new Vue({
    el:"#app",
    data:{
        message:"Hello",
        data:{},
        onlar:"Evet",
        uc:"",
        item:{image : null,
        imageUrl: null},
        prediction:"a",
        prediction2:"a"
    },
    mounted(){
        var self=this;
        tf.automl.loadImageClassification("path/model.json").then(function(model){
            const imgEl = document.getElementById('img');
            let image=tf.browser.fromPixels(imgEl)
                         .resizeNearestNeighbor([224,224])
                         .toFloat()
                         .expandDims();
             self.data=model; //Modeli Yükledik.

            model.classify(imgEl).then(function(result){
                self.onlar=result;
            });
         })
         .catch(function(error){
             console.log("Bakalim: "+error);
             message=error;
         });
    },
    methods:{
        onChange(e){
            const file = e.target.files[0]
            this.image = file
            this.item.imageUrl = URL.createObjectURL(file)
        },
        predict(){
            let self=this;
            const imgEl = document.getElementById('imf');
            this.data.classify(imgEl).then(function(result){
                if(result[0].prob>0.52){
                    self.prediction=result[0].label;
                }
                else {
                    self.prediction=result[1].label;
                }

                self.prediction2=result;
            });
        }
    }

});

</script>
</html>
	<html>
	<script src="https://unpkg.com/@tensorflow/tfjs"></script>
	<script src="https://unpkg.com/@tensorflow/tfjs-automl"></script>
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	<body>

	<div id="app">
	<h1> {{message}} </h1>
	<input type="file" accept="image/*" @change="onChange" />
	<img id="img" crossorigin src="https://cdntr2.img.sputniknews.com/images/103144/16/1031441609.jpg" width="224" height="224"/>
	<img id="imf" v-if="item.imageUrl" :src="item.imageUrl" />
	<h1>{{onlar}}</h1>
	<h1>{{prediction}}</h1>
	<h1>{{prediction2}}</h1>
	<button v-on:click="predict">Tahmin Et</button>
	</div>
	</body>
	<script>
	let elo=new Vue({
	el:"#app",
	data:{
	message:"Hello",
	data:{},
	onlar:"Evet",
	uc:"",
	item:{image : null,
	imageUrl: null},
	prediction:"a",
	prediction2:"a"
	},
	mounted(){
	var self=this;
	tf.automl.loadImageClassification("path/model.json").then(function(model){
	const imgEl = document.getElementById('img');
	let image=tf.browser.fromPixels(imgEl)
	.resizeNearestNeighbor([224,224])
	.toFloat()
	.expandDims();
	self.data=model; //Modeli Yükledik.

	model.classify(imgEl).then(function(result){
	self.onlar=result;
	});
	})
	.catch(function(error){
	console.log("Bakalim: "+error);
	message=error;
	});
	},
	methods:{
	onChange(e){
	const file = e.target.files[0]
	this.image = file
	this.item.imageUrl = URL.createObjectURL(file)
	},
	predict(){
	let self=this;
	const imgEl = document.getElementById('imf');
	this.data.classify(imgEl).then(function(result){
	if(result[0].prob>0.52){
	self.prediction=result[0].label;
	}
	else {
	self.prediction=result[1].label;
	}

	self.prediction2=result;
	});
	}
	}

	});

	</script>
	</html>