morrisjs / morris.js

Pretty time-series line graphs
http://morrisjs.github.com/morris.js/
6.92k stars 1.23k forks source link

Morris.js with Bootstrap 5 #805

Closed SoftCircuits closed 2 years ago

SoftCircuits commented 2 years ago

Has anyone used this library with Bootstrap 5?

I seem to be having some issues. Here's my markup.

<div class="col-lg-6">
    <div class="card-box">
        <h5 class="mt-0 font-14">ChartTitle</h5>
        <div class="text-center">
            <ul class="list-inline chart-detail-list">
                <li class="list-inline-item">
                    <p class="font-weight-semibold"><i class="fa fa-circle mr-2 text-primary"></i>Series A</p>
                </li>
                <li class="list-inline-item">
                    <p class="font-weight-semibold"><i class="fa fa-circle mr-2 text-muted"></i>Series B</p>
                </li>
            </ul>
        </div>
        <div id="ChartId" class="morris-chart" dir="ltr" style="height: 300px;"></div>
    </div>
</div>

But the image doesn't appear correct. Specifically, the legend colors don't show up.

image

P.S. Does anyone know if this library is still supported? The jsBin pages that demonstrate the charts are all down.