Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.06.2009, 08:28
Аватар для Rimch
Интересующийся
Отправить личное сообщение для Rimch Посмотреть профиль Найти все сообщения от Rimch
 
Регистрация: 11.06.2009
Сообщений: 22

Математические формулы в HTML
Уважаемые участники форума, на днях начал писать скрипт для верстки математических формул как в ТеХ.

На данный момент реализовано 2 вида формул, строчные и блочные:
  • Строчные формулы отображаются как привычные формулы в LaTeXе через $формула$
  • Блочные \[ формула\] - автоматически нумеруются (можно продумать ссылки).

Скрипт умеет:
  • возводить в степень ^,
  • писать индексы _.
  • отображать дроби \frac{числитель}{знаменатель}
  • реализовал возможность использовать суммирование, приведение, интегрирование, пределы
С работой скрипта можно ознакомиться http://sspa.bashtel.ru/Math/

пример работы скрипта
<html>
<script>$=function(id){return document.getElementById(id);}</script>
<LINK rel="stylesheet" href="tex.css" type="text/css">
<script src='tex.js'></script>
<body>
<div id='memo1' style="font-size:14pt;font-family:arial;">
\[\sigma + \frac{ e^{ \frac{1}{2} +\sin^2(x)+\cos^2(x)\frac{\sin(x)^{\tg(x)}}{\cos(x)} } + \sin(x)}{\cos(2x)+ \sin(x/2)}\]
</div>
<script>$('memo1').innerHTML=DoTex($('memo1').innerHTML);</script>
</body>
</html>

на экране будет

Хочу посоветоваться с вами, как реализовать большие скобки и квадратные корни?

Прошу оценить скрипт. Конструктивная критика - приветствуется.


Да конечно можно не мучиться и пользоваться MathML, но он не работает в Opera, а для IE надо ставить плагин.

Последний раз редактировалось Rimch, 11.06.2009 в 08:31.
Ответить с цитированием
  #2 (permalink)  
Старый 11.06.2009, 10:21
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

Круто!

На корень похож символ &radic;, а верхнюю полосу уже можно дописать

Думаю, скобки можно выводить и обычные, но с бОльшим кеглем... Поиграть шрифтами, чтоб не такие круглые были.
Ответить с цитированием
  #3 (permalink)  
Старый 11.06.2009, 12:33
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,233

АБАЛДЕТЬ!
Rimch, вы молодец, и мне радостно, что хоть кто-то интересными серьезными вещами занимается
по поводу скобки мне кажется не удастся добится чтобы она была высокая и узкая относительно
поэтому советую для скобок, по высоте как два, и более обычных символа, держать соответсвующую картинку, и растягивать ее по высоте
по поводу же корня идея примерно такая:
не использовать символ(будет трудно черту верхнюю склеить с концом радикала)
я бы обернул подкореное выражение в таблицу 2х2
как-то так
-------------------------------------
| /--| ------------------------- |
-------------------------------------
| / | |
|_ / | подкореное выражение|
| \/ | |
--------------------------------------

вот небольшой багрепорт по поводу верстки вашей(скриншотом)

Последний раз редактировалось Gvozd, 30.04.2012 в 23:36.
Ответить с цитированием
  #4 (permalink)  
Старый 11.06.2009, 12:50
Аватар для Rimch
Интересующийся
Отправить личное сообщение для Rimch Посмотреть профиль Найти все сообщения от Rimch
 
Регистрация: 11.06.2009
Сообщений: 22

Gvozd, спасибо за небольшой багрепорт у меня огнилис 3.0.10, в более ранних версиях я не проверял. Сами понимаете кросбраузерность дело мудренное. Будем думать.

Насчет радикалов я так подумал, можно попробовать через canvas. Но это HTML 5. Должно получиться прикольно.

Вопрос, кто знает, как в ранних версиях огнилиса и хрома единица измерения em и ex определяется (в этом кроится косяк с дробями)?
Ответить с цитированием
  #5 (permalink)  
Старый 11.06.2009, 12:56
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Rimch
можно попробовать через canvas
Тогда уж VML+SVG.
Ответить с цитированием
  #6 (permalink)  
Старый 11.06.2009, 13:11
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Так как скопировать и нормально вставить выделенный текст всё равно не получается, то, как предложил Kolyaj, лучше использовать VML и SVG. Создаете набор необходимых символов в векторном виде, как, например, в Cufón или typeface.js, и отрисовываете их с нужным увеличением средствами SVG или Canvas и VML в IE.
Ответить с цитированием
  #7 (permalink)  
Старый 11.06.2009, 13:50
Аватар для Rimch
Интересующийся
Отправить личное сообщение для Rimch Посмотреть профиль Найти все сообщения от Rimch
 
Регистрация: 11.06.2009
Сообщений: 22

Спасибо за совет так и сделал. Посмотрите что получилось
http://sspa.bashtel.ru/Math/
Ответить с цитированием
  #8 (permalink)  
Старый 11.06.2009, 14:03
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

хм... а где корень?! да и скобки вроде стандартные...
Ответить с цитированием
  #9 (permalink)  
Старый 11.06.2009, 14:04
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,022

Во! Появилось!
Похоже кэш подвёл...
Ответить с цитированием
  #10 (permalink)  
Старый 11.06.2009, 14:04
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,233

в опере(9.27) левая часть корня не сходится с верхней
есть небольшой зазор в пару пикселей

Последний раз редактировалось Gvozd, 30.04.2012 в 23:36.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Переменные в HTML ibcmsm Общие вопросы Javascript 7 27.09.2011 14:35
JS меню работает на обычной html странице, а на юкозовском движке нет. adware Я не знаю javascript 10 16.05.2009 16:48
AJAX. Возвращение массива HTML Neil AJAX и COMET 9 12.02.2009 16:00
Неверный результат в AJAX с получением HTML Raynor AJAX и COMET 3 17.12.2008 18:38
На входе HTML получить на выходе просто текст, как? Dmitry Общие вопросы Javascript 2 25.08.2008 10:42