Проблема с подключением библиотеки brain.js

159
24 марта 2022, 12:10

Написал нейросеть на 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>

Answer 1

Решения:

  • Добавить протокол в ссылку <script src="http://unpkg.com/brain.js"></script>;
  • Скачать brain.js в папку с проектом и указать к нему путь.

Когда открываешь файл локально, он не подставляет протокол поэтому у тебя и не подключается библиотека

READ ALSO
Регулярное выражение JS не работает

Регулярное выражение JS не работает

Всем ку! Помогите плез разобратьсяПочему при следующем коде я получаю вывод 'ttps', а не 'facebook'? Почему не работает \?

108
Получить geoJSON полигоны напрямую онлайн

Получить geoJSON полигоны напрямую онлайн

Я использую карты leaflet, и мне нужно выделить определенные регионыЯ делаю выделение с помощью полигонов geoJSON

68
Работа с файловой системой JS ( Source-&gt;Filesystem )

Работа с файловой системой JS ( Source->Filesystem )

Я хочу, зайдя на определенный сайт, записывать в текстовый файл определенную информацию с помощью JS, тобеж просто вставить код скрипта в консоль...

86
Не передается текст в действие котролера

Не передается текст в действие котролера

У меня есть действие в API-контролере

85