Как представить математические символы и ввод данных пользователем получения для того же
Как Вы получаете ввод данных пользователем, связанный с математическими частями. Принятие я хотел бы представить простой квадрат и попросить, чтобы пользователь выбрал 3/4ths квадрата. Какое управление UI должно мы использовать для первого, все представляют квадрат (с 4 равными блоками внутри) и иметь механизм для получения ввода данных пользователем.
Принятие Вас хотело бы потянуть масштаб, который 1 метр длиной и и у Вас есть маркировки для каждых 10 см (например, 10, 20, 30... 90, 100). Мы хотели бы, чтобы пользователь вывел 40 см на печать в масштабе. Какие средства управления UI доступны, который поможет нам в рисовании таких исходных данных и получении студенческого ответа.
Есть ли какие-либо инструменты или библиотеки, которыми мы можем пользоваться для создания таких решений? Наша среда на основе (Java, richfaces, jQuery...)
5 ответов
Несмотря на то, что можно собрать элементы управления HTML или jQuery для рисования и обнаружения щелчков на прямоугольниках, если вы собираетесь рисовать собственную графику со шрифтами, символами, масштабированием и вращением, в конечном итоге вам придется перейти на графический API. Я предлагаю использовать элемент HTML5 Canvas.
Canvas - это одобренный W3C метод добавления интерактивной графики на веб-страницы, который поддерживается всеми современными браузерами, включая IE с подключаемым модулем.
В бесплатной главе из Dive into HTML5 показано, как создать играбельную HTML5-игру, используя только JavaScript в элементе Canvas.
по вопросу № 2
используйте плагин слайдера диапазона jquery, например:
- Для записи используйте латексное форматирование.
- Затем просто переведите латекс в mathml .
- Просмотреть источник . Сделайте свой данные.
Альтернативой является использование громоздкого интерфейса с заранее определенным списком кнопок и полей ввода, на которые можно нажимать. Это лучше для аудитории, которая не привыкла к академической работе более высокого уровня.
Для вопроса о слайдере я бы использовал: диаграммы Google или rapheal JS
Для вопроса 1 вы можете изучить взаимодействия пользовательского интерфейса jQuery для поиска идей, в частности, Resizable , Selectable и ] Сортируемый .
Это действительно зависит от того, как вы хотите поставить вопрос. Например, вы можете создать элемент управления Resizable для квадрата и сделать ширину и высоту изменяемыми пропорционально. Или вы можете разделить квадрат на несколько Seletable областей (например, меньшие квадраты).
Что касается второго вопроса, я бы сделал то же самое и использовал бы ползунок диапазона jQuery, как предложил Хаим.
Что касается первого вопроса, я предполагаю, что вы захотите расширить это на формы, отличные от квадрата. Возможно, вы захотите, чтобы пользователь выбрал 7/8 пиццы или что-то подобное. jQuery selectables и resizables могут работать для квадратной проблемы, но было бы очень сложно реализовать (и использовать) для пиццы (или подобного). Я бы использовал тег html ( см. Здесь, в W3schools ) и привязал команду javacsript к нажатию на каждую область на карте.
Например, если вы создали карту в интерактивном режиме с помощью http://www.carlosag.net/Tools/XMap/ (или аналогичного), то привяжите каждую область к чему-то вроде:
<area ... onclick="javascript:if (typeof(pizza[0])=='undefined'){pizza[0] = 1/8;}else{pizza[0] = 0;}">
<area ... onclick="javascript:if (typeof(pizza[1])=='undefined'){pizza[1] = 1/8;}else{pizza[1] = 0;}">
<area ... onclick="javascript:if (typeof(pizza[2])=='undefined'){pizza[2] = 1/8;}else{pizza[2] = 0;}">
где
<script>
var pizza = new Array();
Array.prototype.sum = function() {
return (! this.length) ? 0 : this.slice(1).sum() +
((typeof this[0] == 'number') ? this[0] : 0);
}; // borrowed from http://www.gscottolson.com/weblog/2007/12/09/sum-array-prototype-for-javascript/
</script>
при отправке формы вы должны просто отправить pizza.sum () ! Конечно, это можно более элегантно записать в функцию, которая будет включать выделение выбранных областей, но: -)