diff --git a/bower.json b/bower.json index 70fb93e2..a357cb68 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "angular-chart.js", - "version": "0.7.6", + "version": "0.8.0", "main": [ "./dist/angular-chart.js", "./dist/angular-chart.css" diff --git a/dist/angular-chart.js b/dist/angular-chart.js index 97589742..c032a24b 100644 --- a/dist/angular-chart.js +++ b/dist/angular-chart.js @@ -86,16 +86,25 @@ return { restrict: 'CA', scope: { - data: '=', - labels: '=', - options: '=', - series: '=', + data: '=?', + labels: '=?', + options: '=?', + series: '=?', colours: '=?', getColour: '=?', chartType: '=', legend: '@', - click: '=', - hover: '=' + click: '=?', + hover: '=?', + + chartData: '=?', + chartLabels: '=?', + chartOptions: '=?', + chartSeries: '=?', + chartColours: '=?', + chartLegend: '@', + chartClick: '=?', + chartHover: '=?' }, link: function (scope, elem/*, attrs */) { var chart, container = document.createElement('div'); @@ -105,6 +114,24 @@ if (usingExcanvas) window.G_vmlCanvasManager.initElement(elem[0]); + ['data', 'labels', 'options', 'series', 'colours', 'legend', 'click', 'hover'].forEach(deprecated); + function aliasVar (fromName, toName) { + scope.$watch(fromName, function (newVal) { + if (typeof newVal === 'undefined') return; + scope[toName] = newVal; + }); + } + /* provide backward compatibility to "old" directive names, by + * having an alias point from the new names to the old names. */ + aliasVar('chartData', 'data'); + aliasVar('chartLabels', 'labels'); + aliasVar('chartOptions', 'options'); + aliasVar('chartSeries', 'series'); + aliasVar('chartColours', 'colours'); + aliasVar('chartLegend', 'legend'); + aliasVar('chartClick', 'click'); + aliasVar('chartHover', 'hover'); + // Order of setting "watch" matter scope.$watch('data', function (newVal, oldVal) { @@ -172,6 +199,16 @@ }); if (scope.legend && scope.legend !== 'false') setLegend(elem, chart); } + + function deprecated (attr) { + if (typeof console !== 'undefined' && ChartJs.getOptions().env !== 'test') { + var warn = typeof console.warn === 'function' ? console.warn : console.log; + if (!! scope[attr]) { + warn.call(console, '"%s" is deprecated and will be removed in a future version. ' + + 'Please use "chart-%s" instead.', attr, attr); + } + } + } } }; }; diff --git a/dist/angular-chart.js.tar.gz b/dist/angular-chart.js.tar.gz index 2ce78234..ca0258f6 100755 Binary files a/dist/angular-chart.js.tar.gz and b/dist/angular-chart.js.tar.gz differ diff --git a/dist/angular-chart.min.js b/dist/angular-chart.min.js index d3013835..6b149846 100644 --- a/dist/angular-chart.min.js +++ b/dist/angular-chart.min.js @@ -1,2 +1,2 @@ -!function(t){"use strict";"function"==typeof define&&define.amd?define(["angular","chart.js"],t):"object"==typeof exports?module.exports=t(require("angular"),require("chart.js")):t(angular,Chart)}(function(t,e){"use strict";function n(){var n={},r={Chart:e,getOptions:function(e){var r=e&&n[e]||{};return t.extend({},n,r)}};this.setOptions=function(e,r){return r?(n[e]=t.extend(n[e]||{},r),void 0):(r=e,n=t.extend(n,r),void 0)},this.$get=function(){return r}}function r(n,r){function o(t,e){return t&&e&&t.length&&e.length?Array.isArray(t[0])?t.length===e.length&&t.every(function(t,n){return t.length===e[n].length}):e.reduce(i,0)>0?t.length===e.length:!1:!1}function i(t,e){return t+e}function c(t,e,n){return function(r){var a=e.getPointsAtEvent||e.getBarsAtEvent||e.getSegmentsAtEvent;if(a){var o=a.call(e,r);t[n](o,r),t.$apply()}}}function l(r,a){for(var o=t.copy(a.colours||n.getOptions(r).colours||e.defaults.global.colours);o.length>16&255,r=e>>8&255,a=255&e;return[n,r,a]}function p(e,n,r,a){return{labels:e,datasets:n.map(function(e,n){return t.extend({},a[n],{label:r[n],data:e})})}}function v(e,n,r){return e.map(function(e,a){return t.extend({},r[a],{label:e,value:n[a],color:r[a].strokeColor,highlight:r[a].pointHighlightStroke})})}function y(t,e){var n=t.parent(),r=n.find("chart-legend"),a=""+e.generateLegend()+"";r.length?r.replaceWith(a):n.append(a)}function C(t,e,n,r){Array.isArray(n.data[0])?t.datasets.forEach(function(t,n){(t.points||t.bars).forEach(function(t,r){t.value=e[n][r]})}):t.segments.forEach(function(t,n){t.value=e[n]}),t.update(),n.$emit("update",t),n.legend&&"false"!==n.legend&&y(r,t)}function m(t){return!t||Array.isArray(t)&&!t.length||"object"==typeof t&&!Object.keys(t).length}function b(r,a){var o=t.extend({},e.defaults.global,n.getOptions(r),a.options);return o.responsive}return function(e){return{restrict:"CA",scope:{data:"=",labels:"=",options:"=",series:"=",colours:"=?",getColour:"=?",chartType:"=",legend:"@",click:"=",hover:"="},link:function(i,u){function f(n,r){if(!m(n)&&!t.equals(n,r)){var a=e||i.chartType;a&&(d&&d.destroy(),h(a))}}function h(e){if(b(e,i)&&0===u[0].clientHeight&&0===g.clientHeight)return r(function(){h(e)},50);if(i.data&&i.data.length){i.getColour="function"==typeof i.getColour?i.getColour:s,i.colours=l(e,i);var a=u[0],o=a.getContext("2d"),f=Array.isArray(i.data[0])?p(i.labels,i.data,i.series||[],i.colours):v(i.labels,i.data,i.colours),C=t.extend({},n.getOptions(e),i.options);d=new n.Chart(o)[e](f,C),i.$emit("create",d),["hover","click"].forEach(function(t){i[t]&&(a["click"===t?"onclick":"onmousemove"]=c(i,d,t))}),i.legend&&"false"!==i.legend&&y(u,d)}}var d,g=document.createElement("div");g.className="chart-container",u.replaceWith(g),g.appendChild(u[0]),a&&window.G_vmlCanvasManager.initElement(u[0]),i.$watch("data",function(t,n){if(t&&t.length&&(!Array.isArray(t[0])||t[0].length)){var r=e||i.chartType;if(r){if(d){if(o(t,n))return C(d,t,i,u);d.destroy()}h(r)}}},!0),i.$watch("series",f,!0),i.$watch("labels",f,!0),i.$watch("options",f,!0),i.$watch("colours",f,!0),i.$watch("chartType",function(e,n){m(e)||t.equals(e,n)||(d&&d.destroy(),h(e))}),i.$on("$destroy",function(){d&&d.destroy()})}}}}e.defaults.global.responsive=!0,e.defaults.global.multiTooltipTemplate="<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>",e.defaults.global.colours=["#97BBCD","#DCDCDC","#F7464A","#46BFBD","#FDB45C","#949FB1","#4D5360"];var a="object"==typeof window.G_vmlCanvasManager&&null!==window.G_vmlCanvasManager&&"function"==typeof window.G_vmlCanvasManager.initElement;a&&(e.defaults.global.animation=!1),t.module("chart.js",[]).provider("ChartJs",n).factory("ChartJsFactory",["ChartJs","$timeout",r]).directive("chartBase",["ChartJsFactory",function(t){return new t}]).directive("chartLine",["ChartJsFactory",function(t){return new t("Line")}]).directive("chartBar",["ChartJsFactory",function(t){return new t("Bar")}]).directive("chartRadar",["ChartJsFactory",function(t){return new t("Radar")}]).directive("chartDoughnut",["ChartJsFactory",function(t){return new t("Doughnut")}]).directive("chartPie",["ChartJsFactory",function(t){return new t("Pie")}]).directive("chartPolarArea",["ChartJsFactory",function(t){return new t("PolarArea")}])}); +!function(t){"use strict";"function"==typeof define&&define.amd?define(["angular","chart.js"],t):"object"==typeof exports?module.exports=t(require("angular"),require("chart.js")):t(angular,Chart)}(function(t,e){"use strict";function n(){var n={},r={Chart:e,getOptions:function(e){var r=e&&n[e]||{};return t.extend({},n,r)}};this.setOptions=function(e,r){return r?(n[e]=t.extend(n[e]||{},r),void 0):(r=e,n=t.extend(n,r),void 0)},this.$get=function(){return r}}function r(n,r){function o(t,e){return t&&e&&t.length&&e.length?Array.isArray(t[0])?t.length===e.length&&t.every(function(t,n){return t.length===e[n].length}):e.reduce(i,0)>0?t.length===e.length:!1:!1}function i(t,e){return t+e}function c(t,e,n){return function(r){var a=e.getPointsAtEvent||e.getBarsAtEvent||e.getSegmentsAtEvent;if(a){var o=a.call(e,r);t[n](o,r),t.$apply()}}}function l(r,a){for(var o=t.copy(a.colours||n.getOptions(r).colours||e.defaults.global.colours);o.length>16&255,r=e>>8&255,a=255&e;return[n,r,a]}function p(e,n,r,a){return{labels:e,datasets:n.map(function(e,n){return t.extend({},a[n],{label:r[n],data:e})})}}function v(e,n,r){return e.map(function(e,a){return t.extend({},r[a],{label:e,value:n[a],color:r[a].strokeColor,highlight:r[a].pointHighlightStroke})})}function y(t,e){var n=t.parent(),r=n.find("chart-legend"),a=""+e.generateLegend()+"";r.length?r.replaceWith(a):n.append(a)}function C(t,e,n,r){Array.isArray(n.data[0])?t.datasets.forEach(function(t,n){(t.points||t.bars).forEach(function(t,r){t.value=e[n][r]})}):t.segments.forEach(function(t,n){t.value=e[n]}),t.update(),n.$emit("update",t),n.legend&&"false"!==n.legend&&y(r,t)}function b(t){return!t||Array.isArray(t)&&!t.length||"object"==typeof t&&!Object.keys(t).length}function m(r,a){var o=t.extend({},e.defaults.global,n.getOptions(r),a.options);return o.responsive}return function(e){return{restrict:"CA",scope:{data:"=?",labels:"=?",options:"=?",series:"=?",colours:"=?",getColour:"=?",chartType:"=",legend:"@",click:"=?",hover:"=?",chartData:"=?",chartLabels:"=?",chartOptions:"=?",chartSeries:"=?",chartColours:"=?",chartLegend:"@",chartClick:"=?",chartHover:"=?"},link:function(i,u){function f(t,e){i.$watch(t,function(t){"undefined"!=typeof t&&(i[e]=t)})}function h(n,r){if(!b(n)&&!t.equals(n,r)){var a=e||i.chartType;a&&(w&&w.destroy(),d(a))}}function d(e){if(m(e,i)&&0===u[0].clientHeight&&0===A.clientHeight)return r(function(){d(e)},50);if(i.data&&i.data.length){i.getColour="function"==typeof i.getColour?i.getColour:s,i.colours=l(e,i);var a=u[0],o=a.getContext("2d"),f=Array.isArray(i.data[0])?p(i.labels,i.data,i.series||[],i.colours):v(i.labels,i.data,i.colours),h=t.extend({},n.getOptions(e),i.options);w=new n.Chart(o)[e](f,h),i.$emit("create",w),["hover","click"].forEach(function(t){i[t]&&(a["click"===t?"onclick":"onmousemove"]=c(i,w,t))}),i.legend&&"false"!==i.legend&&y(u,w)}}function g(t){if("undefined"!=typeof console&&"test"!==n.getOptions().env){var e="function"==typeof console.warn?console.warn:console.log;i[t]&&e.call(console,'"%s" is deprecated and will be removed in a future version. Please use "chart-%s" instead.',t,t)}}var w,A=document.createElement("div");A.className="chart-container",u.replaceWith(A),A.appendChild(u[0]),a&&window.G_vmlCanvasManager.initElement(u[0]),["data","labels","options","series","colours","legend","click","hover"].forEach(g),f("chartData","data"),f("chartLabels","labels"),f("chartOptions","options"),f("chartSeries","series"),f("chartColours","colours"),f("chartLegend","legend"),f("chartClick","click"),f("chartHover","hover"),i.$watch("data",function(t,n){if(t&&t.length&&(!Array.isArray(t[0])||t[0].length)){var r=e||i.chartType;if(r){if(w){if(o(t,n))return C(w,t,i,u);w.destroy()}d(r)}}},!0),i.$watch("series",h,!0),i.$watch("labels",h,!0),i.$watch("options",h,!0),i.$watch("colours",h,!0),i.$watch("chartType",function(e,n){b(e)||t.equals(e,n)||(w&&w.destroy(),d(e))}),i.$on("$destroy",function(){w&&w.destroy()})}}}}e.defaults.global.responsive=!0,e.defaults.global.multiTooltipTemplate="<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>",e.defaults.global.colours=["#97BBCD","#DCDCDC","#F7464A","#46BFBD","#FDB45C","#949FB1","#4D5360"];var a="object"==typeof window.G_vmlCanvasManager&&null!==window.G_vmlCanvasManager&&"function"==typeof window.G_vmlCanvasManager.initElement;a&&(e.defaults.global.animation=!1),t.module("chart.js",[]).provider("ChartJs",n).factory("ChartJsFactory",["ChartJs","$timeout",r]).directive("chartBase",["ChartJsFactory",function(t){return new t}]).directive("chartLine",["ChartJsFactory",function(t){return new t("Line")}]).directive("chartBar",["ChartJsFactory",function(t){return new t("Bar")}]).directive("chartRadar",["ChartJsFactory",function(t){return new t("Radar")}]).directive("chartDoughnut",["ChartJsFactory",function(t){return new t("Doughnut")}]).directive("chartPie",["ChartJsFactory",function(t){return new t("Pie")}]).directive("chartPolarArea",["ChartJsFactory",function(t){return new t("PolarArea")}])}); //# sourceMappingURL=angular-chart.min.js.map \ No newline at end of file diff --git a/dist/angular-chart.min.js.map b/dist/angular-chart.min.js.map index 545a76f7..949673b3 100644 --- a/dist/angular-chart.min.js.map +++ b/dist/angular-chart.min.js.map @@ -1 +1 @@ -{"version":3,"sources":["angular-chart.min.js"],"names":["factory","define","amd","exports","module","require","angular","Chart","ChartJsProvider","options","ChartJs","getOptions","type","typeOptions","extend","this","setOptions","customOptions","$get","ChartJsFactory","$timeout","canUpdateChart","newVal","oldVal","length","Array","isArray","every","element","index","reduce","sum","carry","val","getEventHandler","scope","chart","action","evt","atEvent","getPointsAtEvent","getBarsAtEvent","getSegmentsAtEvent","activePoints","call","$apply","getColours","colours","copy","defaults","global","data","push","getColour","map","convertColour","colour","hexToRgb","substr","getRandomColour","getRandomInt","fillColor","rgba","strokeColor","pointColor","pointStrokeColor","pointHighlightFill","pointHighlightStroke","min","max","Math","floor","random","alpha","usingExcanvas","join","concat","hex","bigint","parseInt","r","g","b","getDataSets","labels","series","datasets","item","i","label","getData","value","color","highlight","setLegend","elem","$parent","parent","$oldLegend","find","legend","generateLegend","replaceWith","append","updateChart","values","forEach","dataset","points","bars","dataItem","j","segments","segment","update","$emit","isEmpty","Object","keys","isResponsive","responsive","restrict","chartType","click","hover","link","resetChart","equals","destroy","createChart","clientHeight","container","cvs","ctx","getContext","document","createElement","className","appendChild","window","G_vmlCanvasManager","initElement","$watch","$on","multiTooltipTemplate","animation","provider","directive"],"mappings":"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","file":"angular-chart.min.js","sourcesContent":["(function (factory) {\n 'use strict';\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define(['angular', 'chart.js'], factory);\n } else if (typeof exports === 'object') {\n // Node/CommonJS\n module.exports = factory(require('angular'), require('chart.js'));\n } else {\n // Browser globals\n factory(angular, Chart);\n }\n}(function (angular, Chart) {\n 'use strict';\n\n Chart.defaults.global.responsive = true;\n Chart.defaults.global.multiTooltipTemplate = '<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>';\n\n Chart.defaults.global.colours = [\n '#97BBCD', // blue\n '#DCDCDC', // light grey\n '#F7464A', // red\n '#46BFBD', // green\n '#FDB45C', // yellow\n '#949FB1', // grey\n '#4D5360' // dark grey\n ];\n\n var usingExcanvas = typeof window.G_vmlCanvasManager === 'object' &&\n window.G_vmlCanvasManager !== null &&\n typeof window.G_vmlCanvasManager.initElement === 'function';\n\n if (usingExcanvas) Chart.defaults.global.animation = false;\n\n angular.module('chart.js', [])\n .provider('ChartJs', ChartJsProvider)\n .factory('ChartJsFactory', ['ChartJs', '$timeout', ChartJsFactory])\n .directive('chartBase', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory(); }])\n .directive('chartLine', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Line'); }])\n .directive('chartBar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Bar'); }])\n .directive('chartRadar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Radar'); }])\n .directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Doughnut'); }])\n .directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }])\n .directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('PolarArea'); }]);\n\n /**\n * Wrapper for chart.js\n * Allows configuring chart js using the provider\n *\n * angular.module('myModule', ['chart.js']).config(function(ChartJsProvider) {\n * ChartJsProvider.setOptions({ responsive: true });\n * ChartJsProvider.setOptions('Line', { responsive: false });\n * })))\n */\n function ChartJsProvider () {\n var options = {};\n var ChartJs = {\n Chart: Chart,\n getOptions: function (type) {\n var typeOptions = type && options[type] || {};\n return angular.extend({}, options, typeOptions);\n }\n };\n\n /**\n * Allow to set global options during configuration\n */\n this.setOptions = function (type, customOptions) {\n // If no type was specified set option for the global object\n if (! customOptions) {\n customOptions = type;\n options = angular.extend(options, customOptions);\n return;\n }\n // Set options for the specific chart\n options[type] = angular.extend(options[type] || {}, customOptions);\n };\n\n this.$get = function () {\n return ChartJs;\n };\n }\n\n function ChartJsFactory (ChartJs, $timeout) {\n return function chart (type) {\n return {\n restrict: 'CA',\n scope: {\n data: '=',\n labels: '=',\n options: '=',\n series: '=',\n colours: '=?',\n getColour: '=?',\n chartType: '=',\n legend: '@',\n click: '=',\n hover: '='\n },\n link: function (scope, elem/*, attrs */) {\n var chart, container = document.createElement('div');\n container.className = 'chart-container';\n elem.replaceWith(container);\n container.appendChild(elem[0]);\n\n if (usingExcanvas) window.G_vmlCanvasManager.initElement(elem[0]);\n\n // Order of setting \"watch\" matter\n\n scope.$watch('data', function (newVal, oldVal) {\n if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n if (chart) {\n if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope, elem);\n chart.destroy();\n }\n\n createChart(chartType);\n }, true);\n\n scope.$watch('series', resetChart, true);\n scope.$watch('labels', resetChart, true);\n scope.$watch('options', resetChart, true);\n scope.$watch('colours', resetChart, true);\n\n scope.$watch('chartType', function (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n if (chart) chart.destroy();\n createChart(newVal);\n });\n\n scope.$on('$destroy', function () {\n if (chart) chart.destroy();\n });\n\n function resetChart (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n // chart.update() doesn't work for series and labels\n // so we have to re-create the chart entirely\n if (chart) chart.destroy();\n\n createChart(chartType);\n }\n\n function createChart (type) {\n if (isResponsive(type, scope) && elem[0].clientHeight === 0 && container.clientHeight === 0) {\n return $timeout(function () {\n createChart(type);\n }, 50);\n }\n if (! scope.data || ! scope.data.length) return;\n scope.getColour = typeof scope.getColour === 'function' ? scope.getColour : getRandomColour;\n scope.colours = getColours(type, scope);\n var cvs = elem[0], ctx = cvs.getContext('2d');\n var data = Array.isArray(scope.data[0]) ?\n getDataSets(scope.labels, scope.data, scope.series || [], scope.colours) :\n getData(scope.labels, scope.data, scope.colours);\n var options = angular.extend({}, ChartJs.getOptions(type), scope.options);\n chart = new ChartJs.Chart(ctx)[type](data, options);\n scope.$emit('create', chart);\n\n ['hover', 'click'].forEach(function (action) {\n if (scope[action])\n cvs[action === 'click' ? 'onclick' : 'onmousemove'] = getEventHandler(scope, chart, action);\n });\n if (scope.legend && scope.legend !== 'false') setLegend(elem, chart);\n }\n }\n };\n };\n\n function canUpdateChart (newVal, oldVal) {\n if (newVal && oldVal && newVal.length && oldVal.length) {\n return Array.isArray(newVal[0]) ?\n newVal.length === oldVal.length && newVal.every(function (element, index) {\n return element.length === oldVal[index].length; }) :\n oldVal.reduce(sum, 0) > 0 ? newVal.length === oldVal.length : false;\n }\n return false;\n }\n\n function sum (carry, val) {\n return carry + val;\n }\n\n function getEventHandler (scope, chart, action) {\n return function (evt) {\n var atEvent = chart.getPointsAtEvent || chart.getBarsAtEvent || chart.getSegmentsAtEvent;\n if (atEvent) {\n var activePoints = atEvent.call(chart, evt);\n scope[action](activePoints, evt);\n scope.$apply();\n }\n };\n }\n\n function getColours (type, scope) {\n var colours = angular.copy(scope.colours ||\n ChartJs.getOptions(type).colours ||\n Chart.defaults.global.colours\n );\n while (colours.length < scope.data.length) {\n colours.push(scope.getColour());\n }\n return colours.map(convertColour);\n }\n\n function convertColour (colour) {\n if (typeof colour === 'object' && colour !== null) return colour;\n if (typeof colour === 'string' && colour[0] === '#') return getColour(hexToRgb(colour.substr(1)));\n return getRandomColour();\n }\n\n function getRandomColour () {\n var colour = [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)];\n return getColour(colour);\n }\n\n function getColour (colour) {\n return {\n fillColor: rgba(colour, 0.2),\n strokeColor: rgba(colour, 1),\n pointColor: rgba(colour, 1),\n pointStrokeColor: '#fff',\n pointHighlightFill: '#fff',\n pointHighlightStroke: rgba(colour, 0.8)\n };\n }\n\n function getRandomInt (min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function rgba (colour, alpha) {\n if (usingExcanvas) {\n // rgba not supported by IE8\n return 'rgb(' + colour.join(',') + ')';\n } else {\n return 'rgba(' + colour.concat(alpha).join(',') + ')';\n }\n }\n\n // Credit: http://stackoverflow.com/a/11508164/1190235\n function hexToRgb (hex) {\n var bigint = parseInt(hex, 16),\n r = (bigint >> 16) & 255,\n g = (bigint >> 8) & 255,\n b = bigint & 255;\n\n return [r, g, b];\n }\n\n function getDataSets (labels, data, series, colours) {\n return {\n labels: labels,\n datasets: data.map(function (item, i) {\n return angular.extend({}, colours[i], {\n label: series[i],\n data: item\n });\n })\n };\n }\n\n function getData (labels, data, colours) {\n return labels.map(function (label, i) {\n return angular.extend({}, colours[i], {\n label: label,\n value: data[i],\n color: colours[i].strokeColor,\n highlight: colours[i].pointHighlightStroke\n });\n });\n }\n\n function setLegend (elem, chart) {\n var $parent = elem.parent(),\n $oldLegend = $parent.find('chart-legend'),\n legend = '' + chart.generateLegend() + '';\n if ($oldLegend.length) $oldLegend.replaceWith(legend);\n else $parent.append(legend);\n }\n\n function updateChart (chart, values, scope, elem) {\n if (Array.isArray(scope.data[0])) {\n chart.datasets.forEach(function (dataset, i) {\n (dataset.points || dataset.bars).forEach(function (dataItem, j) {\n dataItem.value = values[i][j];\n });\n });\n } else {\n chart.segments.forEach(function (segment, i) {\n segment.value = values[i];\n });\n }\n chart.update();\n scope.$emit('update', chart);\n if (scope.legend && scope.legend !== 'false') setLegend(elem, chart);\n }\n\n function isEmpty (value) {\n return ! value ||\n (Array.isArray(value) && ! value.length) ||\n (typeof value === 'object' && ! Object.keys(value).length);\n }\n\n function isResponsive (type, scope) {\n var options = angular.extend({}, Chart.defaults.global, ChartJs.getOptions(type), scope.options);\n return options.responsive;\n }\n }\n}));\n"],"sourceRoot":"/source/"} \ No newline at end of file +{"version":3,"sources":["angular-chart.min.js"],"names":["factory","define","amd","exports","module","require","angular","Chart","ChartJsProvider","options","ChartJs","getOptions","type","typeOptions","extend","this","setOptions","customOptions","$get","ChartJsFactory","$timeout","canUpdateChart","newVal","oldVal","length","Array","isArray","every","element","index","reduce","sum","carry","val","getEventHandler","scope","chart","action","evt","atEvent","getPointsAtEvent","getBarsAtEvent","getSegmentsAtEvent","activePoints","call","$apply","getColours","colours","copy","defaults","global","data","push","getColour","map","convertColour","colour","hexToRgb","substr","getRandomColour","getRandomInt","fillColor","rgba","strokeColor","pointColor","pointStrokeColor","pointHighlightFill","pointHighlightStroke","min","max","Math","floor","random","alpha","usingExcanvas","join","concat","hex","bigint","parseInt","r","g","b","getDataSets","labels","series","datasets","item","i","label","getData","value","color","highlight","setLegend","elem","$parent","parent","$oldLegend","find","legend","generateLegend","replaceWith","append","updateChart","values","forEach","dataset","points","bars","dataItem","j","segments","segment","update","$emit","isEmpty","Object","keys","isResponsive","responsive","restrict","chartType","click","hover","chartData","chartLabels","chartOptions","chartSeries","chartColours","chartLegend","chartClick","chartHover","link","aliasVar","fromName","toName","$watch","resetChart","equals","destroy","createChart","clientHeight","container","cvs","ctx","getContext","deprecated","attr","console","env","warn","log","document","createElement","className","appendChild","window","G_vmlCanvasManager","initElement","$on","multiTooltipTemplate","animation","provider","directive"],"mappings":"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","file":"angular-chart.min.js","sourcesContent":["(function (factory) {\n 'use strict';\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define(['angular', 'chart.js'], factory);\n } else if (typeof exports === 'object') {\n // Node/CommonJS\n module.exports = factory(require('angular'), require('chart.js'));\n } else {\n // Browser globals\n factory(angular, Chart);\n }\n}(function (angular, Chart) {\n 'use strict';\n\n Chart.defaults.global.responsive = true;\n Chart.defaults.global.multiTooltipTemplate = '<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>';\n\n Chart.defaults.global.colours = [\n '#97BBCD', // blue\n '#DCDCDC', // light grey\n '#F7464A', // red\n '#46BFBD', // green\n '#FDB45C', // yellow\n '#949FB1', // grey\n '#4D5360' // dark grey\n ];\n\n var usingExcanvas = typeof window.G_vmlCanvasManager === 'object' &&\n window.G_vmlCanvasManager !== null &&\n typeof window.G_vmlCanvasManager.initElement === 'function';\n\n if (usingExcanvas) Chart.defaults.global.animation = false;\n\n angular.module('chart.js', [])\n .provider('ChartJs', ChartJsProvider)\n .factory('ChartJsFactory', ['ChartJs', '$timeout', ChartJsFactory])\n .directive('chartBase', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory(); }])\n .directive('chartLine', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Line'); }])\n .directive('chartBar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Bar'); }])\n .directive('chartRadar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Radar'); }])\n .directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Doughnut'); }])\n .directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }])\n .directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('PolarArea'); }]);\n\n /**\n * Wrapper for chart.js\n * Allows configuring chart js using the provider\n *\n * angular.module('myModule', ['chart.js']).config(function(ChartJsProvider) {\n * ChartJsProvider.setOptions({ responsive: true });\n * ChartJsProvider.setOptions('Line', { responsive: false });\n * })))\n */\n function ChartJsProvider () {\n var options = {};\n var ChartJs = {\n Chart: Chart,\n getOptions: function (type) {\n var typeOptions = type && options[type] || {};\n return angular.extend({}, options, typeOptions);\n }\n };\n\n /**\n * Allow to set global options during configuration\n */\n this.setOptions = function (type, customOptions) {\n // If no type was specified set option for the global object\n if (! customOptions) {\n customOptions = type;\n options = angular.extend(options, customOptions);\n return;\n }\n // Set options for the specific chart\n options[type] = angular.extend(options[type] || {}, customOptions);\n };\n\n this.$get = function () {\n return ChartJs;\n };\n }\n\n function ChartJsFactory (ChartJs, $timeout) {\n return function chart (type) {\n return {\n restrict: 'CA',\n scope: {\n data: '=?',\n labels: '=?',\n options: '=?',\n series: '=?',\n colours: '=?',\n getColour: '=?',\n chartType: '=',\n legend: '@',\n click: '=?',\n hover: '=?',\n\n chartData: '=?',\n chartLabels: '=?',\n chartOptions: '=?',\n chartSeries: '=?',\n chartColours: '=?',\n chartLegend: '@',\n chartClick: '=?',\n chartHover: '=?'\n },\n link: function (scope, elem/*, attrs */) {\n var chart, container = document.createElement('div');\n container.className = 'chart-container';\n elem.replaceWith(container);\n container.appendChild(elem[0]);\n\n if (usingExcanvas) window.G_vmlCanvasManager.initElement(elem[0]);\n\n ['data', 'labels', 'options', 'series', 'colours', 'legend', 'click', 'hover'].forEach(deprecated);\n function aliasVar (fromName, toName) {\n scope.$watch(fromName, function (newVal) {\n if (typeof newVal === 'undefined') return;\n scope[toName] = newVal;\n });\n }\n /* provide backward compatibility to \"old\" directive names, by\n * having an alias point from the new names to the old names. */\n aliasVar('chartData', 'data');\n aliasVar('chartLabels', 'labels');\n aliasVar('chartOptions', 'options');\n aliasVar('chartSeries', 'series');\n aliasVar('chartColours', 'colours');\n aliasVar('chartLegend', 'legend');\n aliasVar('chartClick', 'click');\n aliasVar('chartHover', 'hover');\n\n // Order of setting \"watch\" matter\n\n scope.$watch('data', function (newVal, oldVal) {\n if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n if (chart) {\n if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope, elem);\n chart.destroy();\n }\n\n createChart(chartType);\n }, true);\n\n scope.$watch('series', resetChart, true);\n scope.$watch('labels', resetChart, true);\n scope.$watch('options', resetChart, true);\n scope.$watch('colours', resetChart, true);\n\n scope.$watch('chartType', function (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n if (chart) chart.destroy();\n createChart(newVal);\n });\n\n scope.$on('$destroy', function () {\n if (chart) chart.destroy();\n });\n\n function resetChart (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n // chart.update() doesn't work for series and labels\n // so we have to re-create the chart entirely\n if (chart) chart.destroy();\n\n createChart(chartType);\n }\n\n function createChart (type) {\n if (isResponsive(type, scope) && elem[0].clientHeight === 0 && container.clientHeight === 0) {\n return $timeout(function () {\n createChart(type);\n }, 50);\n }\n if (! scope.data || ! scope.data.length) return;\n scope.getColour = typeof scope.getColour === 'function' ? scope.getColour : getRandomColour;\n scope.colours = getColours(type, scope);\n var cvs = elem[0], ctx = cvs.getContext('2d');\n var data = Array.isArray(scope.data[0]) ?\n getDataSets(scope.labels, scope.data, scope.series || [], scope.colours) :\n getData(scope.labels, scope.data, scope.colours);\n var options = angular.extend({}, ChartJs.getOptions(type), scope.options);\n chart = new ChartJs.Chart(ctx)[type](data, options);\n scope.$emit('create', chart);\n\n ['hover', 'click'].forEach(function (action) {\n if (scope[action])\n cvs[action === 'click' ? 'onclick' : 'onmousemove'] = getEventHandler(scope, chart, action);\n });\n if (scope.legend && scope.legend !== 'false') setLegend(elem, chart);\n }\n\n function deprecated (attr) {\n if (typeof console !== 'undefined' && ChartJs.getOptions().env !== 'test') {\n var warn = typeof console.warn === 'function' ? console.warn : console.log;\n if (!! scope[attr]) {\n warn.call(console, '\"%s\" is deprecated and will be removed in a future version. ' +\n 'Please use \"chart-%s\" instead.', attr, attr);\n }\n }\n }\n }\n };\n };\n\n function canUpdateChart (newVal, oldVal) {\n if (newVal && oldVal && newVal.length && oldVal.length) {\n return Array.isArray(newVal[0]) ?\n newVal.length === oldVal.length && newVal.every(function (element, index) {\n return element.length === oldVal[index].length; }) :\n oldVal.reduce(sum, 0) > 0 ? newVal.length === oldVal.length : false;\n }\n return false;\n }\n\n function sum (carry, val) {\n return carry + val;\n }\n\n function getEventHandler (scope, chart, action) {\n return function (evt) {\n var atEvent = chart.getPointsAtEvent || chart.getBarsAtEvent || chart.getSegmentsAtEvent;\n if (atEvent) {\n var activePoints = atEvent.call(chart, evt);\n scope[action](activePoints, evt);\n scope.$apply();\n }\n };\n }\n\n function getColours (type, scope) {\n var colours = angular.copy(scope.colours ||\n ChartJs.getOptions(type).colours ||\n Chart.defaults.global.colours\n );\n while (colours.length < scope.data.length) {\n colours.push(scope.getColour());\n }\n return colours.map(convertColour);\n }\n\n function convertColour (colour) {\n if (typeof colour === 'object' && colour !== null) return colour;\n if (typeof colour === 'string' && colour[0] === '#') return getColour(hexToRgb(colour.substr(1)));\n return getRandomColour();\n }\n\n function getRandomColour () {\n var colour = [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)];\n return getColour(colour);\n }\n\n function getColour (colour) {\n return {\n fillColor: rgba(colour, 0.2),\n strokeColor: rgba(colour, 1),\n pointColor: rgba(colour, 1),\n pointStrokeColor: '#fff',\n pointHighlightFill: '#fff',\n pointHighlightStroke: rgba(colour, 0.8)\n };\n }\n\n function getRandomInt (min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function rgba (colour, alpha) {\n if (usingExcanvas) {\n // rgba not supported by IE8\n return 'rgb(' + colour.join(',') + ')';\n } else {\n return 'rgba(' + colour.concat(alpha).join(',') + ')';\n }\n }\n\n // Credit: http://stackoverflow.com/a/11508164/1190235\n function hexToRgb (hex) {\n var bigint = parseInt(hex, 16),\n r = (bigint >> 16) & 255,\n g = (bigint >> 8) & 255,\n b = bigint & 255;\n\n return [r, g, b];\n }\n\n function getDataSets (labels, data, series, colours) {\n return {\n labels: labels,\n datasets: data.map(function (item, i) {\n return angular.extend({}, colours[i], {\n label: series[i],\n data: item\n });\n })\n };\n }\n\n function getData (labels, data, colours) {\n return labels.map(function (label, i) {\n return angular.extend({}, colours[i], {\n label: label,\n value: data[i],\n color: colours[i].strokeColor,\n highlight: colours[i].pointHighlightStroke\n });\n });\n }\n\n function setLegend (elem, chart) {\n var $parent = elem.parent(),\n $oldLegend = $parent.find('chart-legend'),\n legend = '' + chart.generateLegend() + '';\n if ($oldLegend.length) $oldLegend.replaceWith(legend);\n else $parent.append(legend);\n }\n\n function updateChart (chart, values, scope, elem) {\n if (Array.isArray(scope.data[0])) {\n chart.datasets.forEach(function (dataset, i) {\n (dataset.points || dataset.bars).forEach(function (dataItem, j) {\n dataItem.value = values[i][j];\n });\n });\n } else {\n chart.segments.forEach(function (segment, i) {\n segment.value = values[i];\n });\n }\n chart.update();\n scope.$emit('update', chart);\n if (scope.legend && scope.legend !== 'false') setLegend(elem, chart);\n }\n\n function isEmpty (value) {\n return ! value ||\n (Array.isArray(value) && ! value.length) ||\n (typeof value === 'object' && ! Object.keys(value).length);\n }\n\n function isResponsive (type, scope) {\n var options = angular.extend({}, Chart.defaults.global, ChartJs.getOptions(type), scope.options);\n return options.responsive;\n }\n }\n}));\n"],"sourceRoot":"/source/"} \ No newline at end of file diff --git a/examples/charts.html b/examples/charts.html index 95085a5d..77f35b9b 100644 --- a/examples/charts.html +++ b/examples/charts.html @@ -50,7 +50,8 @@
- +

Angular Chart @@ -61,7 +62,7 @@

Code on Github - Download (0.7.6) + Download (0.8.0)

@@ -120,8 +121,8 @@

Directives

Line Chart
- +
@@ -131,21 +132,21 @@

Directives

.chart-line
    -
  • data: series data
    • -
  • labels: x axis labels
    • -
  • legend (default: false): show legend below the chart
    • -
  • options (default: {}): Chart.js options
    • -
  • series (default: []): series labels
    • -
  • click (optional): onclick event handler
    • -
  • hover (optional): onmousemove event handler
    • -
  • colours (default to global colours): colours for the chart
    • +
  • chart-data: series data
    • +
  • chart-labels: x axis labels
    • +
  • chart-legend (default: false): show legend below the chart
    • +
  • chart-options (default: {}): Chart.js options
    • +
  • chart-series (default: []): series labels
    • +
  • chart-click (optional): onclick event handler
    • +
  • chart-hover (optional): onmousemove event handler
    • +
  • chart-colours (default to global colours): colours for the chart
- 
<canvas id="line" class="chart chart-line" data="data"
-  labels="labels" legend="true" series="series"
-  click="onClick">
+              
<canvas id="line" class="chart chart-line" chart-data="data"
+  chart-labels="labels" chart-legend="true" chart-series="series"
+  chart-click="onClick" >
 </canvas> 

             
             
@@ -173,20 +174,21 @@ 
Directives

               

                 .chart-bar
                 
    
-                  
  • data: series data
    • 
-                  
  • labels: x axis labels
    • 
-                  
  • legend (default: false): show legend below the chart
    • 
-                  
  • options (default: {}): Chart.js options
    • 
+                  
  • chart-data: series data
    • 
+                  
  • chart-labels: x axis labels
    • 
+                  
  • chart-legend (default: false): show legend below the chart
    • 
+                  
  • chart-options (default: {}): Chart.js options
    • 
                   
  • series (default: []): series labels
    • 
-                  
  • click (optional): onclick event handler
    • 
-                  
  • hover (optional): onmousemove event handler
    • 
-                  
  • colours (default to global colours): colours for the chart
    • 
+                  
  • chart-click (optional): onclick event handler
    • 
+                  
  • chart-hover (optional): onmousemove event handler
    • 
+                  
  • chart-colours (default to global colours): colours for the chart
    • 
                 

               

             
             
-              
<canvas id="bar" class="chart chart-bar" data="data"
-  labels="labels"></canvas> 

+              
<canvas id="bar" class="chart chart-bar"
+  chart-data="data" chart-labels="labels">
+</canvas>

             
             
               
angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope) {
@@ -206,8 +208,8 @@ 
Directives

           

             
Bar Chart

             

-              
+
@@ -217,7 +219,8 @@

Directives

Doughnut Chart
- +
@@ -227,19 +230,20 @@

Directives

.chart-doughnut
    -
  • data: series data
    • -
  • labels: series labels
    • -
  • legend (default: false): show legend below the chart
    • -
  • options (default: {}): Chart.js options
    • -
  • click (optional): onclick event handler
    • -
  • hover (optional): onmousemove event handler
    • -
  • colours (default to global colours): colours for the chart
    • +
  • chart-data: series data
    • +
  • chart-labels: series labels
    • +
  • chart-legend (default: false): show legend below the chart
    • +
  • chart-options (default: {}): Chart.js options
    • +
  • chart-click (optional): onclick event handler
    • +
  • chart-hover (optional): onmousemove event handler
    • +
  • chart-colours (default to global colours): colours for the chart
- 
<canvas id="doughnut" class="chart chart-doughnut" data="data"
-  labels="labels"></canvas>
+ 
<canvas id="doughnut" class="chart chart-doughnut"
+  chart-data="data" chart-labels="labels">
+</canvas> 
angular.module("app", ["chart.js"]).controller("DoughnutCtrl", function ($scope) {
@@ -258,20 +262,21 @@ 
Directives

               

                 .chart-radar
                 
    
-                  
  • data: series data
    • 
-                  
  • labels: series labels
    • 
-                  
  • legend (default: false): show legend below the chart
    • 
-                  
  • options (default: {}): Chart.js options
    • 
+                  
  • chart-data: series data
    • 
+                  
  • chart-labels: series labels
    • 
+                  
  • chart-legend (default: false): show legend below the chart
    • 
+                  
  • chart-options (default: {}): Chart.js options
    • 
                   
  • series (default: []): series labels
    • 
-                  
  • click (optional): onclick event handler
    • 
-                  
  • hover (optional): onmousemove event handler
    • 
-                  
  • colours (default to global colours): colours for the chart
    • 
+                  
  • chart-click (optional): onclick event handler
    • 
+                  
  • chart-hover (optional): onmousemove event handler
    • 
+                  
  • chart-colours (default to global colours): colours for the chart
    • 
                 

               

             
             
-              
<canvas id="radar" class="chart chart-radar" data="data"
-  labels="labels"></canvas> 

+              
<canvas id="radar" class="chart chart-radar"
+  chart-data="data" chart-labels="labels">
+</canvas> 

             
             
               
angular.module("app", ["chart.js"]).controller("RadarCtrl", function ($scope) {
@@ -290,7 +295,8 @@ 
Directives

           

             
Radar Chart

             

-              
+              
             

           

         
@@ -300,7 +306,7 @@ 
Directives

           

             
Pie Chart

             

-              
+              
             

           

         
@@ -310,19 +316,20 @@ 
Directives

               

                 .chart-pie
                 
    
-                  
  • data: series data
    • 
-                  
  • labels: series labels
    • 
-                  
  • legend (default: false): show legend below the chart
    • 
-                  
  • options (default: {}): Chart.js options
    • 
-                  
  • click (optional): onclick event handler
    • 
-                  
  • hover (optional): onmousemove event handler
    • 
-                  
  • colours (default to global colours): colours for the chart
    • 
+                  
  • chart-data: series data
    • 
+                  
  • chart-labels: series labels
    • 
+                  
  • chart-legend (default: false): show legend below the chart
    • 
+                  
  • chart-options (default: {}): Chart.js options
    • 
+                  
  • chart-click (optional): onclick event handler
    • 
+                  
  • chart-hover (optional): onmousemove event handler
    • 
+                  
  • chart-colours (default to global colours): colours for the chart
    • 
                 

               

             
             
-              
<canvas id="pie" class="chart chart-pie" data="data"
-  labels="labels"></canvas> 

+              
<canvas id="pie" class="chart chart-pie"
+  chart-data="data" chart-labels="labels">
+</canvas> 

             
             
               
angular.module("app", ["chart.js"]).controller("PieCtrl", function ($scope) {
@@ -341,19 +348,20 @@ 
Directives

               

                 .chart-polar-area
                 
    
-                  
  • data: series data
    • 
-                  
  • labels: series labels
    • 
-                  
  • legend (default: false): show legend below the chart
    • 
-                  
  • options (default: {}): Chart.js options
    • 
-                  
  • click (optional): onclick event handler
    • 
-                  
  • hover (optional): onmousemove event handler
    • 
-                  
  • colours (default to global colours): colours for the chart
    • 
+                  
  • chart-data: series data
    • 
+                  
  • chart-labels: series labels
    • 
+                  
  • chart-legend (default: false): show legend below the chart
    • 
+                  
  • chart-options (default: {}): Chart.js options
    • 
+                  
  • chart-click (optional): onclick event handler
    • 
+                  
  • chart-hover (optional): onmousemove event handler
    • 
+                  
  • chart-colours (default to global colours): colours for the chart
    • 
                 

               

             
             
-              
<canvas id="polar-area" class="chart chart-polar-area" data="data"
-  labels="labels"></canvas> 

+              
<canvas id="polar-area" class="chart chart-polar-area"
+  chart-data="data" chart-labels="labels">
+</canvas> 

             
             
               
angular.module("app", ["chart.js"]).controller("PolarAreaCtrl", function ($scope) {
@@ -368,7 +376,7 @@ 
Directives

           

             
Polar Area Chart

             

-              
+              
             

           

         
@@ -378,7 +386,8 @@ 
Directives

           

             
Dynamic Chart

             

-              
+              
             

           

           
@@ -395,8 +404,9 @@ 
Directives

               
             
             
-              
<canvas id="base" class="chart-base" chart-type="type" data="data"
-  labels="labels" legend="true"></canvas> 

+              
<canvas id="base" class="chart-base" chart-type="type"
+  chart-data="data" chart-labels="labels" chart-legend="true">
+</canvas> 

             
             
               
angular.module("app", ["chart.js"]).controller("BaseCtrl",
@@ -442,7 +452,8 @@ 
Reactive

           

             
Reactive Chart

             

-              
+              
             

           

         
diff --git a/package.json b/package.json
index 1af49290..206d45ba 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-chart.js",
-  "version": "0.7.6",
+  "version": "0.8.0",
   "description": "An angular.js wrapper for Chart.js",
   "main": "dist/angular-chart.js",
   "directories": {