Question

我有一个已填充的列表（lstObjects），正在尝试使该数据显示在Chartist.js图上。当我将lstObjects悬停在调试模式下时，我可以看到列表的数量和对象类型。

我目前在我的<script>标签中：

    var chartOptions = {
    showLines: true,
    responsive: true,
    maintainAspectRatio: false,
    legend: {
        display: false
    },
        tooltips: {
        displayColors: false
    },
    scales: {

        xAxes: [{
            display: true,
            ticks: {
                fontColor: 'black',
                padding: 20

            },
            gridLines: {
                borderDash: [1, 5],
                tickMarkLength: 0,
                zeroLineBorderDash: [1, 5],
                drawBorder: false,
                padding: 5
            }
        }],
        yAxes: [{
            display: true,
            ticks: {
                fontColor: 'black',
                padding: 20
            },
            gridLines: {
                color: 'rgba(85, 85, 85, 0.5)',
                borderDash: [1, 5],
                tickMarkLength: 0,
                zeroLineBorderDash: [1, 5],
                drawBorder: false,
                padding: 5
            }
        }]
    }
};

// Total Transactions Chart
var achChart = new Chart(document.getElementById('myChart').getContext('2d'), {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
        datasets: [{
            label: '',
            lineTension: 0,
            fill: false,
            backgroundColor: 'rgb(25, 255, 102)',
            borderColor: 'rgba(25, 255, 102, 0.4)',
            borderWidth: 5,
            data: [0, 600, 200, 450, 800, 900, 550, 700, 800, 600]

        }]
    },
    options: chartOptions,

});

我希望数据对数据执行以下操作：

 labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
 data: [100, 120, 180, 200, 300, 155, 220, 430, 275, 350, 120, 450]

我知道我需要将列表项转换为字符串，并尝试加入SubmitDate，但无法正常工作。

var submitDate = string.Join("','", @Model.lstObjects.Select(x => x.RecordMonth).ToList());

有人对我如何做到这一点有任何建议吗？

Answer 1

我可以使用逗号上的@Html.Raw和String.Join使它正常工作。我还在'Jan'之类的月份字符串周围加上了勾号。

下面是我所做的事情的一个示例。

data: {
      labels: [@Html.Raw("'" + String.Join("','", (Model.lstObjects.Select(x => x.RecordMonth).ToList())) + "'")],

ASP.NET Core Razor页面-获取要在Chart.js图上显示的列表数据

1 个答案: