Как разрешить пользователям создавать произвольное количество строк

Question

Я новичок в ASP.NET. Я создаю простой веб-сайт, который позволяет пользователям создавать диаграммы. На переднем конце я использую Charts.js, где данные для каждой диаграммы выглядит следующим образом:

var data = { 
    labels: ["January", "February", "March", "April", "May", "June", "July"], 
    datasets: [ 
     { 
      label: "My First dataset", 
      fillColor: "rgba(220,220,220,0.2)", 
      strokeColor: "rgba(220,220,220,1)", 
      pointColor: "rgba(220,220,220,1)", 
      pointStrokeColor: "#fff", 
      pointHighlightFill: "#fff", 
      pointHighlightStroke: "rgba(220,220,220,1)", 
      data: [65, 59, 80, 81, 56, 55, 40] 
     } 
    ] 
}; 

Мой план заключается в создании модели данных для диаграммы, которая позволит пользователю задать различные свойства диаграммы. Ниже приведена моя модель:

Ниже мой класс. Предположим, каждая карта будет иметь только один набор данных на данный момент:

public class Chart 
{ 
    public int ID { get; set; } 
    public string title { get; set; } 
    public string fillColor { get; set; } 
    public string strokeColor { get; set; } 
    public string pointColor { get; set; } 
} 

Мой вопрос, что это лучший способ справиться с собственностью этикетки? Должен ли я просто включать его как другое свойство строки в класс, пусть пользователь вводит каждую метку в поле ввода, разделенное точкой с запятой, а затем перебирает ее, чтобы заполнить свойство меток на объекте JavaScript? Или есть лучший способ?

Примечание: Я не беспокоюсь о целочисленном массиве data на диаграмме. Все начальные значения для этого будут равны 0, поэтому я буду жестко программировать его.

Answer 1

Я бы предпочел сохранить модель, как показано ниже.

public class Dataset 
    { 
     public string label { get; set; } 
     public string fillColor { get; set; } 
     public string strokeColor { get; set; } 
     public string pointColor { get; set; } 
     public string pointStrokeColor { get; set; } 
     public string pointHighlightFill { get; set; } 
     public string pointHighlightStroke { get; set; } 
     public List<int> data { get; set; } 
    } 

    public class Chart 
    { 
     public List<string> labels { get; set; } 
     public List<Dataset> datasets { get; set; } 
    }