主页 / 问题 / 1077088
Accepted
h4cktivist
Asked:2020-02-02 00:11:50 +0000 UTC2020-02-02 00:11:50 +0000 UTC

连接brain.js 库的问题

  • 772

用JavaScript写了一个神经网络（应该可以检测图片），但是在连接brain.js库本身的时候出现了问题。在浏览器控制台中显示：“在 'file:///brain.js' 加载失败。” 该链接有效，我通过将其插入浏览器的地址栏中单独检查它。请帮助解决这个问题，提前谢谢大家:) 代码附在下面：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>НС</title>

	<script src="//unpkg.com/brain.js"></script>

	<style>
		body {
			background-color: #333;
		}

		#canv {
			position: absolute;
			top: 0;right: 0;bottom: 0;left: 0;
			margin: auto;
			background-color: white;
		}
	</style>
</head>
<body>
	
	<canvas id="canv" style="display: block;">Ваш браузер устарел, обновитесь.</canvas>

	<script>
		function DCanvas(el)
		{
			const ctx = el.getContext('2d');
			const pixel = 20;

			let is_mouse_down = false;

			canv.width = 500;
			canv.height = 500;

			this.drawLine = function(x1, y1, x2, y2, color = 'gray') {
				ctx.beginPath();
				ctx.strokeStyle = color;
				ctx.lineJoin = 'miter';
				ctx.lineWidth = 1;
				ctx.moveTo(x1, y1);
				ctx.lineTo(x2, y2);
				ctx.stroke();
			}

			this.drawCell = function(x, y, w, h) {
				ctx.fillStyle = 'blue';
				ctx.strokeStyle = 'blue';
				ctx.lineJoin = 'miter';
				ctx.lineWidth = 1;
				ctx.rect(x, y, w, h);
				ctx.fill();
			}

			this.clear = function() {
				ctx.clearRect(0, 0, canv.width, canv.height);
			}

			this.drawGrid = function() {
				const w = canv.width;
				const h = canv.height;
				const p = w / pixel;

				const xStep = w / p;
				const yStep = h / p;

				for( let x = 0; x < w; x += xStep )
				{
					this.drawLine(x, 0, x, h);
				}

				for( let y = 0; y < h; y += yStep )
				{
					this.drawLine(0, y, w, y);
				}
			}

			this.calculate = function(draw = false) {
				const w = canv.width;
				const h = canv.height;
				const p = w / pixel;

				const xStep = w / p;
				const yStep = h / p;

				const vector = [];
				let __draw = [];

				for( let x = 0; x < w; x += xStep )
				{
					for( let y = 0; y < h; y += yStep )
					{
						const data = ctx.getImageData(x, y, xStep, yStep);

						let nonEmptyPixelsCount = 0;
						for( i = 0; i < data.data.length; i += 10 )
						{
							const isEmpty = data.data[i] === 0;

							if( !isEmpty )
							{
								nonEmptyPixelsCount += 1;
							}
						}

						if( nonEmptyPixelsCount > 1 && draw )
						{
							__draw.push([x, y, xStep, yStep]);
						}

						vector.push(nonEmptyPixelsCount > 1 ? 1 : 0);
					}
				}

				if( draw )
				{
					this.clear();
					this.drawGrid();

					for( _d in __draw )
					{
						this.drawCell( __draw[_d][0], __draw[_d][1], __draw[_d][2], __draw[_d][3] );
					}
				}

				return vector;
			}

			el.addEventListener('mousedown', function(e) {
				is_mouse_down = true;
				ctx.beginPath();
			})

			el.addEventListener('mouseup', function(e) {
				is_mouse_down = false;
			})

			el.addEventListener('mousemove', function(e) {
				if( is_mouse_down )
				{
					ctx.fillStyle = 'red';
					ctx.strokeStyle = 'red';
					ctx.lineWidth = pixel;

					ctx.lineTo(e.offsetX, e.offsetY);
					ctx.stroke();

					ctx.beginPath();
					ctx.arc(e.offsetX, e.offsetY, pixel / 2, 0, Math.PI * 2);
					ctx.fill();

					ctx.beginPath();
					ctx.moveTo(e.offsetX, e.offsetY);
				}
			})
		}

		let vector = [];
		let net = null;
		let train_data = [];

		const d = new DCanvas(document.getElementById('canv'));

		document.addEventListener('keypress', function(e) {
			if( e.key.toLowerCase() == 'c' )
			{
				d.clear();
			}

			if( e.key.toLowerCase() == 'v' )
			{
				vector = d.calculate(true);
				
				//train
				if( confirm('Positive?') )
				{
					train_data.push({
						input: vector,
						output: {positive: 1}
					});
				} else
				{
					train_data.push({
						input: vector,
						output: {negative: 1}
					});
				}
			}

			if( e.key.toLowerCase() == 'b' )
			{
				net = new brain.NeuralNetwork();
				net.train(train_data, {log: true});

				const result = brain.likely(d.calculate(), net);
				alert(result);
			}
		});
	</script>

</body>
</html>

javascript

1 个回答

  1. Best Answer

    解决方案：

    • 将协议添加到链接<script src="http://unpkg.com/brain.js"></script>；
    • 下载brain.js到包含项目的文件夹并指定其路径。

    当您在本地打开文件时，它不会替换协议，因此您没有连接库

    • 0

相关问题