Skip to content

Commit 84700d5

Browse files
rohanoid5rohanoid5
committed
Merge branch 'master' of github.com:fusioncharts/angularjs-fusioncharts
2 parents d990ee8 + b4892b4 commit 84700d5

9 files changed

+180
-138
lines changed

‎LICENSE

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
The MIT License (MIT)
22

3-
Copyright (c) 2014 FusionCharts Technologies
3+
Copyright (c) 2014 InfoSoft Global Pvt. Ltd.
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy
66
of this software and associated documentation files (the "Software"), to deal

‎README.md

+43-10
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
A simple and lightweight official AngularJS component for FusionCharts JavaScript charting library. angularjs-fusioncharts enables you to add JavaScript charts in your AngularJS application without any hassle.
44

5-
## [Demo](https://fusioncharts.github.io/angular-fusioncharts/)
5+
## [Demo](https://fusioncharts.github.io/angularjs-fusioncharts/)
66

77
- Github Repo: [https://github.com/fusioncharts/angularjs-fusioncharts](https://github.com/fusioncharts/angularjs-fusioncharts)
88
- Documentation: [https://www.fusioncharts.com/dev/getting-started/angular/angularjs/your-first-chart-using-angularjs](https://www.fusioncharts.com/dev/getting-started/angular/angularjs/your-first-chart-using-angularjs)
@@ -24,6 +24,7 @@ A simple and lightweight official AngularJS component for FusionCharts JavaScrip
2424
- [Quick Start](#quick-start)
2525
- [Going Beyond Charts](#going-beyond-charts)
2626
- [Usage and Integration of FusionTime](#usage-and-integration-of-fusiontime)
27+
- [Special note for IE Users](#special-note)
2728
- [For Contributors](#for-contributors)
2829
- [Licensing](#licensing)
2930

@@ -40,7 +41,7 @@ A simple and lightweight official AngularJS component for FusionCharts JavaScrip
4041
To install `angularjs-fusioncharts` library, run:
4142

4243
```bash
43-
$ npm install angular-fusioncharts --save
44+
$ npm install angularjs-fusioncharts --save
4445
```
4546

4647
To install `fusioncharts` library:
@@ -339,25 +340,33 @@ var app = angular.module('myApp', ['ng-fusioncharts']);
339340

340341
var jsonify = res => res.json();
341342
var dataFetch = fetch(
342-
'https://raw.githubusercontent.com/fusioncharts/dev_centre_docs/fusiontime-beta-release/charts-resources/fusiontime/online-sales-single-series/data.json'
343+
'https://s3.eu-central-1.amazonaws.com/fusion.store/ft/data/line-chart-with-time-axis-data.json'
343344
).then(jsonify);
344345
var schemaFetch = fetch(
345-
'https://raw.githubusercontent.com/fusioncharts/dev_centre_docs/fusiontime-beta-release/charts-resources/fusiontime/online-sales-single-series/schema.json'
346+
'https://s3.eu-central-1.amazonaws.com/fusion.store/ft/schema/line-chart-with-time-axis-schema.json'
346347
).then(jsonify);
347348

348349
var app = angular.module('myApp', ['ng-fusioncharts']);
349350

350351
app.controller('MyController', function($scope) {
351352
$scope.dataSource = {
352-
caption: { text: 'Online Sales of a SuperStore in the US' },
353353
data: null,
354+
caption: {
355+
text: 'Sales Analysis'
356+
},
357+
subcaption: {
358+
text: 'Grocery'
359+
},
354360
yAxis: [
355361
{
356-
plot: [
357-
{
358-
value: 'Sales ($)'
359-
}
360-
]
362+
plot: {
363+
value: 'Grocery Sales Value',
364+
type: 'line'
365+
},
366+
format: {
367+
prefix: '$'
368+
},
369+
title: 'Sale Value'
361370
}
362371
]
363372
};
@@ -414,6 +423,30 @@ Useful links for FusionTime
414423
- [How FusionTime works](https://www.fusioncharts.com/dev/fusiontime/getting-started/how-fusion-time-works)
415424
- [Create your first chart](https://www.fusioncharts.com/dev/fusiontime/getting-started/create-your-first-chart-in-fusiontime)
416425

426+
## Special Note
427+
428+
If you want to support your application on IE(11 and below), then you need to take following steps:
429+
430+
### Firstly
431+
432+
You have to update your `angularjs-fusioncharts` and `fusioncharts` modules to latest versions. For `angularjs-fusioncharts` install `v5.0.1` and above; for `fusioncharts` install `v3.13.3-sr.1` and above.
433+
434+
### Secondly
435+
436+
In your template, modify your code like so,
437+
438+
```html
439+
<div
440+
fusioncharts
441+
width="600"
442+
height="400"
443+
type="ANY_CHART_TYPE"
444+
datasource-dt="dataSource"
445+
>
446+
// Instead of passing data in datasouce, use datasource-dt.
447+
</div>
448+
```
449+
417450
## For Contributors
418451

419452
- Clone the repository and install dependencies

‎demos/bower.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "angularjs-fusioncharts-demos",
33
"version": "0.0.1",
44
"homepage": "https://github.com/fusioncharts/angularjs-fusioncharts",
5-
"author": "FusionCharts Technologies <[email protected]>",
5+
"author": "InfoSoft Global Pvt. Ltd. <[email protected]>",
66
"license": "MIT",
77
"ignore": [
88
"**/.*",

‎dist/angular-fusioncharts.js

+53-57
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// The MIT License (MIT)
22
//
3-
// Copyright (c) 2014 FusionCharts Technologies
3+
// Copyright (c) 2014 InfoSoft Global Pvt. Ltd.
44
//
55
// Permission is hereby granted, free of charge, to any person obtaining a copy
66
// of this software and associated documentation files (the "Software"), to deal
@@ -45,8 +45,7 @@
4545
map: '@',
4646
markers: '@',
4747
initialized: '&',
48-
datasourceDt: '=datasourceDt',
49-
datasource: '=datasource'
48+
datasourceDt: '=datasourceDt'
5049
},
5150
fcEvents = [
5251
'beforelinkeditemopen',
@@ -199,11 +198,10 @@
199198
return {
200199
scope: scope,
201200
link: function(scope, element, attrs) {
202-
function updateData(key, data) {
203-
if (key) {
204-
scope.datasourceDt.key = data;
205-
chart.setJSONData(scope.datasourceDt);
206-
}
201+
function updateData() {
202+
// no need to check for key. datasourceDt is 2 way binded.
203+
// also scope.datasourceDt.key = data; is logically wrong.
204+
chart.setJSONData(scope.datasourceDt);
207205
}
208206

209207
function createWatchersForAttrs(datasource) {
@@ -213,24 +211,13 @@
213211
scope.$watch(
214212
'datasourceDt.' + key,
215213
function(newData, oldData) {
216-
if (newData !== oldData && isDeep) updateData(key, newData);
214+
if (newData !== oldData && isDeep) updateData();
217215
},
218216
isDeep
219217
);
220218
});
221219
}
222220

223-
if (scope.datasourceDt) {
224-
scope.$watch(
225-
'datasourceDt.data',
226-
function(newData, oldData) {
227-
if (newData !== oldData) updateData(newData, 'data');
228-
},
229-
false
230-
);
231-
createWatchersForAttrs(scope.datasourceDt);
232-
}
233-
234221
var observeConf = {
235222
// non-data componenet observers
236223
NDCObserver: {
@@ -718,43 +705,12 @@
718705
}
719706
}
720707

721-
if (chartConfigObject.dataFormat === 'json') {
722-
if (scope.datasource) {
723-
attrs.datasource = scope.datasource;
724-
chartConfigObject.dataSource = scope.datasource;
725-
dataStringStore.dataSource = scope.datasource;
726-
727-
scope.$watch(
728-
'datasource',
729-
function(newData, oldData) {
730-
if (newData !== oldData) {
731-
chartConfigObject.dataSource = scope.datasource;
732-
dataStringStore.dataSource = scope.datasource;
733-
setChartData();
734-
if (chartConfigObject.dataFormat === 'json') {
735-
setChartData();
736-
} else {
737-
if (chartConfigObject.dataFormat === 'xml') {
738-
chart.setXMLData(newData);
739-
} else if (chartConfigObject.dataFormat === 'jsonurl') {
740-
chart.setJSONUrl(newData);
741-
} else if (chartConfigObject.dataFormat === 'xmlurl') {
742-
chart.setXMLUrl(newData);
743-
}
744-
}
745-
}
746-
},
747-
true
748-
);
749-
}
750-
} else {
751-
if (attrs.datasource) {
752-
chartConfigObject.dataSource =
753-
chartConfigObject.dataFormat === 'json'
754-
? JSON.parse(attrs.datasource)
755-
: attrs.datasource;
756-
dataStringStore.dataSource = attrs.datasource;
757-
}
708+
if (attrs.datasource) {
709+
chartConfigObject.dataSource =
710+
chartConfigObject.dataFormat === 'json'
711+
? JSON.parse(attrs.datasource)
712+
: attrs.datasource;
713+
dataStringStore.dataSource = attrs.datasource;
758714
}
759715

760716
for (observableAttr in observeConf.DCObserver) {
@@ -786,6 +742,46 @@
786742

787743
createFCChart();
788744

745+
if (attrs.type.toLowerCase() === 'timeseries' && scope.datasourceDt) {
746+
scope.$watch(
747+
'datasourceDt.data',
748+
function(newData, oldData) {
749+
if (newData !== oldData) updateData();
750+
},
751+
false
752+
);
753+
createWatchersForAttrs(scope.datasourceDt);
754+
// set the data anyway, initially.
755+
chart.setJSONData(scope.datasourceDt);
756+
} else if (scope.datasourceDt) {
757+
attrs.datasourceDt = scope.datasourceDt;
758+
chartConfigObject.dataSource = scope.datasourceDt;
759+
dataStringStore.dataSource = scope.datasourceDt;
760+
setChartData();
761+
scope.$watch(
762+
'datasourceDt',
763+
function(newData, oldData) {
764+
if (newData !== oldData) {
765+
chartConfigObject.dataSource = scope.datasourceDt;
766+
dataStringStore.dataSource = scope.datasourceDt;
767+
setChartData();
768+
if (chartConfigObject.dataFormat === 'json') {
769+
setChartData();
770+
} else {
771+
if (chartConfigObject.dataFormat === 'xml') {
772+
chart.setXMLData(newData);
773+
} else if (chartConfigObject.dataFormat === 'jsonurl') {
774+
chart.setJSONUrl(newData);
775+
} else if (chartConfigObject.dataFormat === 'xmlurl') {
776+
chart.setXMLUrl(newData);
777+
}
778+
}
779+
}
780+
},
781+
true
782+
);
783+
}
784+
789785
scope.$on('$destroy', function() {
790786
// on destroy free used resources to avoid memory leaks
791787
if (chart && chart.dispose) {

‎dist/angular-fusioncharts.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎example/index.html

+9-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,15 @@
3232
></div>
3333
<div
3434
fusioncharts
35-
datasource="columnDS"
35+
datasource-dt="columnDS"
36+
width="600"
37+
height="400"
38+
type="column2d"
39+
></div>
40+
<div
41+
fusioncharts
42+
datasource="{{ columnDS }}"
43+
dataFormat="json"
3644
width="600"
3745
height="400"
3846
type="column2d"

‎example/index.js

+17-8
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,32 @@
11
var jsonify = res => res.json();
22
var dataFetch = fetch(
3-
'https://raw.githubusercontent.com/fusioncharts/dev_centre_docs/fusiontime-beta-release/charts-resources/fusiontime/online-sales-single-series/data.json'
3+
'https://s3.eu-central-1.amazonaws.com/fusion.store/ft/data/line-chart-with-time-axis-data.json'
44
).then(jsonify);
55
var schemaFetch = fetch(
6-
'https://raw.githubusercontent.com/fusioncharts/dev_centre_docs/fusiontime-beta-release/charts-resources/fusiontime/online-sales-single-series/schema.json'
6+
'https://s3.eu-central-1.amazonaws.com/fusion.store/ft/schema/line-chart-with-time-axis-schema.json'
77
).then(jsonify);
88

99
var app = angular.module('myApp', ['ng-fusioncharts']);
1010

1111
app.controller('MyController', function($scope) {
1212
$scope.timeSeriesDS = {
13-
caption: { text: 'Online Sales of a SuperStore in the US' },
1413
data: null,
14+
caption: {
15+
text: 'Sales Analysis'
16+
},
17+
subcaption: {
18+
text: 'Grocery'
19+
},
1520
yAxis: [
1621
{
17-
plot: [
18-
{
19-
value: 'Sales ($)'
20-
}
21-
]
22+
plot: {
23+
value: 'Grocery Sales Value',
24+
type: 'line'
25+
},
26+
format: {
27+
prefix: '$'
28+
},
29+
title: 'Sale Value'
2230
}
2331
]
2432
};
@@ -47,6 +55,7 @@ app.controller('MyController', function($scope) {
4755
$scope.update = function() {
4856
$scope.timeSeriesDS.caption.text = 'Something Else';
4957
$scope.columnDS.chart.caption = 'Something Else';
58+
$scope.columnDS.data[1].value = '340';
5059
};
5160

5261
Promise.all([dataFetch, schemaFetch]).then(res => {

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "angularjs-fusioncharts",
3-
"version": "5.0.0",
3+
"version": "5.0.2",
44
"description": "Angular plugin for FusionCharts",
55
"main": "dist/angular-fusioncharts.js",
66
"repository": {

0 commit comments

Comments
 (0)