Morris 图表中的有限颜色

Question

我想在我的 MVC 视图中绘制 Morris 图表，但我的数据是动态的，我有 30 多个项目，但莫里斯图表只是用 12 种颜色给图表上色，并重复剩余的切片和我刚刚创建的图例对于 12 种颜色，显示颜色就像 o 附上的图像一样。如何为我的图表使用无限颜色？！

var ChartBlockShopFirstMelt = new Morris.Donut({
        element: 'MychartViewArea',
        parseTime: false,
        dataLabelsPosition: 'outside',
        resize: true,
        //donutType: 'pie',
        dataLabels: true,
        hidehover: 'auto',
        //colors: [
        //    '#882222'
        //    ],

            data: [
              @foreach(var item in ListAreaAndSheare )
                {
                    @:{ label: "@item.Lable", value: "@Math.Round(item.VALUE,2)" },
                }
    ],

    });

    ChartBlockShopFirstMelt.options.data.forEach(function (label, i) {
        var lgn = $('<span style=margin-left:10px;background-color:' + ChartBlockShopFirstMelt.options.colors[i] + '>    </span><br>').text(label['label']).prepend();
        $("#legendFirstMelt").append(lgn);
    });

Answer 1

您需要在选项 colors 中定义一组颜色。

然后对于您的图例，您可以使用取模运算符 (%) 来显示该数组中的正确颜色。

在我下面的例子中： color_morris是颜色数组 i是解析出来的索引

color_morris[i%color_morris.length]

Morris 图表中的有限颜色

limited color in Morris chart

model-view-controller

morris.js