Corrected some spelling mistakes. Rewrite all questions acording to original mini-VLAT

This commit is contained in:
Pavlo Khomenko
2025-01-14 22:00:27 +02:00
parent ec4151992f
commit 4780e66aaf
13 changed files with 139 additions and 134 deletions

View File

@@ -164,7 +164,7 @@ class AreaChartMini extends Component {
.attr("class", "title")
.attr("x", width / 3)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Ціна кави Робуста")
.text("Ціна зерен кави")
.attr("fill", "black")
.style("font-weight", "bold")

View File

@@ -361,7 +361,7 @@ class BubbleChartMini extends Component {
.attr("class", "title")
.attr("x", width / 3)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Системи метро у світі")
.text("Метрополітени міст світу")
.attr("fill", "black")
.style("font-weight", "bold")
})

View File

@@ -3,7 +3,7 @@ import * as d3 from 'd3'
import * as topojson from 'topojson';
import { Container, Col, Row, Navbar, Button, ButtonGroup, ToggleButton, Form, InputGroup } from 'react-bootstrap';
import '../App.css';
import data_usa from './data/USA.json';
import data_ua from './data/UKR.json';
import data from './data/Choropleth.csv';
import img8 from '../components/data/Mini-VLAT/Choropleth_New.png'
@@ -16,7 +16,7 @@ class ChoroplethMini extends Component {
}
componentDidMount() {
console.log(String(data_usa))
console.log(String(data_ua))
this.drawChart()
}
divResize(e) {

View File

@@ -171,7 +171,7 @@ class HistogramMini extends Component {
.attr("class", "title")
.attr("x", width / 3)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Відстань та користувачі")
.text("Відстань поїздок та користувачі")
.attr("fill", "black")
.style("font-weight", "bold")
})

View File

@@ -218,7 +218,7 @@ class LineChartMini extends Component {
.attr("x", 0 - (height / 1.9))
.attr("dy", "1em")
.style("text-anchor", "middle")
.text("Ціна на нафту ($)")
.text("Ціна нафти ($)")
.style("font-weight", "bold")
svg
@@ -226,7 +226,7 @@ class LineChartMini extends Component {
.attr("class", "title")
.attr("x", width / 2.5)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Ціни на нафту в 2020")
.text("Ціна нафти в 2020 році")
.attr("fill", "black")
.style("font-weight", "bold")

View File

@@ -119,7 +119,7 @@ class PieChartMini extends Component {
.attr("class", "title")
.attr("x", -width / 5.5)
.attr("y", -width / 3) // +20 to adjust position (lower)
.text("Світовий ринок смартфонів в 2021")
.text("Світовий ринок смартфонів у 2021")
.attr("fill", "black")
.style("font-weight", "bold")

View File

@@ -1,109 +1,106 @@
const questions = [
{
question: "Яким був ціновий діапазон бареля нафти у 2020 році?",
optionA: "$16.55 - $57.52",
optionB: "$19.52 - $59.00",
optionC: "$23.43 - $60.72",
optionD: "$21.82 - $87.52",
question: "Якою була ціна нафти в лютому 2020 року?",
optionA: "$50.54",
optionB: "$47.02",
optionC: "$42.34",
optionD: "$43.48",
correctOption: "optionA",
},
{
question: "Який діапазон середньої швидкості інтернету в Азії?",
optionA: "5.50Mbps - 30.60Mbps",
optionB: "7.00Mbps - 29.40Mbps",
optionC: "6.40Mbps - 27.38Mbps",
optionD: "5.50Mbps - 28.60Mbps",
correctOption: "optionD",
question: "У якої країни найменша частка золотих медалей?",
optionA: "Велика Британія",
optionB: "США",
optionC: "Японія",
optionD: "Австралія",
correctOption: "optionA",
},
{
question: "Яка ціна арахісу в Лас Веґасі?",
optionA: "$9.0",
question: "Яка середня швидкість інтернету в Японії?",
optionA: "42.30 Mbps",
optionB: "40.51 Mbps",
optionC: "35.25 Mbps",
optionD: " 16.6 Mbps",
correctOption: "optionB",
},
{
question: "Яка ціна арахісу в Сеулі",
optionA: "$5.2",
optionB: "$6.1",
optionC: "$10.3",
optionD: "$4.3",
optionC: "$7.5",
optionD: "$4.5",
correctOption: "optionB",
},
{
question: "Який рейтинг схвалення республіканців серед людей, які мають освітній рівень післядипломної освіти?",
optionA: "35%",
optionB: "27%",
optionC: "23%",
optionD: "20%",
correctOption: "optionB",
},
{
question: "Яку приблизно частку ринку смартфонів займає Samsung?",
optionA: "20%",
optionB: "25%",
optionC: "30%",
optionD: "15%",
correctOption: "optionB",
},
{
question: "Скільки людей оцінили таксі рейтингом між 4.2 та 4.4?",
optionA: "270",
optionB: "190",
optionC: "300",
optionD: "290",
correctOption: "optionB",
},
{
question: "Існує негативна лінійна залежність між ростом і вагою 85 чоловіків.",
optionA: "True",
optionB: "False",
optionC: "",
optionD: "",
correctOption: "optionB",
},
{
question: "Якою була середня ціна фунту кавових бобів в вересні 2013?",
optionA: "$5.15",
optionB: "$6.2",
optionC: "$4.8",
optionD: "$4.3",
optionA: "17.6%",
optionB: "25.3%",
optionC: "10.9%",
optionD: "35.2%",
correctOption: "optionA",
},
{
question: "Яку кількість дівчаток назвали «Олівія» у 2010 році у Великобританії?",
optionA: "2000",
optionB: "2500",
optionC: "1700",
optionD: "2400",
correctOption: "optionC",
question: "На яку відстань переважно пересувалися користувачі таксі",
optionA: "60-70 км",
optionB: "30-40 км",
optionC: "20-30 км",
optionD: "50-60 км",
correctOption: "optionB",
},
{
question: "Яка загальна протяжність системи метро в Пекіні?",
optionA: "525 km",
optionB: "495 km",
optionC: "305 km",
optionD: "475 km",
correctOption: "optionA",
},
{
question: "У 2015 році рівень безробіття у Вашингтоні (WA) був вищим, ніж у Вісконсині (WI).",
optionA: "True",
optionB: "False",
question: "Існує негативний зв'язок між зростом і масою 85 осіб.",
optionA: "Правда",
optionB: "Хиба",
optionC: "",
optionD: "",
correctOption: "optionA",
},
{
question: "Для якого сайту кількість унікальних відвідувачів була найбільшою в 2010 році?",
optionA: "Amazon",
optionB: "Chase",
optionC: "PayPal",
optionD: "Citibank",
correctOption: "optionD",
question: "Якою була середня ціна фунту кавових бобів у вересні 2019?",
optionA: "$0.71",
optionB: "$0.90",
optionC: "$0.80",
optionD: "$0.63",
correctOption: "optionA",
},
{
question: "Яким було співвідношення дівчаток, названих «Ісла», до дівчаток, названих «Амелія», у 2012 році у Великій Британії?",
optionA: "1 до 1",
optionB: "1 до 2",
optionC: "1 до 3",
optionD: "1 до 4",
correctOption: "optionB",
},
{
question: "У метрополітену якого міста найбільша кількість станцій?",
optionA: "Пекін",
optionB: "Шанхай",
optionC: "Лондон",
optionD: "Сеул",
correctOption: "optionB",
},
{
question: "Станом на 2021 рік, населення Харківської області переважало чисельністю населення Львівської області",
optionA: "Правда",
optionB: "Хиба",
optionC: "",
optionD: "",
correctOption: "optionA",
},
{
question: "eBay входить до категорії «Програмне забезпечення».",
optionA: "Правда",
optionB: "Хиба",
optionC: "",
optionD: "",
correctOption: "optionB",
}
]

View File

@@ -143,7 +143,7 @@ class ScatterPlotMini extends Component {
.attr("class", "title")
.attr("x", width / 4)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Маса та висота 85 осіб")
.text("Маса та зріст 85 осіб")
.attr("fill", "black")
.style("font-weight", "bold")
@@ -159,7 +159,7 @@ class ScatterPlotMini extends Component {
})
.style("text-anchor", "middle")
.style("font-weight", "bold")
.text("Висота (см)")
.text("Зріст (см)")
})

View File

@@ -349,7 +349,7 @@ class StackedAreaPlotMini extends Component {
}
})
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Популярні жіночі імена в Великій Британії")
.text("Популярні жіночі імена у Великій Британії")
.attr("fill", "black")
.style("font-weight", "bold")
})

View File

@@ -187,7 +187,7 @@ class StackedBarChart2Mini extends Component {
})
.style("text-anchor", "middle")
.style("font-weight", "bold")
.text("Міста")
.text("Місто")
var dataNormalized = []
data.forEach(function (d) {
@@ -473,7 +473,7 @@ class StackedBarChart2Mini extends Component {
.attr("class", "title")
.attr("x", width / 3)
.attr("y", -length / margin.top) // +20 to adjust position (lower)
.text("Вартість обслуговування номера")
.text("Вартість товарів у готелі")
.attr("fill", "black")
.style("font-weight", "bold")
})

View File

@@ -51,26 +51,26 @@ class Intro extends Component {
<div className={'terms-container'}>
<div className='terms'>
<p>
Запрошуємо взяти участь в дослідженні, що проводять викладачі та студенти Київської школи економіки. Ви запрошені взяти участь у цьому дослідженні, оскільки є дорослою людиною, яка володіє українською мовою. Мета дослідження полягає в адаптації інструменту, який вимірює, наскільки добре люди можуть зчитувати, розуміти та використовувати візуалізацію даних для вирішення проблем.
Запрошуємо взяти участь в дослідженні, що проводять викладачі та студенти Київської школи економіки. Ми пропонуємо це Вам, оскільки Ви — доросла людина, що володіє українською мовою. Мета дослідження полягає в адаптації інструменту, який вимірює, наскільки добре люди можуть зчитувати, розуміти та використовувати візуалізації даних для вирішення повсякденних проблем.
</p>
<p>
Якщо ви погоджуєтеся взяти участь, запропонуємо вам дати відповіді щодо змісту декількох візуалізацій даних. Для кожного питання ви побачите візуалізацію даних та запитання, на яке потрібно дати відповідь. Виберіть відповідь на питання, яку вважаєте НАЙТОЧНІШОЮ. Якщо ви не впевнені, виберіть «Пропустити» замість того, щоб вгадувати. Ви також можете пропустити будь-які питання, на які ви вважаєте за краще не відповідати. У кінці ми попросимо вас заповнити короткий демографічний опитувальник.
Якщо Ви погоджуєтеся взяти участь, пропонуємо вам відповісти на декілька запитань щодо змісту декількох візуалізацій. Ви побачите візуалізацію даних та запитання, на яке потрібно дати відповідь. Виберіть ту відповідь, яку вважаєте НАЙТОЧНІШОЮ. Якщо Ви не впевнені, виберіть «Пропустити» замість того, щоб вгадувати. Ви також можете пропустити будь-які запитання, на які вважаєте за краще не відповідати. У кінці ми попросимо Вас заповнити короткий демографічний опитувальник.
</p>
<p>
Дані, які ми зберемо протягом цього опитування, будуть використані в поточному та подальших дослідженнях грамотності в сфері візуалізації даних.
</p>
{/* <p>
Ці дослідження можуть надати додаткову інформацію, яка буде корисною для розробки кращих інструментів візуальної комунікації. Скоріш за все знахідки з цих досліджень не будуть для вас прямої користі. Немає планів надавати вам фінансову компенсацію, якщо це станеться. Дозволивши нам використовувати ваші дані, ви відмовляєтеся від будь-яких прав власності, які ви можете мати на ці дані.
Ці дослідження можуть надати додаткову інформацію, яка буде корисною для розробки кращих інструментів візуальної комунікації. Скоріш за все знахідки з цих досліджень не матимуть для вас прямої користі. Немає планів надавати вам фінансову компенсацію, якщо це станеться. Дозволивши нам використовувати ваші дані, ви відмовляєтеся від будь-яких прав власності, які ви можете мати на ці дані.
</p> */}
<p>
Зібрані дані будуть передаті іншим дослідникам, які проводитимуть дослідження в цій або суміжних сферах. Також ми можемо опублікувати зібрані дані в репозиторіях даних для широкого доступу до наукової спільноти. Якщо ваші індивідуальні дані будуть розміщені в одному з цих репозиторіїв, лише кваліфіковані дослідники, які отримали попередню згоду від осіб, які контролюють використання даних, зможуть переглядати вашу інформацію.
Зібрані дані будуть передані іншим дослідникам, які проводитимуть дослідження в цій або суміжних сферах. Також ми можемо опублікувати зібрані дані в репозиторіях для широкого доступу наукової спільноти. Якщо ваші особисті дані будуть розміщені в одному з цих репозиторіїв, лише кваліфіковані дослідники, які отримали попередню згоду від осіб, які контролюють використання даних, зможуть переглядати цю інформацію.
</p>
<p>
Ваші дані будуть збережені без вашого імені чи будь-якої іншої інформації, яка дозволила б нам ідентифікувати вас персонально. Тому вони будуть доступні безстроково для використання в майбутніх дослідженнях без вашої додаткової згоди та не можуть бути видалені.
</p>
<p>Участь в цьому дослідженні не містить для вас жодних відомих потенційних ризиків.</p>
<p>
Якщо ви маєте будь-які питання щодо змісту та деталей дослідження, будь-ласка напишіть Олегу Омельченко (o_omelchenko@kse.org.ua).
Якщо Ви маєте будь-які питання щодо змісту та деталей дослідження, будь ласка, напишіть Олегу Омельченку (o_omelchenko@kse.org.ua).
</p>
<p>Дякуємо за зацікавленість дослідженням!</p>
</div>

View File

@@ -65,15 +65,15 @@ class Tutorial extends Component {
<p className='head_1'>Інструкції</p>
<ul>
<li className='int_1'>
Вам буде запропоновано 12 питань з вибором однієї правильної відповіді.</li>
Вам буде запропоновано 12 запитань з вибором єдиної правильної відповіді.</li>
<li className='int_1'>
Дайте на них відповідь, якщо ви впевнені в своїй відповіді. Якщо ви не впевнені, ви можете пропустити питання, а не вгадувати.
Дайте на них відповідь, якщо ви впевнені в своїй правоті. Якщо ви не впевнені, пропустіть це питання, а не вгадуйте.
</li>
</ul>
<p className='head_2'>
<b>Важливо: на відповідь до кожного питання ви маєте 25 секунд.</b>
Відповідайте на кожне питання якнайкраще. Якщо ви не впевнені, ви можете <b>пропустити питання, а не вгадувати</b>.
<b>Важливо: На кожне запитання ви матимете 25 секунд.</b>
Відповідайте на кожне питання якнайкраще. Якщо ви не впевнені, ви можете <b>пропустити питання, а не вгадувати</b>.
</p>
<div className={'text-center'}>

View File

@@ -37,24 +37,32 @@ let minivis = [
{
'vis': LineChartMini,
'type': 'Лінійна діаграма',
'question': 'Яким був ціновий діапазон бареля нафти у 2020 році?',
'options': ["$16.55 - $57.52", "$19.52 - $59.00", "$23.43 - $60.72", "$21.82 - $87.52", "Пропустити"],
'question': 'Якою була ціна нафти в лютому 2020 року?',
'options': ["Велика Британія","США","Японія","Австралія", "Пропустити"],
'correct_answer': 0,
'cimage': img12
},
{
'vis': StackedBarChartMini,
'type': 'Накопичувальна відносна стовпчикова діаграма',
'question': 'У якої країни найменша частка золотих медалей?',
'options': ["$16.55 - $57.52", "$19.52 - $59.00", "$23.43 - $60.72", "$21.82 - $87.52", "Пропустити"],
'correct_answer': 0,
'cimage': img5
},
{
'vis': BarChartMini,
'type': 'Стовпчикова діаграма (Bar Chart)',
'question': 'Який діапазон середньої швидкості інтернету в Азії?',
'options': ["5.50Mbps - 30.60Mbps", "7.00Mbps - 29.40Mbps", "6.40Mbps - 27.38Mbps", "5.50Mbps - 28.60Mbps", "Пропустити"],
'correct_answer': 3,
'question': 'Яка середня швидкість інтернету в Японії?',
'options': ["42.30 Mbps", "40.51 Mbps", "35.25 Mbps", " 16.6 Mbps", "Пропустити"],
'correct_answer': 1,
'cimage': img9
},
{
'vis': StackedBarChart2Mini,
'type': 'Накопичувальна стовпчикова діаграма (Stacked Bar)',
'question': 'Яка ціна арахісу в Лас Веґасі?',
'options': ["$9.0", "$6.1", "$10.3", "$4.3", "Пропустити"],
'question': 'Яка ціна арахісу в Сеулі?',
'options': ["$5.2", "$6.1", "$7.5", "$4.5", "Пропустити"],
'correct_answer': 1,
'cimage': img2
},
@@ -62,64 +70,64 @@ let minivis = [
'vis': PieChartMini,
'type': 'Кругова діаграма (Pie Chart)',
'question': 'Яку приблизно частку ринку смартфонів займає Samsung?',
'options': ["20%", "25%", "30%", "15%", "Пропустити"],
'correct_answer': 1,
'options': ["17.6%", "25.3%", "10.9%", "35.2%", "Пропустити"],
'correct_answer': 0,
'cimage': img11
},
{
'vis': HistogramMini,
'type': 'Гістограма (Histogram)',
'question': 'Скільки людей оцінили таксі рейтингом між 4.2 та 4.4?',
'options': ["270", "190", "300", "290", "Пропустити"],
'question': 'На яку відстань переважно пересувалися користувачі таксі',
'options': ["60-70 км", "30-40 км", "20-30 км","50-60 км", "Пропустити"],
'correct_answer': 1,
'cimage': img6
},
{
'vis': ScatterPlotMini,
'type': 'Точкова діаграма (Scatterplot)',
'question': 'Існує негативна лінійна залежність між ростом і вагою 85 чоловіків.',
'options': ['Вірно', 'Невірно', "Пропустити"],
'correct_answer': 1,
'question': "Існує негативний зв'язок між зростом і масою 85 осіб.",
'options': ['Правда', 'Хиба', "Пропустити"],
'correct_answer': 0,
'cimage': img1
},
{
'vis': AreaChartMini,
'type': 'Площинна діаграма (Area Chart)',
'question': 'Якою була середня ціна фунту кавових бобів в вересні 2013?',
'options': ["$5.15", "$6.2", "$4.8", "$4.3", "Пропустити"],
'question': 'Якою була середня ціна фунту кавових бобів у вересні 2019?',
'options': ["$0.71", "$0.90", "$0.80", "$0.63", "Пропустити"],
'correct_answer': 0,
'cimage': img10
},
{
'vis': StackedAreaPlotMini,
'type': 'Накопичувальна площинна діаграма (Stacked Area)',
'question': 'Яку кількість дівчаток назвали «Олівія» у 2010 році у Великобританії?',
'options': ["2000", "2500", "1700", "2400", "Пропустити"],
'correct_answer': 2,
'question': 'Яким було співвідношення дівчаток, названих «Ісла», до дівчаток, названих «Амелія», у 2012 році у Великій Британії?',
'options': ["1 до 1","1 до 2","1 до 3","1 до 4", "Пропустити"],
'correct_answer': 1,
'cimage': img7
},
{
'vis': BubbleChartMini,
'type': 'Бульбашкова діаграма (Bubble Chart)',
'question': 'Яка загальна протяжність системи метро в Пекіні?',
'options': ["525 км", "495 км", "305 км", "475 км", "Пропустити"],
'correct_answer': 0,
'question': 'У метрополітену якого міста найбільша кількість станцій?',
'options': ["Пекін", "Шанхай", "Лондон", "Сеул", "Пропустити"],
'correct_answer': 1,
'cimage': img3
},
{
'vis': ChoroplethMini,
'type': 'Хороплетна мапа (Choropleth)',
'question': 'У 2015 році рівень безробіття у Вашингтоні (WA) був вищим, ніж у Вісконсині (WI).',
'options': ['Вірно', 'Невірно', "Пропустити"],
'question': 'Станом на 2021 рік, населення Харківської області переважало чисельністю населення Львівської області"',
'options': ['Правда', 'Хиба', "Пропустити"],
'correct_answer': 0,
'cimage': img8
},
{
'vis': TreeMapMini,
'type': 'Деревоподібна діаграма (Treemap)',
'question': 'Для якого сайту кількість унікальних відвідувачів була найбільшою в 2010 році?',
'options': ["Amazon", "Chase", "PayPal", "Citibank", "Пропустити"],
'correct_answer': 3,
'question': 'eBay входить до категорії «Програмне забезпечення».',
'options': ['Правда', 'Хиба', "Пропустити"],
'correct_answer': 1,
'cimage': img4
}
];
@@ -219,13 +227,13 @@ class VisQuiz extends Component {
score_2 = this.state.mini_score
if (response === minivis[this.state.current_mini_index]['options'][truth]) {
record_ques[type] = '✅ Вірно'
record_ques[type] = '✅ Правильно'
}
else if (response === 'Skip') {
record_ques[type] = '⏩ Пропущено'
}
else {
record_ques[type] = '❌ Невірно'
record_ques[type] = '❌ Неправильно'
}
console.log("The dictionary is: ", record_ques)
}
@@ -288,7 +296,7 @@ class VisQuiz extends Component {
this.props.history.push(pageType)
}
timeout() {
alert('Чакс вийшов! Натисніть "ОК" щоб перейти до наступного запитання.')
alert('Час вийшов! Натисніть "ОК" щоб перейти до наступного запитання.')
this.setState({
current_visualization_index: this.state.current_visualization_index + 1,
})
@@ -297,7 +305,7 @@ class VisQuiz extends Component {
return Math.random();
}
minitimeout() {
alert('Чакс вийшов! Натисніть "ОК" щоб перейти до наступного запитання.')
alert('Час вийшов! Натисніть "ОК" щоб перейти до наступного запитання.')
this.setState({
current_mini_index: this.state.current_mini_index + 1,
})