Markdownx не отображает математические формулы - PullRequest
Новая
       8

Markdownx не отображает математические формулы

0 голосов
/ 16 марта 2020

Я новичок здесь. В течение одного месяца go я начал учить Django. Моей целью было создать веб-приложение: набор математических вопросов. Пользователь может создавать новые вопросы и фильтровать вопросы относительно топи c и уровня сложности. Вчера я решил включить предварительный просмотр для textarea, например, предварительный просмотр в stackoverflow. После поиска в Google я нашел markdownx. Он отображает текст и все теги html, но не математические формулы (см. Рисунок). пример проблемы Я использую mathjax для визуализации математических формул. Если я положу, например, x ^ 2 между \( ... \), он исчезнет. Та же проблема с $$...$$. Кто-нибудь знает, как решить эту проблему?

Ниже вы можете найти мои settings.py, models.py и шаблон. 

settings.py

INSTALLED_APPS = [
'question.apps.QuestionConfig',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'multiselectfield',
'latexify',
'django_filters',
'mathpool',
'rest_framework',
'markdownx',
'markdown',
 ]

MARKDOWNX_MARKDOWNIFY_FUNCTION = 'markdownx.utils.markdownify'


MARKDOWNX_MARKDOWN_EXTENSIONS = [
'markdown.extensions.extra',
'mdx_math',
'markdown.extensions.sane_lists',
'markdown.extensions.nl2br',
 ]


models.py

from django.db import models
from multiselectfield import MultiSelectField
from django.contrib.auth import get_user_model
from django.urls import reverse
from markdownx.models import MarkdownxField


YEARS = (
(3, '3'), (4, '4'), (5,'5'), (6, '6'), (7, '7'), (8, '8'), (9, '9'), (10, '10'),
 )

POINTS = [
('1', '1'), ('2', '2'), ('3','3'), ('4', '4'), ('5', '5'),
 ]

CATEGORY = [
('Zahlen', 'Zahlen'),
('Prozentrechnung', 'Prozentrechnung'),
('Geometrie', 'Geometrie'),
('Bruchrechnung', 'Bruchrechnung'),
('Gleichungen', 'Gleichungen'),
('Funktionen', 'Funktionen'),
('Trigonometrie', 'Trigonometrie'),
('Kombinatorik', 'Kombinatorik'),
('Wahrscheinlichkeiten', 'Wahrscheinlichkeiten'),
 ]

ROUND = [
        ('Vorrunde', 'Vorrunde'),
        ('Zwischenrunde', 'Zwischenrunde'),
        ('Finalrunde', 'Finalrunde'),
    ]

class Question(models.Model):
question_id = models.AutoField('ID', primary_key = True)
question_creation_date = models.DateTimeField('Erstellungsdatum', auto_now_add=True,)
question_text = MarkdownxField('', blank=False)
question_distractor_a = models.CharField('', max_length=100, blank=True)
question_distractor_b = models.CharField('', max_length=100, blank=True)
question_distractor_c = models.CharField('', max_length=100, blank=True)
question_distractor_d = models.CharField('', max_length=100, blank=True)
question_distractor_e = models.CharField('', max_length=100, blank=True)
question_solution = models.CharField('', max_length=100, blank=True)
question_points = models.CharField('Punkte', max_length=1, choices=POINTS, default='')
question_year = MultiSelectField('Klasse', choices=YEARS, max_choices=8)
question_category = models.CharField('Themengebiet', max_length=50, choices=CATEGORY, blank=True, 
default='')
question_image = models.FileField('Bild', upload_to = 'media/', default='', blank=True)
question_round = models.CharField('Runde', max_length=15, choices=ROUND, blank=True)

def __str__(self):
    return str(self.question_id)



class Comment(models.Model):
     question = models.ForeignKey(Question, on_delete=models.CASCADE, related_name='comments')
     comment = models.TextField('')
     user = models.ForeignKey(get_user_model(), on_delete=models.CASCADE)
     date = models.DateTimeField(auto_now_add=True)
     parent = models.ForeignKey('self', on_delete=models.CASCADE, null=True, blank=True, 
     related_name='replies')

class Meta:
    ordering = ['date']

def __str__(self):
    return self.comment

def get_absolute_url(self):
    return reverse('question_detail', kwargs= {'pk': self.pk})


template

<!DOCTYPE html>

{% load stati c%} {% load latexify%} 

<html lang="de">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- font style -->
<link href='https://fonts.googleapis.com/css?family=Quicksand' rel='stylesheet'>

<!-- static file -->
 <link rel="stylesheet" href="{% static 'style.css' %}" type="text/css">

<!-- Latexify -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.css">

<!-- tikzjax -->
<link rel="stylesheet" type="text/css" href="http://tikzjax.com/v1/fonts.css">
{% endblock link %}


<script src="http://tikzjax.com/v1/tikzjax.js"></script>

<!-- Mathjax -->
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"> 
</script>


<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.4.1.js" integrity="sha256- 
 WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
  crossorigin="anonymous"></script>

<title>index</title>

</head>

<main class="container" style="min-height: 100vh;">
<form action="" enctype="multipart/form-data" method="post">{% csrf_token %}
  {{ form.as_p }}

  {{ form.errors }}
  {{ form.non_field_errors }}
 <input class="button" type="submit" value="Aufgabe einreichen" style="width: 100%;">
</form>
{{ form.media }}
</main>

</html>

Большое спасибо!

...