123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314 |
- <!---->
- <!-- Created by An An on 17/1/16.-->
- <!-- Copyright © 2017年 An An. All rights reserved.-->
- <!-- source code ----*** https://github.com/AAChartModel/AAChartKit ***--- source code-->
- <!---->
- <!--/*-->
- <!---->
- <!--* --------------------------------------------------------------------------------->
- <!--*-->
- <!--* ❀❀❀ WARM TIPS!!! ❀❀❀-->
- <!--*-->
- <!--* Please contact me on GitHub,if there are any problems encountered in use.-->
- <!--* GitHub Issues : https://github.com/AAChartModel/AAChartKit/issues-->
- <!--* --------------------------------------------------------------------------------->
- <!--* And if you want to contribute for this project, please contact me as well-->
- <!--* GitHub : https://github.com/AAChartModel-->
- <!--* StackOverflow : https://stackoverflow.com/users/7842508/codeforu-->
- <!--* JianShu : http://www.jianshu.com/u/f1e6753d4254-->
- <!--* SegmentFault : https://segmentfault.com/u/huanghunbieguan-->
- <!--*-->
- <!--* --------------------------------------------------------------------------------->
- <!---->
- <!--*/-->
- <html>
- <head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=3.0,user-scalable = no">
-
- <script src="AAJQueryLibrary.js">
- </script>
- <script src="AAHighchartsLibrary.js">
- </script>
- <script src="AAHighchartsMore.js">
- </script>
- <!-- <script src="AAHighcharts-3d.js">-->
- <!-- </script>-->
- <script src="AAFunnel.js">
- </script>
- <!-- <script src="AADrilldown.js">-->
- <!-- </script>-->
- <!-- 若介意本地js代码体积(5M左右,工程打包压缩后实际体积远小于此)过大,可换用加载网络js代码 -->
- <!-- <script src="https://img.hcharts.cn/jquery/jquery-1.8.3.min.js">-->
- <!-- </script>-->
- <!-- <script src="https://img.hcharts.cn/highcharts/highcharts.js">-->
- <!-- </script>-->
- <!-- <script src="https://img.hcharts.cn/highcharts/highcharts-more.js">-->
- <!-- </script>-->
-
-
- <style>
- *{
- -webkit-user-select: none;
- user-select: none;
- }
- </style>
-
- </head>
- <body>
- <div id="container" style="width:min-450px; height: 200px; margin: 0 auto">
- </div>
- <script >
-
- var chartMax;
-
- function loadTheHighChartView (sender,receivedWidth,receivedHeight) {
- var container = document.getElementById('container');//获得元素
- if (receivedWidth != 0) {
- container.style.width = receivedWidth;//设置宽度
- }
- container.style.height = receivedHeight;//设置高度
-
- var JavaScriptObject = JSON.parse(sender);
-
- if (JavaScriptObject.gradientColorEnable == true) { //开启图表渐变色功能
- var colors = JavaScriptObject.colors;
- JavaScriptObject.colors = Highcharts.map(colors, function (color) {
- return {
- linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
- stops: [
- [0, color],
- [1, Highcharts.Color(color).setOpacity(0.3).get('rgba')]
- ]
- };
- });
- }
-
-
- JavaScriptObject.credits = {enabled:false};//去掉表格右下角版权信息
-
- var animation = JavaScriptObject.plotOptions.series.animation;
- if (animation) {
- var animationEasingType = animation.easing;
- JavaScriptObject.plotOptions.series.animation.easing = configureTheChartAnimationEasingType(animationEasingType);
- }
- chartMax = Highcharts.chart('container', JavaScriptObject );
- }
-
- function onlyRefreshTheChartDataWithSeries (receivedSeries) {
- var receivedSeriesElementArr = JSON.parse(receivedSeries);
-
- for (var i = 0; i < receivedSeriesElementArr.length; i++) {
- var receivedSeriesData = receivedSeriesElementArr[i].data;
- // 获取series
- var chartSeries = $('#container').highcharts().series[i];
- // 执行只刷新数据的函数
- chartSeries.setData(receivedSeriesData);
- }
- }
-
- function chartSeriesContentHideOrShow (hidden) {
- for (var i = 0; i < chartMax.series.length; i++) {
- var series = chartMax.series[i];
- if (hidden == true) {
- series.hide();
- } else {
- series.show();
- }
- }
- }
-
- function showTheSeriesElementContentWithIndex (elementIndex) {
- var series = chartMax.series[elementIndex];
- series.show();
- }
-
- function configureTheChartAnimationEasingType (easingType) {
- var animationObject = {
- easeInQuad: function(pos) {
- return Math.pow(pos, 2);
- },
-
- easeOutQuad: function(pos) {
- return -(Math.pow((pos-1), 2) -1);
- },
-
- easeInOutQuad: function(pos) {
- if ((pos/=0.5) < 1) return 0.5*Math.pow(pos,2);
- return -0.5 * ((pos-=2)*pos - 2);
- },
-
- easeInCubic: function(pos) {
- return Math.pow(pos, 3);
- },
-
- easeOutCubic: function(pos) {
- return (Math.pow((pos-1), 3) +1);
- },
-
- easeInOutCubic: function(pos) {
- if ((pos/=0.5) < 1) return 0.5*Math.pow(pos,3);
- return 0.5 * (Math.pow((pos-2),3) + 2);
- },
-
- easeInQuart: function(pos) {
- return Math.pow(pos, 4);
- },
-
- easeOutQuart: function(pos) {
- return -(Math.pow((pos-1), 4) -1);
- },
-
- easeInOutQuart: function(pos) {
- if ((pos/=0.5) < 1) return 0.5*Math.pow(pos,4);
- return -0.5 * ((pos-=2)*Math.pow(pos,3) - 2);
- },
-
- easeInQuint: function(pos) {
- return Math.pow(pos, 5);
- },
-
- easeOutQuint: function(pos) {
- return (Math.pow((pos-1), 5) +1);
- },
-
- easeInOutQuint: function(pos) {
- if ((pos/=0.5) < 1) return 0.5*Math.pow(pos,5);
- return 0.5 * (Math.pow((pos-2),5) + 2);
- },
-
- easeInSine: function(pos) {
- return -Math.cos(pos * (Math.PI/2)) + 1;
- },
-
- easeOutSine: function(pos) {
- return Math.sin(pos * (Math.PI/2));
- },
-
- easeInOutSine: function(pos) {
- return (-0.5 * (Math.cos(Math.PI*pos) -1));
- },
-
- easeInExpo: function(pos) {
- return (pos===0) ? 0 : Math.pow(2, 10 * (pos - 1));
- },
-
- easeOutExpo: function(pos) {
- return (pos===1) ? 1 : -Math.pow(2, -10 * pos) + 1;
- },
-
- easeInOutExpo: function(pos) {
- if (pos===0) return 0;
- if (pos===1) return 1;
- if ((pos/=0.5) < 1) return 0.5 * Math.pow(2,10 * (pos-1));
- return 0.5 * (-Math.pow(2, -10 * --pos) + 2);
- },
-
- easeInCirc: function(pos) {
- return -(Math.sqrt(1 - (pos*pos)) - 1);
- },
-
- easeOutCirc: function(pos) {
- return Math.sqrt(1 - Math.pow((pos-1), 2));
- },
-
- easeInOutCirc: function(pos) {
- if ((pos/=0.5) < 1) return -0.5 * (Math.sqrt(1 - pos*pos) - 1);
- return 0.5 * (Math.sqrt(1 - (pos-=2)*pos) + 1);
- },
-
- easeOutBounce: function(pos) {
- if ((pos) < (1/2.75)) {
- return (7.5625*pos*pos);
- } else if (pos < (2/2.75)) {
- return (7.5625*(pos-=(1.5/2.75))*pos + 0.75);
- } else if (pos < (2.5/2.75)) {
- return (7.5625*(pos-=(2.25/2.75))*pos + 0.9375);
- } else {
- return (7.5625*(pos-=(2.625/2.75))*pos + 0.984375);
- }
- },
-
- easeInBack: function(pos) {
- var s = 1.70158;
- return (pos)*pos*((s+1)*pos - s);
- },
-
- easeOutBack: function(pos) {
- var s = 1.70158;
- return (pos=pos-1)*pos*((s+1)*pos + s) + 1;
- },
-
- easeInOutBack: function(pos) {
- var s = 1.70158;
- if ((pos/=0.5) < 1) return 0.5*(pos*pos*(((s*=(1.525))+1)*pos -s));
- return 0.5*((pos-=2)*pos*(((s*=(1.525))+1)*pos +s) +2);
- },
-
- elastic: function(pos) {
- return -1 * Math.pow(4,-8*pos) * Math.sin((pos*6-1)*(2*Math.PI)/2) + 1;
- },
-
- swingFromTo: function(pos) {
- var s = 1.70158;
- return ((pos/=0.5) < 1) ? 0.5*(pos*pos*(((s*=(1.525))+1)*pos - s)) :
- 0.5*((pos-=2)*pos*(((s*=(1.525))+1)*pos + s) + 2);
- },
-
- swingFrom: function(pos) {
- var s = 1.70158;
- return pos*pos*((s+1)*pos - s);
- },
-
- swingTo: function(pos) {
- var s = 1.70158;
- return (pos-=1)*pos*((s+1)*pos + s) + 1;
- },
-
- bounce: function(pos) {
- if (pos < (1/2.75)) {
- return (7.5625*pos*pos);
- } else if (pos < (2/2.75)) {
- return (7.5625*(pos-=(1.5/2.75))*pos + 0.75);
- } else if (pos < (2.5/2.75)) {
- return (7.5625*(pos-=(2.25/2.75))*pos + 0.9375);
- } else {
- return (7.5625*(pos-=(2.625/2.75))*pos + 0.984375);
- }
- },
-
- bouncePast: function(pos) {
- if (pos < (1/2.75)) {
- return (7.5625*pos*pos);
- } else if (pos < (2/2.75)) {
- return 2 - (7.5625*(pos-=(1.5/2.75))*pos + 0.75);
- } else if (pos < (2.5/2.75)) {
- return 2 - (7.5625*(pos-=(2.25/2.75))*pos + 0.9375);
- } else {
- return 2 - (7.5625*(pos-=(2.625/2.75))*pos + 0.984375);
- }
- },
-
- easeFromTo: function(pos) {
- if ((pos/=0.5) < 1) return 0.5*Math.pow(pos,4);
- return -0.5 * ((pos-=2)*Math.pow(pos,3) - 2);
- },
-
- easeFrom: function(pos) {
- return Math.pow(pos,4);
- },
-
- easeTo: function(pos) {
- return Math.pow(pos,0.25);
- }
- }
-
- return animationObject[easingType];
- }
-
- </script>
- </body>
- </html>
|