ダイナミックデータのハイチャートへのバインド

Question

ハイプロファイルチャートには、ビューモデルを使用してデータを供給しようとしていますが、動作させることはできません。 私はこのようなモデルに移入され、私のチャートで使用する文字列のリスト：

var list = new List<ClinicPatients>(); 
foreach (var customer in customers) 
{ 
    var customerName = GetCustomerName(customer); 
    var numOfPatients = GetNumOfActivePatients(customer); 
    list.Add(new ClinicPatients { ClinicName = customerName, PatientNumber = nummOfPatients }); 
} 
public string ClinicList { get; set; } 
var tempList = list.Select(x => x.ClinicName); 
ClinicList = JsonConvert.SerializeObject(tempList); 

私はこれをデバッグし、私はClinicListでこれを参照してくださいテキストビジュアライザに選択します。 [「A」、 "B "、" C "、" D "、" E "、" F "私はこれをコピーし、私のjavascripにハードコードそれは動作しますが、私のjavascripが私のviewmodelにバインドされているとき私は動作しません。誰かが理由を説明できますか？

Model.ClinicUsers intのリストです。

私のHTML/Javascriptが次のようになります。私のために働いた

@Html.Raw(Json.Encode(Model.ClinicUsers.ToArray())) 

：

<div class="content"> 
    <div> 
     <div id="usersPerClinicDiagram" style="width: 800px; height: 300px;"> 
      <div id="activUsers" style="width: 800px; height: 300px;"></div> 
     </div> 
    </div> 
</div> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(function() { 
      var usersPerClinicDiagram = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'activUsers', 
        type: 'bar' 
       }, 
       legend: {enabled: false}, 
       title: {text: 'Number of active users per clinic'}, 
       subtitle: {text: 'for how many weeks they kept on using Triabetes'}, 
       tooltip: {enabled: false}, 
       xAxis: { 
        title: {text: 'number of users',align: 'high'}, 
        allowDecimals: false, 
        categories: @Model.ClinicList 
        }, 
       yAxis: {min: 0, 
        allowDecimals: false, 
        title: {text: 'Clinic',align: 'high'}, 
        labels: {overflow: 'justify'} 

       }, 
       plotOptions: { 
        bar: {dataLabels: {enabled: false} 
        } 
       }, 
       credits: {enabled: false}, 
       series: [{ data: @Model.ClinicUsers }] 
      }); 
     }); 
    }); 
</script> 

Answer 1

はこれを試してみてください。