examples/tensorflow/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TensorSpace - LeNet Demo</title>
    <meta name="author" content="syt123450 / https://github.com/syt123450">
    <style>

        html, body {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
        }

        #container {
            width: 100%;
            height: 100%;
            background-color: #000;
        }

    </style>
</head>
<body>

<div id="container"></div>

<script src="../assets/libs/jquery.min.js"></script>
<script src="../assets/libs/three.min.js"></script>
<script src="../assets/libs/tween.min.js"></script>
<script src="../assets/libs/TrackballControls.js"></script>
<script src="../assets/libs/tf.min.js"></script>
<script src="../assets/libs/tensorspace.min.js"></script>

<script>

	let modelContainer = document.getElementById( "container" );

	let model = new TSP.models.Sequential( modelContainer );

	model.add( new TSP.layers.GreyscaleInput() );

	model.add( new TSP.layers.Conv2d() );

	model.add( new TSP.layers.Pooling2d() );

	model.add( new TSP.layers.Conv2d() );

	model.add( new TSP.layers.Pooling2d() );

	model.add( new TSP.layers.Dense() );

	model.add( new TSP.layers.Dense() );

	model.add( new TSP.layers.Output1d( {

		outputs: [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9" ]

	} ) );

	// Load layer model
	// model.load( {
    //
	// 	type: "tensorflow",
	// 	url: './convertedModel/layerModel/model.json'
    //
	// } );

	// Load graph model
	model.load( {

		type: "tensorflow",
		url: './convertedModel/graphModel/model.json',
		outputsName: ["MyConv2D_1", "MyMaxPooling2D_1", "MyConv2D_2", "MyMaxPooling2D_2", "MyDense_1", "MyDense_2", "MySoftMax"]

	} );

	model.init(function() {

		$.ajax( {

			url: "../assets/data/5.json",
			type: 'GET',
			async: true,
			dataType: 'json',
			success: function ( data ) {

				model.predict( data );

			}

		} );

	});

</script>
</body>
</html>