From e58fb40c079ef6a132ee82811ff8344748803832 Mon Sep 17 00:00:00 2001 From: pratu16x7 Date: Sat, 4 Nov 2017 07:45:53 +0530 Subject: [PATCH] Cleanup pie chart --- dist/frappe-charts.min.js.map | 2 +- docs/assets/js/frappe-charts.min.js.map | 2 +- docs/assets/js/index.js | 2 +- docs/index.html | 4 ++-- src/scripts/charts.js | 2 +- src/scripts/charts/BaseChart.js | 12 ++++++------ src/scripts/charts/PieChart.js | 12 ++++++------ src/scripts/helpers/dom.js | 4 ++++ src/scripts/helpers/utils.js | 2 +- 9 files changed, 23 insertions(+), 19 deletions(-) diff --git a/dist/frappe-charts.min.js.map b/dist/frappe-charts.min.js.map index c73b93d..fc691d5 100644 --- a/dist/frappe-charts.min.js.map +++ b/dist/frappe-charts.min.js.map @@ -1 +1 @@ -{"version":3,"file":"frappe-charts.min.js","sources":["../src/scripts/helpers/dom.js","../src/scripts/helpers/utils.js","../src/scripts/charts.js","../src/scripts/objects/SvgTip.js","../src/scripts/charts/BaseChart.js","../src/scripts/charts/AxisChart.js","../src/scripts/charts/BarChart.js","../src/scripts/charts/LineChart.js","../src/scripts/charts/ScatterChart.js","../src/scripts/charts/PercentageChart.js","../src/scripts/charts/PieChart.js","../src/scripts/charts/Heatmap.js"],"sourcesContent":["export default function $(expr, con) {\n\treturn typeof expr === \"string\"? (con || document).querySelector(expr) : expr || null;\n}\n\nconst EASING = {\n\tease: \"0.25 0.1 0.25 1\",\n\tlinear: \"0 0 1 1\",\n\t// easein: \"0.42 0 1 1\",\n\teasein: \"0.1 0.8 0.2 1\",\n\teaseout: \"0 0 0.58 1\",\n\teaseinout: \"0.42 0 0.58 1\"\n};\n\n\n$.findNodeIndex = (node) =>\n{\n\tvar i = 0;\n\twhile (node.previousSibling) {\n\t\tnode = node.previousSibling;\n\t\ti++;\n\t}\n\treturn i;\n};\n\n$.create = (tag, o) => {\n\tvar element = document.createElement(tag);\n\n\tfor (var i in o) {\n\t\tvar val = o[i];\n\n\t\tif (i === \"inside\") {\n\t\t\t$(val).appendChild(element);\n\t\t}\n\t\telse if (i === \"around\") {\n\t\t\tvar ref = $(val);\n\t\t\tref.parentNode.insertBefore(element, ref);\n\t\t\telement.appendChild(ref);\n\t\t} else if (i === \"styles\") {\n\t\t\tif(typeof val === \"object\") {\n\t\t\t\tObject.keys(val).map(prop => {\n\t\t\t\t\telement.style[prop] = val[prop];\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (i in element ) {\n\t\t\telement[i] = val;\n\t\t}\n\t\telse {\n\t\t\telement.setAttribute(i, val);\n\t\t}\n\t}\n\n\treturn element;\n};\n\n$.createSVG = (tag, o) => {\n\tvar element = document.createElementNS(\"http://www.w3.org/2000/svg\", tag);\n\n\tfor (var i in o) {\n\t\tvar val = o[i];\n\n\t\tif (i === \"inside\") {\n\t\t\t$(val).appendChild(element);\n\t\t}\n\t\telse if (i === \"around\") {\n\t\t\tvar ref = $(val);\n\t\t\tref.parentNode.insertBefore(element, ref);\n\t\t\telement.appendChild(ref);\n\t\t}\n\t\telse {\n\t\t\tif(i === \"className\") { i = \"class\"; }\n\t\t\tif(i === \"innerHTML\") {\n\t\t\t\telement['textContent'] = val;\n\t\t\t} else {\n\t\t\t\telement.setAttribute(i, val);\n\t\t\t}\n\t\t}\n\t}\n\n\treturn element;\n};\n\n$.runSVGAnimation = (svg_container, elements) => {\n\t// let parent = elements[0][0]['unit'].parentNode;\n\n\tlet new_elements = [];\n\tlet anim_elements = [];\n\n\telements.map(element => {\n\t\tlet obj = element[0];\n\t\tlet parent = obj.unit.parentNode;\n\t\t// let index = let findNodeIndex(obj.unit);\n\n\t\tlet anim_element, new_element;\n\n\t\telement[0] = obj.unit;\n\t\t[anim_element, new_element] = $.animateSVG(...element);\n\n\t\tnew_elements.push(new_element);\n\t\tanim_elements.push([anim_element, parent]);\n\n\t\tparent.replaceChild(anim_element, obj.unit);\n\n\t\tif(obj.array) {\n\t\t\tobj.array[obj.index] = new_element;\n\t\t} else {\n\t\t\tobj.object[obj.key] = new_element;\n\t\t}\n\t});\n\n\tlet anim_svg = svg_container.cloneNode(true);\n\n\tanim_elements.map((anim_element, i) => {\n\t\tanim_element[1].replaceChild(new_elements[i], anim_element[0]);\n\t\telements[i][0] = new_elements[i];\n\t});\n\n\treturn anim_svg;\n};\n$.transform = (element, style)=>{\n\telement.style.transform = style;\n\telement.style.webkitTransform = style;\n\telement.style.msTransform = style;\n\telement.style.mozTransform = style;\n\telement.style.oTransform = style;\n};\n$.animateSVG = (element, props, dur, easing_type=\"linear\", type=undefined, old_values={}) => {\n\n\tlet anim_element = element.cloneNode(true);\n\tlet new_element = element.cloneNode(true);\n\tfor(var attributeName in props) {\n\t\tlet animate_element;\n\t\tif(attributeName === 'transform') {\n\t\t\tanimate_element = document.createElementNS(\"http://www.w3.org/2000/svg\", \"animateTransform\");\n\t\t} else {\n\t\t\tanimate_element = document.createElementNS(\"http://www.w3.org/2000/svg\", \"animate\");\n\t\t}\n\t\tlet current_value = old_values[attributeName] || element.getAttribute(attributeName);\n\t\tlet value = props[attributeName];\n\t\tlet anim_attr = {\n\t\t\tattributeName: attributeName,\n\t\t\tfrom: current_value,\n\t\t\tto: value,\n\t\t\tbegin: \"0s\",\n\t\t\tdur: dur/1000 + \"s\",\n\t\t\tvalues: current_value + \";\" + value,\n\t\t\tkeySplines: EASING[easing_type],\n\t\t\tkeyTimes: \"0;1\",\n\t\t\tcalcMode: \"spline\",\n\t\t\tfill: 'freeze'\n\t\t};\n\n\t\tif(type) {\n\t\t\tanim_attr[\"type\"] = type;\n\t\t}\n\n\t\tfor (var i in anim_attr) {\n\t\t\tanimate_element.setAttribute(i, anim_attr[i]);\n\t\t}\n\n\t\tanim_element.appendChild(animate_element);\n\n\t\tif(type) {\n\t\t\tnew_element.setAttribute(attributeName, `translate(${value})`);\n\t\t} else {\n\t\t\tnew_element.setAttribute(attributeName, value);\n\t\t}\n\t}\n\n\treturn [anim_element, new_element];\n};\n\n$.offset = (element) => {\n\tlet rect = element.getBoundingClientRect();\n\treturn {\n\t\t// https://stackoverflow.com/a/7436602/6495043\n\t\t// rect.top varies with scroll, so we add whatever has been\n\t\t// scrolled to it to get absolute distance from actual page top\n\t\ttop: rect.top + (document.documentElement.scrollTop || document.body.scrollTop),\n\t\tleft: rect.left + (document.documentElement.scrollLeft || document.body.scrollLeft)\n\t};\n};\n\n$.isElementInViewport = (el) => {\n\t// Although straightforward: https://stackoverflow.com/a/7557433/6495043\n\tvar rect = el.getBoundingClientRect();\n\n\treturn (\n\t\trect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */\n rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */\n\t);\n};\n\n$.bind = (element, o) => {\n\tif (element) {\n\t\tfor (var event in o) {\n\t\t\tvar callback = o[event];\n\n\t\t\tevent.split(/\\s+/).forEach(function (event) {\n\t\t\t\telement.addEventListener(event, callback);\n\t\t\t});\n\t\t}\n\t}\n};\n\n$.unbind = (element, o) => {\n\tif (element) {\n\t\tfor (var event in o) {\n\t\t\tvar callback = o[event];\n\n\t\t\tevent.split(/\\s+/).forEach(function(event) {\n\t\t\t\telement.removeEventListener(event, callback);\n\t\t\t});\n\t\t}\n\t}\n};\n\n$.fire = (target, type, properties) => {\n\tvar evt = document.createEvent(\"HTMLEvents\");\n\n\tevt.initEvent(type, true, true );\n\n\tfor (var j in properties) {\n\t\tevt[j] = properties[j];\n\t}\n\n\treturn target.dispatchEvent(evt);\n};\n","export function float_2(d) {\n\treturn parseFloat(d.toFixed(2));\n}\n\nexport function arrays_equal(arr1, arr2) {\n\tif(arr1.length !== arr2.length) return false;\n\tlet are_equal = true;\n\tarr1.map((d, i) => {\n\t\tif(arr2[i] !== d) are_equal = false;\n\t});\n\treturn are_equal;\n}\n\nfunction limitColor(r){\n\tif (r > 255) return 255;\n\telse if (r < 0) return 0;\n\treturn r;\n}\n\nexport function LightenDarkenColor(col,amt) {\n\tlet usePound = false;\n\tif (col[0] == \"#\") {\n\t\tcol = col.slice(1);\n\t\tusePound = true;\n\t}\n\tlet num = parseInt(col,16);\n\tlet r = limitColor((num >> 16) + amt);\n\tlet b = limitColor(((num >> 8) & 0x00FF) + amt);\n\tlet g = limitColor((num & 0x0000FF) + amt);\n\treturn (usePound?\"#\":\"\") + (g | (b << 8) | (r << 16)).toString(16);\n}\n\nexport function shuffle(array) {\n\t// https://stackoverflow.com/a/2450976/6495043\n\t// Awesomeness: https://bost.ocks.org/mike/shuffle/\n\n\tvar currentIndex = array.length, temporaryValue, randomIndex;\n\n\t// While there remain elements to shuffle...\n\twhile (0 !== currentIndex) {\n\n\t\t// Pick a remaining element...\n\t\trandomIndex = Math.floor(Math.random() * currentIndex);\n\t\tcurrentIndex -= 1;\n\n\t\t// And swap it with the current element.\n\t\ttemporaryValue = array[currentIndex];\n\t\tarray[currentIndex] = array[randomIndex];\n\t\tarray[randomIndex] = temporaryValue;\n\t}\n\n\treturn array;\n}\n","import '../styles/charts.less';\n\nimport BarChart from './charts/BarChart';\nimport LineChart from './charts/LineChart';\nimport ScatterChart from './charts/ScatterChart';\nimport PercentageChart from './charts/PercentageChart';\nimport PieChart from './charts/PieChart';\nimport Heatmap from './charts/Heatmap';\n\n// if (ENV !== 'production') {\n// \t// Enable LiveReload\n// \tdocument.write(\n// \t\t'