Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Read data from CSV file and Display Bar Chart #755

Open
BearTi opened this issue Aug 7, 2018 · 0 comments
Open

Read data from CSV file and Display Bar Chart #755

BearTi opened this issue Aug 7, 2018 · 0 comments

Comments

@BearTi
Copy link

BearTi commented Aug 7, 2018

Hi,

I want to display some data as a Bar Chart like this here:
https://krispo.github.io/angular-nvd3/#/historicalBarChart

My data come from a CSV file, which looks like this:

timestamp,value
1533581836000,177
1533581936000,100

I don´t know / I don´t get the data into the $scope.data object.

Here is my app.js:

var app = angular.module('plunker', ['nvd3']);

app.controller('MainCtrl', function($scope) {
  $scope.options = {
            chart: {
                type: 'historicalBarChart',
                height: 450,
                margin : {
                    top: 20,
                    right: 20,
                    bottom: 65,
                    left: 50
                },
                x: function(d){return d[0];},
                y: function(d){return d[1]/100000;},
                showValues: true,
                valueFormat: function(d){
                    return d3.format(',.1f')(d);
                },
                duration: 100,
                xAxis: {
                    axisLabel: 'X Axis',
                    tickFormat: function(d) {
                        return d3.time.format('%x')(new Date(d))
                    },
                    rotateLabels: 30,
                    showMaxMin: false
                },
                yAxis: {
                    axisLabel: 'Y Axis',
                    axisLabelDistance: -10,
                    tickFormat: function(d){
                        return d3.format(',.1f')(d);
                    }
                },
                tooltip: {
                    keyFormatter: function(d) {
                        return d3.time.format('%x')(new Date(d));
                    }
                },
                zoom: {
                    enabled: true,
                    scaleExtent: [1, 10],
                    useFixedDomain: false,
                    useNiceScale: false,
                    horizontalOff: false,
                    verticalOff: true,
                    unzoomEventType: 'dblclick.zoom'
                }
            }
        };

	d3.csv("energyConsumption_Poolpumpe.log", function(error, data) {
		console.log(data);
		console.log(error);
		$scope.data = data;
		$scope.$apply();
	});

Furthermore I want to read out the data from the file and do a calculation (second value minus first value, third value minus second value and so on).

How can I do this?

Thanks a lot!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant