diff --git a/README.md b/README.md index c53646d..4d86f7e 100644 --- a/README.md +++ b/README.md @@ -94,4 +94,8 @@ var chart = new Chartist.Line( ## Example -Install using `npm install` then run/edit the example.html file to see the plugin in action +Install using `npm install` then run/edit the example.html file to see the plugin in action. + +## Build + +Use `npm run build` to build a minimised version. diff --git a/dist/LICENSE b/dist/LICENSE index c67cd3f..ddda59e 100644 --- a/dist/LICENSE +++ b/dist/LICENSE @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) 2004 Sam Hocevar +Copyright (c) 2019 Alex Stanbury Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/dist/chartist-plugin-axistitle.js b/dist/chartist-plugin-axistitle.js index 5949547..8237daa 100644 --- a/dist/chartist-plugin-axistitle.js +++ b/dist/chartist-plugin-axistitle.js @@ -1,25 +1,26 @@ -(function(root, factory) { - if (typeof define === "function" && define.amd) { +(function (root, factory) { + if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. - define(["chartist"], function(Chartist) { + define(["chartist"], function (Chartist) { return (root.returnExportsGlobal = factory(Chartist)); }); - } else if (typeof exports === "object") { + } else if (typeof exports === 'object') { // Node. Does not work with strict CommonJS, but // only CommonJS-like enviroments that support module.exports, // like Node. module.exports = factory(require("chartist")); } else { - root["Chartist.plugins.ctAxisTitle"] = factory(Chartist); + root['Chartist.plugins.ctAxisTitle'] = factory(Chartist); } -})(this, function(Chartist) { +}(this, function (Chartist) { + /** * Chartist.js plugin to display a title for 1 or 2 axes. - * version 0.0.5 + * version 0.0.7 * author: alex stanbury */ /* global Chartist */ - (function(window, document, Chartist) { + (function(Chartist) { "use strict"; var axisDefaults = { @@ -139,7 +140,8 @@ }); }; }; - })(window, document, Chartist); + })(Chartist); return Chartist.plugins.ctAxisTitle; -}); + +})); diff --git a/dist/chartist-plugin-axistitle.min.js b/dist/chartist-plugin-axistitle.min.js index 718d180..f9b60df 100644 --- a/dist/chartist-plugin-axistitle.min.js +++ b/dist/chartist-plugin-axistitle.min.js @@ -1,2 +1,8 @@ -!function(a,b){"function"==typeof define&&define.amd?define(["chartist"],function(c){return a.returnExportsGlobal=b(c)}):"object"==typeof exports?module.exports=b(require("chartist")):a["Chartist.plugins.ctAxisTitle"]=b(Chartist)}(this,function(a){return function(a,b,c){"use strict";var d={axisTitle:"",axisClass:"ct-axis-title",offset:{x:0,y:0},textAnchor:"middle",flipTitle:!1},e={axisX:d,axisY:d},f=function(a){return a instanceof Function?a():a},g=function(a){return a instanceof Function?a():a};c.plugins=c.plugins||{},c.plugins.ctAxisTitle=function(a){return a=c.extend({},e,a),function(b){b.on("created",function(b){if(!a.axisX.axisTitle&&!a.axisY.axisTitle)throw new Error("ctAxisTitle plugin - You must provide at least one axis title");if(!b.axisX&&!b.axisY)throw new Error("ctAxisTitle plugin can only be used on charts that have at least one axis");var d,e,h,i=c.normalizePadding(b.options.chartPadding);if(a.axisX.axisTitle&&b.axisX&&(d=b.axisX.axisLength/2+b.options.axisY.offset+i.left,e=i.top,"end"===b.options.axisY.position&&(d-=b.options.axisY.offset),"end"===b.options.axisX.position&&(e+=b.axisY.axisLength),h=new c.Svg("text"),h.addClass(g(a.axisX.axisClass)),h.text(f(a.axisX.axisTitle)),h.attr({x:d+a.axisX.offset.x,y:e+a.axisX.offset.y,"text-anchor":a.axisX.textAnchor}),b.svg.append(h,!0)),a.axisY.axisTitle&&b.axisY){d=0,e=b.axisY.axisLength/2+i.top,"start"===b.options.axisX.position&&(e+=b.options.axisX.offset),"end"===b.options.axisY.position&&(d=b.axisX.axisLength);var j="rotate("+(a.axisY.flipTitle?-90:90)+", "+d+", "+e+")";h=new c.Svg("text"),h.addClass(g(a.axisY.axisClass)),h.text(f(a.axisY.axisTitle)),h.attr({x:d+a.axisY.offset.x,y:e+a.axisY.offset.y,transform:j,"text-anchor":a.axisY.textAnchor}),b.svg.append(h,!0)}})}}}(window,document,a),a.plugins.ctAxisTitle}); +/* chartist-plugin-axistitle 0.0.7 + * Copyright © 2019 Alex Stanbury + * Free to use under the WTFPL license. + * http://www.wtfpl.net/ + */ + +!function(a,b){"function"==typeof define&&define.amd?define(["chartist"],function(c){return a.returnExportsGlobal=b(c)}):"object"==typeof exports?module.exports=b(require("chartist")):a["Chartist.plugins.ctAxisTitle"]=b(Chartist)}(this,function(a){return function(a){"use strict";var b={axisTitle:"",axisClass:"ct-axis-title",offset:{x:0,y:0},textAnchor:"middle",flipTitle:!1},c={axisX:b,axisY:b},d=function(a){return a instanceof Function?a():a},e=function(a){return a instanceof Function?a():a};a.plugins=a.plugins||{},a.plugins.ctAxisTitle=function(b){return b=a.extend({},c,b),function(c){c.on("created",function(c){if(!b.axisX.axisTitle&&!b.axisY.axisTitle)throw new Error("ctAxisTitle plugin - You must provide at least one axis title");if(!c.axisX&&!c.axisY)throw new Error("ctAxisTitle plugin can only be used on charts that have at least one axis");var f,g,h,i=a.normalizePadding(c.options.chartPadding);if(b.axisX.axisTitle&&c.axisX&&(f=c.axisX.axisLength/2+c.options.axisY.offset+i.left,g=i.top,"end"===c.options.axisY.position&&(f-=c.options.axisY.offset),"end"===c.options.axisX.position&&(g+=c.axisY.axisLength),h=new a.Svg("text"),h.addClass(e(b.axisX.axisClass)),h.text(d(b.axisX.axisTitle)),h.attr({x:f+b.axisX.offset.x,y:g+b.axisX.offset.y,"text-anchor":b.axisX.textAnchor}),c.svg.append(h,!0)),b.axisY.axisTitle&&c.axisY){f=0,g=c.axisY.axisLength/2+i.top,"start"===c.options.axisX.position&&(g+=c.options.axisX.offset),"end"===c.options.axisY.position&&(f=c.axisX.axisLength);var j="rotate("+(b.axisY.flipTitle?-90:90)+", "+f+", "+g+")";h=new a.Svg("text"),h.addClass(e(b.axisY.axisClass)),h.text(d(b.axisY.axisTitle)),h.attr({x:f+b.axisY.offset.x,y:g+b.axisY.offset.y,transform:j,"text-anchor":b.axisY.textAnchor}),c.svg.append(h,!0)}})}}}(a),a.plugins.ctAxisTitle}); //# sourceMappingURL=chartist-plugin-axistitle.min.js.map \ No newline at end of file diff --git a/dist/chartist-plugin-axistitle.min.js.map b/dist/chartist-plugin-axistitle.min.js.map index 07951af..e23cdce 100644 --- a/dist/chartist-plugin-axistitle.min.js.map +++ b/dist/chartist-plugin-axistitle.min.js.map @@ -1 +1 @@ -{"version":3,"sources":["chartist-plugin-axistitle.js"],"names":["root","factory","define","amd","Chartist","returnExportsGlobal","exports","module","require","this","window","document","axisDefaults","axisTitle","axisClass","offset","x","y","textAnchor","flipTitle","defaultOptions","axisX","axisY","getTitle","title","Function","getClasses","classes","plugins","ctAxisTitle","options","extend","chart","on","data","Error","xPos","yPos","chartPadding","normalizePadding","axisLength","left","top","position","Svg","addClass","text","attr","text-anchor","svg","append","transform"],"mappings":"CAAC,SAAUA,EAAMC,GACO,kBAAXC,SAAyBA,OAAOC,IAEzCD,QAAQ,YAAa,SAAUE,GAC7B,MAAQJ,GAAKK,oBAAsBJ,EAAQG,KAEjB,gBAAZE,SAIhBC,OAAOD,QAAUL,EAAQO,QAAQ,aAEjCR,EAAK,gCAAkCC,EAAQG,WAEjDK,KAAM,SAAUL,GAiIhB,MAzHC,UAAUM,EAAQC,EAAUP,GACzB,YAEA,IAAIQ,IACAC,UAAW,GACXC,UAAW,gBACXC,QACIC,EAAG,EACHC,EAAG,GAEPC,WAAY,SACZC,WAAW,GAGXC,GACAC,MAAOT,EACPU,MAAOV,GAGPW,EAAW,SAAUC,GACrB,MAAIA,aAAiBC,UACVD,IAEJA,GAGPE,EAAa,SAAUC,GACvB,MAAIA,aAAmBF,UACZE,IAEJA,EAGXvB,GAASwB,QAAUxB,EAASwB,YAC5BxB,EAASwB,QAAQC,YAAc,SAASC,GAIpC,MAFAA,GAAU1B,EAAS2B,UAAWX,EAAgBU,GAEvC,SAAqBE,GAExBA,EAAMC,GAAG,UAAW,SAASC,GAEzB,IAAKJ,EAAQT,MAAMR,YAAciB,EAAQR,MAAMT,UAC3C,KAAM,IAAIsB,OACN,gEAED,KAAKD,EAAKb,QAAUa,EAAKZ,MAC5B,KAAM,IAAIa,OACN,4EAIR,IAAIC,GACAC,EACAb,EACAc,EAAelC,EAASmC,iBAAiBL,EAAKJ,QAAQQ,aAgC1D,IA7BIR,EAAQT,MAAMR,WAAaqB,EAAKb,QAEhCe,EAAQF,EAAKb,MAAMmB,WAAa,EAAKN,EAAKJ,QAAQR,MAAMP,OACpDuB,EAAaG,KAEjBJ,EAAOC,EAAaI,IAEgB,QAAhCR,EAAKJ,QAAQR,MAAMqB,WACnBP,GAAQF,EAAKJ,QAAQR,MAAMP,QAGK,QAAhCmB,EAAKJ,QAAQT,MAAMsB,WACnBN,GAAQH,EAAKZ,MAAMkB,YAGvBhB,EAAQ,GAAIpB,GAASwC,IAAI,QACzBpB,EAAMqB,SAASnB,EAAWI,EAAQT,MAAMP,YACxCU,EAAMsB,KAAKvB,EAASO,EAAQT,MAAMR,YAClCW,EAAMuB,MACF/B,EAAGoB,EAAON,EAAQT,MAAMN,OAAOC,EAC/BC,EAAGoB,EAAOP,EAAQT,MAAMN,OAAOE,EAC/B+B,cAAelB,EAAQT,MAAMH,aAGjCgB,EAAKe,IAAIC,OAAO1B,GAAO,IAKvBM,EAAQR,MAAMT,WAAaqB,EAAKZ,MAAO,CACvCc,EAAO,EAGPC,EAAQH,EAAKZ,MAAMkB,WAAa,EAAKF,EAC5BI,IAE2B,UAAhCR,EAAKJ,QAAQT,MAAMsB,WACnBN,GAAQH,EAAKJ,QAAQT,MAAMN,QAGK,QAAhCmB,EAAKJ,QAAQR,MAAMqB,WACnBP,EAAOF,EAAKb,MAAMmB,WAGtB,IAAIW,GAAY,WAAarB,EAAQR,MAAMH,WAAY,GACtC,IAAM,KAAOiB,EAAO,KAAOC,EAAO,GAEnDb,GAAQ,GAAIpB,GAASwC,IAAI,QACzBpB,EAAMqB,SAASnB,EAAWI,EAAQR,MAAMR,YACxCU,EAAMsB,KAAKvB,EAASO,EAAQR,MAAMT,YAClCW,EAAMuB,MACF/B,EAAGoB,EAAON,EAAQR,MAAMP,OAAOC,EAC/BC,EAAGoB,EAAOP,EAAQR,MAAMP,OAAOE,EAC/BkC,UAAWA,EACXH,cAAelB,EAAQR,MAAMJ,aAEjCgB,EAAKe,IAAIC,OAAO1B,GAAO,SAKzCd,OAAQC,SAAUP,GAEbA,EAASwB,QAAQC","file":"chartist-plugin-axistitle.min.js","sourcesContent":["(function (root, factory) {\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define([\"chartist\"], function (Chartist) {\n return (root.returnExportsGlobal = factory(Chartist));\n });\n } else if (typeof exports === 'object') {\n // Node. Does not work with strict CommonJS, but\n // only CommonJS-like enviroments that support module.exports,\n // like Node.\n module.exports = factory(require(\"chartist\"));\n } else {\n root['Chartist.plugins.ctAxisTitle'] = factory(Chartist);\n }\n}(this, function (Chartist) {\n\n /**\n * Chartist.js plugin to display a title for 1 or 2 axes.\n * version 0.0.4\n * author: alex stanbury\n */\n /* global Chartist */\n (function (window, document, Chartist) {\n 'use strict';\n\n var axisDefaults = {\n axisTitle: '',\n axisClass: 'ct-axis-title',\n offset: {\n x: 0,\n y: 0\n },\n textAnchor: 'middle',\n flipTitle: false\n };\n\n var defaultOptions = {\n axisX: axisDefaults,\n axisY: axisDefaults\n };\n\n var getTitle = function (title) {\n if (title instanceof Function) {\n return title();\n }\n return title;\n };\n\n var getClasses = function (classes) {\n if (classes instanceof Function) {\n return classes();\n }\n return classes;\n };\n\n Chartist.plugins = Chartist.plugins || {};\n Chartist.plugins.ctAxisTitle = function(options) {\n\n options = Chartist.extend({}, defaultOptions, options);\n\n return function ctAxisTitle(chart) {\n\n chart.on('created', function(data) {\n\n if (!options.axisX.axisTitle && !options.axisY.axisTitle) {\n throw new Error(\n 'ctAxisTitle plugin - You must provide at least one axis title'\n );\n } else if (!data.axisX && !data.axisY) {\n throw new Error(\n 'ctAxisTitle plugin can only be used on charts that have at least one axis'\n );\n }\n\n var xPos,\n yPos,\n title,\n chartPadding = Chartist.normalizePadding(data.options.chartPadding); // normalize the padding in case the full padding object was not passed into the options\n\n //position axis X title\n if (options.axisX.axisTitle && data.axisX) {\n\n xPos = (data.axisX.axisLength / 2) + data.options.axisY.offset +\n chartPadding.left;\n\n yPos = chartPadding.top;\n\n if (data.options.axisY.position === 'end') {\n xPos -= data.options.axisY.offset;\n }\n\n if (data.options.axisX.position === 'end') {\n yPos += data.axisY.axisLength;\n }\n\n title = new Chartist.Svg(\"text\");\n title.addClass(getClasses(options.axisX.axisClass));\n title.text(getTitle(options.axisX.axisTitle));\n title.attr({\n x: xPos + options.axisX.offset.x,\n y: yPos + options.axisX.offset.y,\n \"text-anchor\": options.axisX.textAnchor\n });\n\n data.svg.append(title, true);\n\n }\n\n //position axis Y title\n if (options.axisY.axisTitle && data.axisY) {\n xPos = 0;\n\n\n yPos = (data.axisY.axisLength / 2) + chartPadding\n .top;\n\n if (data.options.axisX.position === 'start') {\n yPos += data.options.axisX.offset;\n }\n\n if (data.options.axisY.position === 'end') {\n xPos = data.axisX.axisLength;\n }\n\n var transform = 'rotate(' + (options.axisY.flipTitle ? -\n 90 : 90) + ', ' + xPos + ', ' + yPos + ')';\n\n title = new Chartist.Svg(\"text\");\n title.addClass(getClasses(options.axisY.axisClass));\n title.text(getTitle(options.axisY.axisTitle));\n title.attr({\n x: xPos + options.axisY.offset.x,\n y: yPos + options.axisY.offset.y,\n transform: transform,\n \"text-anchor\": options.axisY.textAnchor\n });\n data.svg.append(title, true);\n }\n });\n };\n };\n }(window, document, Chartist));\n\n return Chartist.plugins.ctAxisTitle;\n\n}));\n"]} \ No newline at end of file +{"version":3,"sources":["chartist-plugin-axistitle.js"],"names":["root","factory","define","amd","Chartist","returnExportsGlobal","exports","module","require","this","axisDefaults","axisTitle","axisClass","offset","x","y","textAnchor","flipTitle","defaultOptions","axisX","axisY","getTitle","title","Function","getClasses","classes","plugins","ctAxisTitle","options","extend","chart","on","data","Error","xPos","yPos","chartPadding","normalizePadding","axisLength","left","top","position","Svg","addClass","text","attr","text-anchor","svg","append","transform"],"mappings":";;;;;;CAAC,SAAUA,EAAMC,GACO,kBAAXC,SAAyBA,OAAOC,IAEzCD,QAAQ,YAAa,SAAUE,GAC7B,MAAQJ,GAAKK,oBAAsBJ,EAAQG,KAEjB,gBAAZE,SAIhBC,OAAOD,QAAUL,EAAQO,QAAQ,aAEjCR,EAAK,gCAAkCC,EAAQG,WAEjDK,KAAM,SAAUL,GAkIhB,MA1HA,UAAUA,GACR,YAEA,IAAIM,IACFC,UAAW,GACXC,UAAW,gBACXC,QACEC,EAAG,EACHC,EAAG,GAELC,WAAY,SACZC,WAAW,GAGTC,GACFC,MAAOT,EACPU,MAAOV,GAGLW,EAAW,SAASC,GACtB,MAAIA,aAAiBC,UACZD,IAEFA,GAGLE,EAAa,SAASC,GACxB,MAAIA,aAAmBF,UACdE,IAEFA,EAGTrB,GAASsB,QAAUtB,EAASsB,YAC5BtB,EAASsB,QAAQC,YAAc,SAASC,GAGtC,MAFAA,GAAUxB,EAASyB,UAAWX,EAAgBU,GAEvC,SAAqBE,GAC1BA,EAAMC,GAAG,UAAW,SAASC,GAC3B,IAAKJ,EAAQT,MAAMR,YAAciB,EAAQR,MAAMT,UAC7C,KAAM,IAAIsB,OACR,gEAEG,KAAKD,EAAKb,QAAUa,EAAKZ,MAC9B,KAAM,IAAIa,OACR,4EAIJ,IAAIC,GACFC,EACAb,EACAc,EAAehC,EAASiC,iBAAiBL,EAAKJ,QAAQQ,aAgCxD,IA7BIR,EAAQT,MAAMR,WAAaqB,EAAKb,QAClCe,EACEF,EAAKb,MAAMmB,WAAa,EACxBN,EAAKJ,QAAQR,MAAMP,OACnBuB,EAAaG,KAEfJ,EAAOC,EAAaI,IAEgB,QAAhCR,EAAKJ,QAAQR,MAAMqB,WACrBP,GAAQF,EAAKJ,QAAQR,MAAMP,QAGO,QAAhCmB,EAAKJ,QAAQT,MAAMsB,WACrBN,GAAQH,EAAKZ,MAAMkB,YAGrBhB,EAAQ,GAAIlB,GAASsC,IAAI,QACzBpB,EAAMqB,SAASnB,EAAWI,EAAQT,MAAMP,YACxCU,EAAMsB,KAAKvB,EAASO,EAAQT,MAAMR,YAClCW,EAAMuB,MACJ/B,EAAGoB,EAAON,EAAQT,MAAMN,OAAOC,EAC/BC,EAAGoB,EAAOP,EAAQT,MAAMN,OAAOE,EAC/B+B,cAAelB,EAAQT,MAAMH,aAG/BgB,EAAKe,IAAIC,OAAO1B,GAAO,IAIrBM,EAAQR,MAAMT,WAAaqB,EAAKZ,MAAO,CACzCc,EAAO,EAEPC,EAAOH,EAAKZ,MAAMkB,WAAa,EAAIF,EAAaI,IAEZ,UAAhCR,EAAKJ,QAAQT,MAAMsB,WACrBN,GAAQH,EAAKJ,QAAQT,MAAMN,QAGO,QAAhCmB,EAAKJ,QAAQR,MAAMqB,WACrBP,EAAOF,EAAKb,MAAMmB,WAGpB,IAAIW,GACF,WACCrB,EAAQR,MAAMH,WAAa,GAAK,IACjC,KACAiB,EACA,KACAC,EACA,GAEFb,GAAQ,GAAIlB,GAASsC,IAAI,QACzBpB,EAAMqB,SAASnB,EAAWI,EAAQR,MAAMR,YACxCU,EAAMsB,KAAKvB,EAASO,EAAQR,MAAMT,YAClCW,EAAMuB,MACJ/B,EAAGoB,EAAON,EAAQR,MAAMP,OAAOC,EAC/BC,EAAGoB,EAAOP,EAAQR,MAAMP,OAAOE,EAC/BkC,UAAWA,EACXH,cAAelB,EAAQR,MAAMJ,aAE/BgB,EAAKe,IAAIC,OAAO1B,GAAO,SAK9BlB,GAEIA,EAASsB,QAAQC","file":"chartist-plugin-axistitle.min.js","sourcesContent":["(function (root, factory) {\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define([\"chartist\"], function (Chartist) {\n return (root.returnExportsGlobal = factory(Chartist));\n });\n } else if (typeof exports === 'object') {\n // Node. Does not work with strict CommonJS, but\n // only CommonJS-like enviroments that support module.exports,\n // like Node.\n module.exports = factory(require(\"chartist\"));\n } else {\n root['Chartist.plugins.ctAxisTitle'] = factory(Chartist);\n }\n}(this, function (Chartist) {\n\n /**\n * Chartist.js plugin to display a title for 1 or 2 axes.\n * version 0.0.7\n * author: alex stanbury\n */\n /* global Chartist */\n (function(Chartist) {\n \"use strict\";\n\n var axisDefaults = {\n axisTitle: \"\",\n axisClass: \"ct-axis-title\",\n offset: {\n x: 0,\n y: 0\n },\n textAnchor: \"middle\",\n flipTitle: false\n };\n\n var defaultOptions = {\n axisX: axisDefaults,\n axisY: axisDefaults\n };\n\n var getTitle = function(title) {\n if (title instanceof Function) {\n return title();\n }\n return title;\n };\n\n var getClasses = function(classes) {\n if (classes instanceof Function) {\n return classes();\n }\n return classes;\n };\n\n Chartist.plugins = Chartist.plugins || {};\n Chartist.plugins.ctAxisTitle = function(options) {\n options = Chartist.extend({}, defaultOptions, options);\n\n return function ctAxisTitle(chart) {\n chart.on(\"created\", function(data) {\n if (!options.axisX.axisTitle && !options.axisY.axisTitle) {\n throw new Error(\n \"ctAxisTitle plugin - You must provide at least one axis title\"\n );\n } else if (!data.axisX && !data.axisY) {\n throw new Error(\n \"ctAxisTitle plugin can only be used on charts that have at least one axis\"\n );\n }\n\n var xPos,\n yPos,\n title,\n chartPadding = Chartist.normalizePadding(data.options.chartPadding); // normalize the padding in case the full padding object was not passed into the options\n\n //position axis X title\n if (options.axisX.axisTitle && data.axisX) {\n xPos =\n data.axisX.axisLength / 2 +\n data.options.axisY.offset +\n chartPadding.left;\n\n yPos = chartPadding.top;\n\n if (data.options.axisY.position === \"end\") {\n xPos -= data.options.axisY.offset;\n }\n\n if (data.options.axisX.position === \"end\") {\n yPos += data.axisY.axisLength;\n }\n\n title = new Chartist.Svg(\"text\");\n title.addClass(getClasses(options.axisX.axisClass));\n title.text(getTitle(options.axisX.axisTitle));\n title.attr({\n x: xPos + options.axisX.offset.x,\n y: yPos + options.axisX.offset.y,\n \"text-anchor\": options.axisX.textAnchor\n });\n\n data.svg.append(title, true);\n }\n\n //position axis Y title\n if (options.axisY.axisTitle && data.axisY) {\n xPos = 0;\n\n yPos = data.axisY.axisLength / 2 + chartPadding.top;\n\n if (data.options.axisX.position === \"start\") {\n yPos += data.options.axisX.offset;\n }\n\n if (data.options.axisY.position === \"end\") {\n xPos = data.axisX.axisLength;\n }\n\n var transform =\n \"rotate(\" +\n (options.axisY.flipTitle ? -90 : 90) +\n \", \" +\n xPos +\n \", \" +\n yPos +\n \")\";\n\n title = new Chartist.Svg(\"text\");\n title.addClass(getClasses(options.axisY.axisClass));\n title.text(getTitle(options.axisY.axisTitle));\n title.attr({\n x: xPos + options.axisY.offset.x,\n y: yPos + options.axisY.offset.y,\n transform: transform,\n \"text-anchor\": options.axisY.textAnchor\n });\n data.svg.append(title, true);\n }\n });\n };\n };\n })(Chartist);\n\n return Chartist.plugins.ctAxisTitle;\n\n}));\n"]} \ No newline at end of file diff --git a/example.html b/example.html index 324d2e9..b5ec5a3 100644 --- a/example.html +++ b/example.html @@ -1,54 +1,56 @@ - - + My first Chartist Tests - - + + - +
- - - \ No newline at end of file + + diff --git a/package.json b/package.json index cd47fd9..a75492f 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "chartist-plugin-axistitle", "description": "Axis Title Plugin for Chartist.js", - "version": "0.0.5", + "version": "0.0.7", "author": "Alex Stanbury", "homepage": "https://alexstanbury.github.io/chartist-plugin-axistitle", "repository": { diff --git a/src/scripts/chartist-plugin-axistitle.js b/src/scripts/chartist-plugin-axistitle.js index 1e4d222..c644af0 100644 --- a/src/scripts/chartist-plugin-axistitle.js +++ b/src/scripts/chartist-plugin-axistitle.js @@ -1,126 +1,127 @@ /** * Chartist.js plugin to display a title for 1 or 2 axes. - * version 0.0.4 + * version 0.0.7 * author: alex stanbury */ /* global Chartist */ -(function (window, document, Chartist) { - 'use strict'; - - var axisDefaults = { - axisTitle: '', - axisClass: 'ct-axis-title', - offset: { - x: 0, - y: 0 - }, - textAnchor: 'middle', - flipTitle: false - }; - - var defaultOptions = { - axisX: axisDefaults, - axisY: axisDefaults - }; - - var getTitle = function (title) { - if (title instanceof Function) { - return title(); +(function(Chartist) { + "use strict"; + + var axisDefaults = { + axisTitle: "", + axisClass: "ct-axis-title", + offset: { + x: 0, + y: 0 + }, + textAnchor: "middle", + flipTitle: false + }; + + var defaultOptions = { + axisX: axisDefaults, + axisY: axisDefaults + }; + + var getTitle = function(title) { + if (title instanceof Function) { + return title(); + } + return title; + }; + + var getClasses = function(classes) { + if (classes instanceof Function) { + return classes(); + } + return classes; + }; + + Chartist.plugins = Chartist.plugins || {}; + Chartist.plugins.ctAxisTitle = function(options) { + options = Chartist.extend({}, defaultOptions, options); + + return function ctAxisTitle(chart) { + chart.on("created", function(data) { + if (!options.axisX.axisTitle && !options.axisY.axisTitle) { + throw new Error( + "ctAxisTitle plugin - You must provide at least one axis title" + ); + } else if (!data.axisX && !data.axisY) { + throw new Error( + "ctAxisTitle plugin can only be used on charts that have at least one axis" + ); } - return title; - }; - var getClasses = function (classes) { - if (classes instanceof Function) { - return classes(); + var xPos, + yPos, + title, + chartPadding = Chartist.normalizePadding(data.options.chartPadding); // normalize the padding in case the full padding object was not passed into the options + + //position axis X title + if (options.axisX.axisTitle && data.axisX) { + xPos = + data.axisX.axisLength / 2 + + data.options.axisY.offset + + chartPadding.left; + + yPos = chartPadding.top; + + if (data.options.axisY.position === "end") { + xPos -= data.options.axisY.offset; + } + + if (data.options.axisX.position === "end") { + yPos += data.axisY.axisLength; + } + + title = new Chartist.Svg("text"); + title.addClass(getClasses(options.axisX.axisClass)); + title.text(getTitle(options.axisX.axisTitle)); + title.attr({ + x: xPos + options.axisX.offset.x, + y: yPos + options.axisX.offset.y, + "text-anchor": options.axisX.textAnchor + }); + + data.svg.append(title, true); } - return classes; - }; - - Chartist.plugins = Chartist.plugins || {}; - Chartist.plugins.ctAxisTitle = function(options) { - - options = Chartist.extend({}, defaultOptions, options); - - return function ctAxisTitle(chart) { - - chart.on('created', function(data) { - - if (!options.axisX.axisTitle && !options.axisY.axisTitle) { - throw new Error( - 'ctAxisTitle plugin - You must provide at least one axis title' - ); - } else if (!data.axisX && !data.axisY) { - throw new Error( - 'ctAxisTitle plugin can only be used on charts that have at least one axis' - ); - } - - var xPos, - yPos, - title, - chartPadding = Chartist.normalizePadding(data.options.chartPadding); // normalize the padding in case the full padding object was not passed into the options - - //position axis X title - if (options.axisX.axisTitle && data.axisX) { - - xPos = (data.axisX.axisLength / 2) + data.options.axisY.offset + - chartPadding.left; - yPos = chartPadding.top; - - if (data.options.axisY.position === 'end') { - xPos -= data.options.axisY.offset; - } - - if (data.options.axisX.position === 'end') { - yPos += data.axisY.axisLength; - } - - title = new Chartist.Svg("text"); - title.addClass(getClasses(options.axisX.axisClass)); - title.text(getTitle(options.axisX.axisTitle)); - title.attr({ - x: xPos + options.axisX.offset.x, - y: yPos + options.axisX.offset.y, - "text-anchor": options.axisX.textAnchor - }); - - data.svg.append(title, true); - - } - - //position axis Y title - if (options.axisY.axisTitle && data.axisY) { - xPos = 0; - - - yPos = (data.axisY.axisLength / 2) + chartPadding - .top; - - if (data.options.axisX.position === 'start') { - yPos += data.options.axisX.offset; - } - - if (data.options.axisY.position === 'end') { - xPos = data.axisX.axisLength; - } - - var transform = 'rotate(' + (options.axisY.flipTitle ? - - 90 : 90) + ', ' + xPos + ', ' + yPos + ')'; - - title = new Chartist.Svg("text"); - title.addClass(getClasses(options.axisY.axisClass)); - title.text(getTitle(options.axisY.axisTitle)); - title.attr({ - x: xPos + options.axisY.offset.x, - y: yPos + options.axisY.offset.y, - transform: transform, - "text-anchor": options.axisY.textAnchor - }); - data.svg.append(title, true); - } - }); - }; + //position axis Y title + if (options.axisY.axisTitle && data.axisY) { + xPos = 0; + + yPos = data.axisY.axisLength / 2 + chartPadding.top; + + if (data.options.axisX.position === "start") { + yPos += data.options.axisX.offset; + } + + if (data.options.axisY.position === "end") { + xPos = data.axisX.axisLength; + } + + var transform = + "rotate(" + + (options.axisY.flipTitle ? -90 : 90) + + ", " + + xPos + + ", " + + yPos + + ")"; + + title = new Chartist.Svg("text"); + title.addClass(getClasses(options.axisY.axisClass)); + title.text(getTitle(options.axisY.axisTitle)); + title.attr({ + x: xPos + options.axisY.offset.x, + y: yPos + options.axisY.offset.y, + transform: transform, + "text-anchor": options.axisY.textAnchor + }); + data.svg.append(title, true); + } + }); }; -}(window, document, Chartist)); + }; +})(Chartist);