Добавление круговой диаграммы Sparkline в Angular 2/SmartAdmin

Я только что загрузил начальный проект SmartAdmin Angular 2 и пытаюсь добавить объект круговой диаграммы Sparkline на домашнюю страницу. Я добавил следующий диапазон в home/home.component.html:

<span data-sparkline-type="pie" data-sparkline-offset="90" data-sparkline-piesize="18px">3,5,2</span>

Все, что я вижу на главной странице, это сами цифры 3,5,2. Я не вижу круговую диаграмму. Я предполагаю, что мне нужно импортировать какой-то компонент, но я не могу понять, как и где это сделать.

Я нашел очень похожий вопрос, но ответ мне не помог. Этот пользователь использует Angular 1, и кажется, что в Angular 2 нет ни app.js, ни app.ts, ни какого-либо файла с закомментированным модулем app.graphs.

Невозможно заставить спарклайны работать в AngularJS-версии шаблона SmartAdmin

Я очень новичок в Angular 2 и веб-разработке в целом, поэтому я надеюсь, что вы будете терпеть меня.

1 ответ

Оказывается, было две проблемы:

* любой граф Sparkline должен быть заключен в div с директивой saSparklineContainer

* промежуток, содержащий спарклайн, должен иметь класс спарклайн

Так,

<span data-sparkline-type="pie" data-sparkline-offset="90" data-sparkline-piesize="18px">3,5,2</span>

не работает

<div saSparklineContainer >
    <span class="sparkline" data-sparkline-type="pie" data-sparkline-offset="90"    data-sparkline-piesize="18px">3,5,2</span>            
</div>

это то, что мне нужно

Другие вопросы по тегам