-2

I have a webapp for project management which is using localstorage for storing array of objects. And Now on the dashboard , I want to show a google pie chart.

An object in the localstorage looks like this.

assignedTo: "Laxman"
closingdate: "2019-06-15"
description: "Some what desc"
id: 1560281058591
name: "Project1"
postdate: "2019-06-11"
status: "Open"

Now I want to make a pie chart showing project.assignedTo and number of projects assigned to that employee.

Now I want know is hoe to function to set the variable getPro to map project.assignedTo and number of projects assigned to that. Here's the code for google pie.

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load("current", {packages:["corechart"]});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var getPro = JSON.parse(localStorage.projects).map(
            project =>
            ['Employee', 'Number Of Project'],
            [$(project.assignedTo), <HERE I AM GETTING STUCK>]
        );

        var data = google.visualization.arrayToDataTable(getPro);

        var options = {
          title: 'Number of Projects Assigned',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
</script>

Please help me out in it.

Himanshu Damani
  • 1
  • 3
  • What is a *localstorage project* ? You mean you have a web app that stores data in the browser's local storage? Are you asking how to make a pie chart? Are you asking how to get data out of local storage? Are you asking how to store data in local storage? You gotta be way more specific than that. What have you tried? What isn't working? – Isaac Vidrine Jun 12 '19 at 20:12
  • Welcome to StackOverflow! Unfortunately that's a very broad question and I can't see the connection to localStorage. It sounds like you're in need of a tutorial on pie charts. How does the array of objects look like? – obscure Jun 12 '19 at 20:13
  • @IsaacVidrine I am Editing the question . Thanks for letting me know how to question – Himanshu Damani Jun 13 '19 at 08:31
  • This may help you https://stackoverflow.com/questions/42219531/how-to-retrieve-data-from-local-storage?rq=1 – Hardik Leuwa Jun 13 '19 at 09:09
  • @HardikLeuwa Thanks for this but I know how to retrive and update localstorage, what i want is how to function pie chart in way to get my localstorage object attributes. – Himanshu Damani Jun 13 '19 at 10:18

1 Answers1

0

For this you need any javascript library to create a chart, there are many options available. Let's, for example, you selected Google Charts.

Steps:

  1. Retrieve data from your local storage.
  2. And then you have the predefined functions of Google Charts or any other library that you are using.
  3. Pass your data in those functions and render your chart in HTML.
Amrit
  • 1
  • 1
  • Thanks Amrit for the help. But I know this, I want to know is how to edit those predefined functions of google pie chart to perform the function I want! I have edited the question please look into it – Himanshu Damani Jun 13 '19 at 08:46