问题描述
我有一个项目，需要根据从Controller加载到视图页面的sql数据，使用Chart.JS显示line-chart。
我想要一个带有多个数据集的简单折线图。数据集将必须自动更新控制器数据加载。
但是，不幸的是，我尝试将视图中的数据加载到图表中，但是没有运气，仍然得到了不准确的结果。
我想要的是每个Exception reading manifest from file:///C:/Users/...vsto: the manifest may not be valid or the file Could not be opened.
************** Exception Text **************
System.Deployment.Application.InvalidDeploymentException: Exception reading manifest from file:///C:/Users/...vsto: the manifest may not be valid or the file Could not be opened. ---> System.Deployment.Application.InvalidDeploymentException: Manifest XML signature is not valid. ---> System.Security.Cryptography.CryptographicException: SignatureDescription Could not be created for the signature algorithm supplied.
at System.Security.Cryptography.Xml.SignedXml.CheckSignedInfo(asymmetricAlgorithm key)
at System.Security.Cryptography.Xml.SignedXml.CheckSignatureReturningKey(asymmetricAlgorithm& signingKey)
at System.Deployment.Internal.CodeSigning.SignedCmiManifest.Verify(CmiManifestVerifyFlags verifyFlags)
at System.Deployment.Application.Manifest.AssemblyManifest.ValidateSignature(Stream s)
--- End of inner exception stack trace ---
at System.Deployment.Application.Manifest.AssemblyManifest.ValidateSignature(Stream s)
at System.Deployment.Application.ManifestReader.FromDocument(String localPath,ManifestType manifestType,Uri sourceUri)
--- End of inner exception stack trace ---
at Microsoft.VisualStudio.Tools.Applications.Deployment.ClickOnceAddindeploymentManager.GetManifests(TimeSpan timeout)
at Microsoft.VisualStudio.Tools.Applications.Deployment.ClickOnceAddindeploymentManager.InstallAddIn()
应该有自己的行和数据。但在我目前的结果中，仅显示一行。而且我不知道该怎么做。
TagsN; @Html.Raw(TagsC); @Html.Raw(TagsN)结果显示在Excell电子表格上。
首先，我将控制器数据转换为@Html.Raw(TagsD)以获取JSON格式并将其解析为图表标签和数据。
结果可能与下图不同，但是我只想看看有什么用。
这些是测试数据
Newtownsoft.Json.JsonConvert.SerializeObject()JavaScript
var TagsC = Newtonsoft.Json.JsonConvert.SerializeObject(Model._CountedList.Select(x => x.Counted).ToList());
var TagsN = Newtonsoft.Json.JsonConvert.SerializeObject(Model._NameList.Select(x => x.Tag_name).ToList());
var TagsD = Newtonsoft.Json.JsonConvert.SerializeObject(Model._DateList.Select(x => x.Tag_date).ToList());
我想要这样的结果：
我们将不胜感激大家的帮助。
解决方法
data.datasets接受一个数组，因此数组中的每个项目都会向图表添加另一条线。
以下是将数据库中的数据“转换”为图表格式的步骤：
- 使用
SerializeObject将表序列化为JSON。看起来应该像
[
{ TagsC: 1,TagsN: "Escalation",TagsD: "06 Oct" },{ TagsC: 7,TagsN: "Switchboard In",]
- 按记录的
TagsN属性对记录进行分组（您也可以在大型数据集中建议的database itself中执行此操作）。Map可以以干净的方式帮助您完成操作，因此结果是一个Map-键是TagsN，值是具有此TagsN的项目的列表。 li>
[[Entries]]
0: {"Escalation" => Array(1)}
1: {"Switchboard In" => Array(7)}
2: {"Account Manager" => Array(5)}
...
- 将其转换为chartjs
datasets格式。
0: {label: "Escalation",data: Array(1)}
1: {label: "Switchboard In",data: Array(7)}
2: data: (5) [1,1,1]
label: "Account Manager"
工作示例：
// this data should come from the server
const colors = ['red','blue','green','yellow'];
const grouped = groupBy(data,'TagsN');
const lineData = {
datasets: Array.from(grouped).map(([key,items],index) => ({
label: key,data: items.map(item => item.TagsC),backgroundColor: colors[index]
})),labels: Array.from(new Set([...TagsDs]))
};
new Chart(document.getElementById("line-chart").getContext('2d'),{
type: 'line',data: lineData,fill: false
});
function groupBy(arr,key) {
return arr.reduce((prev,current) => {
const groupKey = current[key];
if (!prev.has(groupKey)) {
prev.set(groupKey,[]);
}
prev.get(groupKey).push(current);
return prev;
},new Map());
}<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
<canvas id="line-chart" width="800" height="250"></canvas>
<script>
const TagsDs = ["06 Oct","06 Oct","07 Oct","08 Oct","09 Oct","12 Oct","13 Oct","14 Oct","14 Oct"];
const data = [
{ TagsC: 1,{ TagsC: 3,TagsD: "07 Oct" },{ TagsC: 1,TagsN: "Account Manager",TagsD: "08 Oct" },{ TagsC: 10,{ TagsC: 4,TagsD: "09 Oct" },TagsD: "12 Oct" },{ TagsC: 6,TagsD: "13 Oct" },TagsD: "14 Oct" },];
</script>