使用Javascript进行图表Js数据转换_Javascript_Node.js_Chart.js

使用Javascript进行图表Js数据转换

javascript node.js chart.js

使用Javascript进行图表Js数据转换,javascript,node.js,chart.js,Javascript,Node.js,Chart.js,我需要帮助转换数据。我需要画一个叠加图。我从后端获得的数据不是图表js格式。我需要通过相同的verticalName示例计算关键字计数的百分比（在我的例子中，BCM中的损耗为56.52）。你能指导我如何解决这个问题吗 const d = [ { name: 'Attrition', keywordId: 1, verticalId: 1, verticalName: 'BCM', countOfKeywords: 20, }, { na

我需要帮助转换数据。我需要画一个叠加图。我从后端获得的数据不是图表js格式。我需要通过相同的verticalName示例计算关键字计数的百分比（在我的例子中，BCM中的损耗为56.52）。你能指导我如何解决这个问题吗

const d = [
  {
    name: 'Attrition',
    keywordId: 1,
    verticalId: 1,
    verticalName: 'BCM',
    countOfKeywords: 20,
  },
  {
    name: 'Others',
    keywordId: 2,
    verticalId: 1,
    verticalName: 'BCM',
    countOfKeywords: 26,
  },
  {
    name: 'Others',
    keywordId: 2,
    verticalId: 2,
    verticalName: 'CGLR',
    countOfKeywords: 24,
  },
];

我试过什么

const amp = d.map((a) => {
  const vertName = a.verticalName;
  if (obj && vertName in obj) {
    obj[a.verticalName].sum += a.countOfKeywords;
    obj[a.verticalName].keywords.push({ name: a.name, countOfKeyword: a.countOfKeywords });
  } else {
    obj[a.verticalName] = {};
    obj[a.verticalName].keywords = [];
    obj[a.verticalName].keywords.push({ name: a.name, countOfKeyword: a.countOfKeywords });
    obj[a.verticalName].sum = a.countOfKeywords;
  }
});

for (let i in obj) {
  obj[i].keywords.forEach(e => {
    e.pert = (e.countOfKeyword / obj[i].sum) * 100;
  })
}

我的代码的输出-->

最终结果需要什么图表js

这里数据集数组由包含另一个数据数组的对象组成

在标签中，数组0索引表示应用于数据集中数据属性的相同规则。如果垂直名称缺少任何名称（如磨损或其他关键字）。我们需要在特定索引的数据数组中添加0值

示例损耗在CGLR垂直中不可用，因此我们需要在该索引中添加0

{
    labels: ['BCM', 'CGLR'],
      datasets: [
        {
          label: 'Attrition',
          data: [43.47, 0]
        },
        {
          label: 'Others',
          data: [ 56.52, 100]
        }
      ]
}

谢谢，meet

我的解决方案将通过两个步骤创建chartjs数据第一步我将创建分组数据和模板数据

将包含每个
```
名称
```
和
```
垂直名称
```
的数据与其
```
关键字计数
```
进行分组
包含0个百分比的chartjs数据的模板数据

第二步，我将从分组中获取数据并将其放入模板中

输入

分组后

{
  "BCM": {
    "sum": 46,
    "keywords": {
      "Attrition": 20,
      "Others": 26
    }
  },
  "CGLR": {
    "sum": 24,
    "keywords": {
      "Others": 24
    }
  },
  "NEW": {
    "sum": 21,
    "keywords": {
      "Attrition": 20,
      "Others": 1
    }
  }
}

模板

{
  "labels": [
    "BCM",
    "CGLR",
    "NEW"
  ],
  "datasets": [
    {
      "label": "Attrition",
      "data": [
        0,
        0,
        0
      ]
    },
    {
      "label": "Others",
      "data": [
        0,
        0,
        0
      ]
    }
  ]
}

输出

{
  "labels": [
    "BCM",
    "CGLR",
    "NEW"
  ],
  "datasets": [
    {
      "label": "Attrition",
      "data": [
        43.47826086956522,
        0,
        95.23809523809523
      ]
    },
    {
      "label": "Others",
      "data": [
        56.52173913043478,
        100,
        4.761904761904762
      ]
    }
  ]
}

完整代码

// input
const array = [
    {
        name: 'Attrition',
        verticalName: 'BCM',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'BCM',
        countOfKeywords: 26,
    },
    {
        name: 'Others',
        verticalName: 'CGLR',
        countOfKeywords: 24,
    },
    {
        name: 'Attrition',
        verticalName: 'NEW',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'NEW',
        countOfKeywords: 1,
    },
];

// declare variables
let uniqueNames = new Set();
const grouping = {};
const template = {
    labels: [],
    datasets: []
}

// create grouping object and create template labels 
for (let i = 0; i < array.length; i += 1) {
    const element = array[i];

    if (grouping[element.verticalName] === undefined) {
        template.labels.push(element.verticalName);
        grouping[element.verticalName] = { sum: 0, keywords: {} };
    };

    grouping[element.verticalName].sum += element.countOfKeywords;
    grouping[element.verticalName].keywords[element.name] = grouping[element.verticalName].keywords[element.name] ? grouping[element.verticalName].keywords[element.name] + element.countOfKeywords : element.countOfKeywords

    uniqueNames.add(element.name);
}

// uniqueNames Set to Array   
uniqueNames = [...uniqueNames];

// create template datasets with 0 percentage
// I did it after first loop because I want to makesure the template.labels.length completed
template.datasets = uniqueNames.map(label => ({ label, data: new Array(template.labels.length).fill(0) }));

// target for now create grouping & create template with labels and 0 percentages
// console.log(JSON.stringify(grouping, null, 2));
// console.log(JSON.stringify(template, null, 2));

// calculate the percentages
for (let i = 0; i < template.datasets.length; i++) {
    const uniqueName = uniqueNames[i];

    for (let j = 0; j < template.labels.length; j++) {
        const label = template.labels[j];
        if (grouping[label].keywords[uniqueName] === undefined) {
            template.datasets[i].data[j] = 0;
        } else {
            template.datasets[i].data[j] = grouping[label].keywords[uniqueName] / grouping[label].sum * 100;
        }
    }
}

// output
console.log(JSON.stringify(template, null, 2));

//输入
常量数组=[
{
名称：'损耗'，
垂直名称：“BCM”，
关键词：20，
},
{
姓名：'其他'，
垂直名称：“BCM”，
关键词：26，
},
{
姓名：'其他'，
垂直名称：“CGLR”，
关键词：24，
},
{
名称：'损耗'，
verticalName:'新'，
关键词：20，
},
{
姓名：'其他'，
verticalName:'新'，
关键词：1，
},
];
//声明变量
设uniqueNames=new Set（）；
常量分组={}；
常量模板={
标签：[]，
数据集：[]
}
//创建分组对象并创建模板标签
for（设i=0；i（{label，data:newarray（template.labels.length）.fill（0）}））；
//现在创建分组的目标&创建带有标签和0百分比的模板
//log（JSON.stringify（grouping，null，2））；
//log（JSON.stringify（模板，null，2））；
//计算百分比
for（设i=0；i



更新
通过跳过将数据集添加到第二个循环之前的模板来优化代码
// input
const array = [
    {
        name: 'Attrition',
        verticalName: 'BCM',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'BCM',
        countOfKeywords: 26,
    },
    {
        name: 'Others',
        verticalName: 'CGLR',
        countOfKeywords: 24,
    },
    {
        name: 'Attrition',
        verticalName: 'NEW',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'NEW',
        countOfKeywords: 1,
    },
];

// declare variables
let uniqueNames = new Set();
const grouping = {};
const template = {
    labels: [],
    datasets: []
}

// create grouping object and create template labels 
for (let i = 0; i < array.length; i += 1) {
    const element = array[i];

    if (grouping[element.verticalName] === undefined) {
        template.labels.push(element.verticalName);
        grouping[element.verticalName] = { sum: 0, keywords: {} };
    };

    grouping[element.verticalName].sum += element.countOfKeywords;
    grouping[element.verticalName].keywords[element.name] = grouping[element.verticalName].keywords[element.name] ? grouping[element.verticalName].keywords[element.name] + element.countOfKeywords : element.countOfKeywords

    uniqueNames.add(element.name);
}

// uniqueNames Set to Array   
uniqueNames = [...uniqueNames];

// target for now create grouping & create template with labels and without datasets 
// console.log(JSON.stringify(grouping, null, 2));
// console.log(JSON.stringify(template, null, 2));
 
// add datasets
// calculate the percentages
for (let i = 0; i < uniqueNames.length; i++) {
    const uniqueName = uniqueNames[i];

    template.datasets.push({ label: uniqueName, data: [] })

    for (let j = 0; j < template.labels.length; j++) {
        const label = template.labels[j];
        if (grouping[label].keywords[uniqueName] === undefined) {
            template.datasets[i].data[j] = 0;
        } else {
            template.datasets[i].data[j] = grouping[label].keywords[uniqueName] / grouping[label].sum * 100;
        }
    }
}

// output
console.log(JSON.stringify(template, null, 2));

//输入
常量数组=[
{
名称：'损耗'，
垂直名称：“BCM”，
关键词：20，
},
{
姓名：'其他'，
垂直名称：“BCM”，
关键词：26，
},
{
姓名：'其他'，
垂直名称：“CGLR”，
关键词：24，
},
{
名称：'损耗'，
verticalName:'新'，
关键词：20，
},
{
姓名：'其他'，
verticalName:'新'，
关键词：1，
},
];
//声明变量
设uniqueNames=new Set（）；
常量分组={}；
常量模板={
标签：[]，
数据集：[]
}
//创建分组对象并创建模板标签
for（设i=0；i

// input
const array = [
    {
        name: 'Attrition',
        verticalName: 'BCM',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'BCM',
        countOfKeywords: 26,
    },
    {
        name: 'Others',
        verticalName: 'CGLR',
        countOfKeywords: 24,
    },
    {
        name: 'Attrition',
        verticalName: 'NEW',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'NEW',
        countOfKeywords: 1,
    },
];

// declare variables
let uniqueNames = new Set();
const grouping = {};
const template = {
    labels: [],
    datasets: []
}

// create grouping object and create template labels 
for (let i = 0; i < array.length; i += 1) {
    const element = array[i];

    if (grouping[element.verticalName] === undefined) {
        template.labels.push(element.verticalName);
        grouping[element.verticalName] = { sum: 0, keywords: {} };
    };

    grouping[element.verticalName].sum += element.countOfKeywords;
    grouping[element.verticalName].keywords[element.name] = grouping[element.verticalName].keywords[element.name] ? grouping[element.verticalName].keywords[element.name] + element.countOfKeywords : element.countOfKeywords

    uniqueNames.add(element.name);
}

// uniqueNames Set to Array   
uniqueNames = [...uniqueNames];

// create template datasets with 0 percentage
// I did it after first loop because I want to makesure the template.labels.length completed
template.datasets = uniqueNames.map(label => ({ label, data: new Array(template.labels.length).fill(0) }));

// target for now create grouping & create template with labels and 0 percentages
// console.log(JSON.stringify(grouping, null, 2));
// console.log(JSON.stringify(template, null, 2));

// calculate the percentages
for (let i = 0; i < template.datasets.length; i++) {
    const uniqueName = uniqueNames[i];

    for (let j = 0; j < template.labels.length; j++) {
        const label = template.labels[j];
        if (grouping[label].keywords[uniqueName] === undefined) {
            template.datasets[i].data[j] = 0;
        } else {
            template.datasets[i].data[j] = grouping[label].keywords[uniqueName] / grouping[label].sum * 100;
        }
    }
}

// output
console.log(JSON.stringify(template, null, 2));


// input
const array = [
    {
        name: 'Attrition',
        verticalName: 'BCM',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'BCM',
        countOfKeywords: 26,
    },
    {
        name: 'Others',
        verticalName: 'CGLR',
        countOfKeywords: 24,
    },
    {
        name: 'Attrition',
        verticalName: 'NEW',
        countOfKeywords: 20,
    },
    {
        name: 'Others',
        verticalName: 'NEW',
        countOfKeywords: 1,
    },
];

// declare variables
let uniqueNames = new Set();
const grouping = {};
const template = {
    labels: [],
    datasets: []
}

// create grouping object and create template labels 
for (let i = 0; i < array.length; i += 1) {
    const element = array[i];

    if (grouping[element.verticalName] === undefined) {
        template.labels.push(element.verticalName);
        grouping[element.verticalName] = { sum: 0, keywords: {} };
    };

    grouping[element.verticalName].sum += element.countOfKeywords;
    grouping[element.verticalName].keywords[element.name] = grouping[element.verticalName].keywords[element.name] ? grouping[element.verticalName].keywords[element.name] + element.countOfKeywords : element.countOfKeywords

    uniqueNames.add(element.name);
}

// uniqueNames Set to Array   
uniqueNames = [...uniqueNames];

// target for now create grouping & create template with labels and without datasets 
// console.log(JSON.stringify(grouping, null, 2));
// console.log(JSON.stringify(template, null, 2));
 
// add datasets
// calculate the percentages
for (let i = 0; i < uniqueNames.length; i++) {
    const uniqueName = uniqueNames[i];

    template.datasets.push({ label: uniqueName, data: [] })

    for (let j = 0; j < template.labels.length; j++) {
        const label = template.labels[j];
        if (grouping[label].keywords[uniqueName] === undefined) {
            template.datasets[i].data[j] = 0;
        } else {
            template.datasets[i].data[j] = grouping[label].keywords[uniqueName] / grouping[label].sum * 100;
        }
    }
}

// output
console.log(JSON.stringify(template, null, 2));