ASP MVCでjavascript関数のs文字列をvarに挿入

Question

ASPプロジェクトのMVCパターンにグラフを挿入する必要があります。 Json形式で必要な文字列を自分で定義していますが、正しく動作しているようです。 コントローラによって定義される文字列は、次のとおりです

{ 
    labels: ['America','Europa', 'Global','Oceania'], 
    datasets: [{ 
     data: [0.20, 0.20, 0.20, 0.40], 
     backgroundColor: ['#a3aaf7','#89a8ff', '#01469b', '#0d1156'], 
     hoverBackgroundColor: ['#beed9e', '#84ffbd', '#0afb00', '#058217'] 
    }] 
} 

chart.jsを使用して、グラフを挿入するには、明らかに私は、対応するJavaScript関数にこの変数を渡す必要がある...私は（HTMLヘルパーを使用しようとしました@ html.displayfor）などModel.Tipologie_json @例えばモデル変数への直接参照（）：

<script> 
    var tipologia=new string(@Model.Tipologie_json); 
    window.onload=function(){ 
     var ctx = document.getElementById("Tipologia").getContext("2d"); 
     var myPieChart = new Chart(ctx, { type: 'pie', data: tipologia }); 
    } 
</script> 

しかし、HTMLのように変換されます

var tipologia=new string({labels:['Equity'],datasets:[{ data:[1.00000],backgroundColor:['#a3aaf7'],hoverBackgroundColor:['#beed9e']}]}); 

したがって 'を等価なコードに変換し、これによりチャートの計算が失敗するようになります。 文字変換を行わずにHTMLに変数を渡すにはどうすればよいですか？あなたがこれを行うことができます代わりに、あなたのjavascriptに直接値を挿入しようとする多くのおかげ

Answer 1

：

：モデル内のデータはすでにJSONとしてシリアライズされていない場合

<script type="application/json" id="yourData">@Model.YourJson</script> 

あなたがこれを行うことができます

<script type="application/json" id="yourData"> 
    @Html.Raw(JsonConvert.SerializeObject(Model.YourData, 
     new JsonSerializerSettings 
      { ContractResolver = new CamelCasePropertyNamesContractResolver() })) 
</script> 

または（モデルはすでにJSONを含むように）コントローラでそれをシリアル化するために、あなたは同じように、モデルの文字列プロパティを設定します：

model.SomeStringProperty = JsonConvert.SerializeObject(
    Model.YourData, 
    new JsonSerializerSettings 
      { ContractResolver = new CamelCasePropertyNamesContractResolver() }); 

（私はJSONキャメルケースの設定を使用していますが、あなたはそれを残すことができる。）次に

あなたのJavaScriptからデータを取得するために：あなたは、それらの配列として持つクラスを作成することができ

var parsed = JSON.parse(document.getElementById("yourData").textContent);