У меня есть поле ввода, которое связано со списком слов afinn. Это проект, который я использую: https://github.com/CodingTrain/website/tree/master/CodingChallenges/CC_044_afinn111SentimentAnalysis/P5
Обнаруженные слова из списка написаны ниже, сообщая оценку слова.
Я хочу, чтобы обнаруженные слова были выделены непосредственно в поле ввода. (оттенки красного для отрицательных слов с оценкой от -5 до -1 и оттенки зеленого для положительных слов с оценкой от +1 до +5)
Мне не удалось создать пример, который работает в stackoverflow, но вот пример из github, как он работает сейчас:
https://darenr.github.io/afinn/
Часть кода будет использоваться на веб-сайте.
Код использует библиотеку p5.js и список слов afinn (файл json): https://github.com/CodingTrain/website/blob/master/CodingChallenges/CC_044_afinn111SentimentAnalysis/P5/afinn111.json
Обычно я занимаюсь дизайном, поэтому я не очень хорош в кодировании. Я надеюсь, вы понимаете вопрос.
JavaScript:
// Daniel Shiffman
// http://codingtra.in
// http://patreon.com/codingtrain
// Code for: https://youtu.be/VV1JmMYceJw
var afinn;
function preload() {
afinn = loadJSON('afinn111.json');
}
function setup() {
noCanvas();
console.log(afinn);
var txt = select('#txt');
txt.input(typing);
function typing() {
var textinput = txt.value();
var words = textinput.split(/\W/);
console.log(words);
var scoredwords = [];
var totalScore = 0;
for (var i = 0; i < words.length; i++) {
var word = words[i].toLowerCase();
if (afinn.hasOwnProperty(word)) {
var score = afinn[word];
console.log(word, score);
totalScore += Number(score);
scoredwords.push(word + ': ' + score + ' ');
}
}
var scorePar = select('#scoreP');
scorePar.html('score: ' + totalScore);
var comp = select('#comparativeP');
comp.html('comparative: ' + totalScore / words.length);
var wordlist = select('#wordlistP');
wordlist.html(scoredwords);
//console.log(txt.value());
}
}
function draw() {
}
HTML:
<html>
<head>
<meta charset="UTF-8">
<title>AFINN-111 demo</title>
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.min.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/addons/p5.dom.min.js"></script>
<script language="javascript" type="text/javascript" src="sketch.js"> </script>
</head>
<body>
<h1>AFINN Sentiment Demo</h1>
<p>
Type here:<br />
<textarea id="txt" cols=50 rows=10></textarea>
</p>
<p id="scoreP"></p>
<p id="comparativeP"></p>
<p id="wordlistP"></p>
</body>
</html>
Проблема:
Мне нужно, чтобы набранные слова из списка afinn были выделены прямо в поле ввода. В оттенках красного (отрицательные слова от -5 до -1) и оттенков зеленого (положительные слова от +1 до +5)
Я надеюсь, что любой может помочь! Это было бы очень ценно!