Getting Started Sample not working

[Farcek]

inports

<script src="https://cdnjs.cloudflare.com/ajax/libs/line-chart/2.0.25/LineChart.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/line-chart/2.0.25/LineChart.min.css">

https://github.com/n3-charts/line-chart/blob/master/docs/getting-started.md

sample is not working.

[chaosmail]

Hi @Farcek could you be more specific about what is not working? Scripts not loading, data not loading, chart not loading, etc. You can find tons of working examples here http://n3-charts.github.io/line-chart/#/examples Best, Christoph

[Farcek]

import

<script src="/bower_components/jquery/dist/jquery.js"></script>
<script src="/bower_components/foundation-sites/dist/foundation.js"></script>
<script src="/bower_components/foundation-sites/js/foundation.offcanvas.js"></script>

<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="/bower_components/angular-messages/angular-messages.js"></script>
<script src="/bower_components/angular-cookies/angular-cookies.js"></script>

<script src="/bower_components/d3/d3.min.js"></script>
<script src="/bower_components/pie-chart/dist/pie-chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/line-chart/2.0.25/LineChart.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/line-chart/2.0.25/LineChart.min.css">

controller

...
.controller('MainCtrl', function ($scope) {
        $scope.data = {
            dataset0: [
                {x: 0, val_0: 0, val_1: 0, val_2: 0, val_3: 0},
                {x: 1, val_0: 0.993, val_1: 3.894, val_2: 8.47, val_3: 14.347},
                {x: 2, val_0: 1.947, val_1: 7.174, val_2: 13.981, val_3: 19.991},
                {x: 3, val_0: 2.823, val_1: 9.32, val_2: 14.608, val_3: 13.509},
                {x: 4, val_0: 3.587, val_1: 9.996, val_2: 10.132, val_3: -1.167},
                {x: 5, val_0: 4.207, val_1: 9.093, val_2: 2.117, val_3: -15.136},
                {x: 6, val_0: 4.66, val_1: 6.755, val_2: -6.638, val_3: -19.923},
                {x: 7, val_0: 4.927, val_1: 3.35, val_2: -13.074, val_3: -12.625}
            ]
        };

        $scope.options = {
            series: [
                {
                    axis: "y",
                    dataset: "dataset0",
                    key: "val_0",
                    label: "An area series",
                    color: "#1f77b4",
                    type: ['line', 'dot', 'area'],
                    id: 'mySeries0'
                }
            ],
            axes: {x: {key: "x"}}
        };
    })
...

partial

<div class="my-chart" ng-controller='MainCtrl'>
    <linechart data="data" options="options"></linechart>
</div>

the not working..

i flowing https://github.com/n3-charts/line-chart/blob/master/docs/getting-started.md helping page?

[Farcek]

And. Why bower not supported ?

[chaosmail]

Can you post the error messages from the console, otherwise we cannot help you. Maybe try to create a codepen and share it, so I can reproduce the error.

Bower integration is discussed here #438 and will be coming soon. However for now we are using npm

[Farcek]

[chaosmail]

I just copied the sample over to codepen and it works great: http://codepen.io/chaosmail/pen/qZzxEE

I just saw that you are not using the sample code, but loads of other imports. Can you please try to disable those, especially <script src="/bower_components/pie-chart/dist/pie-chart.min.js"></script>

[chaosmail]

There was once an issue #295 in combination with pie charts,

[Farcek]

ok. tnx.