vue实现多个气象玫瑰图画法。

隐含

于 2024-06-04 15:55:33 发布

阅读量183

点赞数 1

文章标签： javascript

本文链接：https://blog.csdn.net/u010782109/article/details/139444929

版权

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			.frame {
				fill: none;
				stroke: #000;
			}
			
			.axis text {
				font: 10px sans-serif;
			}
			
			.axis line,
			.axis circle {
				fill: none;
				stroke: #000;
				stroke-dasharray: 4;
			}
			
			.axis:last-of-type circle {
				stroke: #000;
				stroke-dasharray: none;
			}
			
			.line {
				fill: none;
				stroke: #000;
				stroke-width: 3px;
			}
			
			svg {
				opacity: 1;
				filter: alpha(opacity=100);
			}
		</style>
	</head>

	<body>
       <div id="app" style="margin: 0px;padding: 0px; height: calc(100vh - 20px); display: grid; grid-template-columns:repeat(3,1fr) ; " >
			<div class="zuobiao" v-for="(item,index) in items" style="padding: 40px calc((100vw - 1300px)/6); min-width: 400px; " >
				<canvas :id="'canvas'+index"  style="z-index: 9920; opacity:1; position: absolute; flex: 2;  ">  </canvas>
				<canvas :id="'canvas2'+(index+1)"  width="400px" height="324px" style=" z-index: 199; position: absolute;  ">  </canvas>
				<div style="height: 0px;top:310px; z-index: 10; text-align: center;position: relative; ">{{item.name}}&emsp;&emsp;&emsp;</div>
			</div>
       </div>
		<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

		<script>
			var width = 380,  //图形的宽度
				height = 300; //图形的高度
		</script>
		<script src="js/vueWeathermapIDW.js"></script>


       <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>


		<script>
			var colorarray = ["#0000FF", "#006EFF", "#00DDFF", "#2AFFFF", "#68FFFF", "#8BFFE8", "#06FF0B", "#49FF7A", "#49FF00", "#9BFF00", "#D2FF00", "#E3FF00", "#F3FF00", "#FFF200", "#FFCB00", "#FFA300", "#FF7D00", "#FF5300", "#FF5300", "#FF0000"];
			var namearray = [100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 1700, 1800, 1900, 2000];
			
//			var colorarray = ["#0000FF", "#006EFF", "#00DDFF"];
//			var namearray = [100, 200, 300];
			
			
			
var table = [{
    colorarray : ["#0000FF", "#006EFF", "#00DDFF", "#2AFFFF", "#68FFFF", "#8BFFE8"],
    namearray :[100, 200, 300, 400, 500, 600],
    name: "PM2.5",
    "WS": [2.0, 4.0, 2.0, 1.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [10.0, 350.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [183.2, 173.4, 194.0, 175.75, 203.6, 161.2, 142.0, 163.0, 175.5, 208.4, 205.0, 171.2, 143.6, 116.0, 110.6, 93.2, 98.2, 91.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
},
    {
        colorarray: [ "#49FF7A", "#49FF00", "#9BFF00", "#D2FF00", "#E3FF00", "#FF5300", "#FF0000"],
        namearray: [ 1200, 1300, 1400, 1500, 1600, 1700, 1800],

    name: "PM1XX",
    "WS": [30.0, 30.0, 30.0, 30.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [0.0, 90.0, 180.0, 270.0, 359.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [183.2, 173.4, 194.0, 175.75, 203.6, 161.2, 142.0, 163.0, 175.5, 208.4, 205.0, 171.2, 143.6, 116.0, 110.6, 93.2, 98.2, 91.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
    }, {
        colorarray: ["#0000FF", "#006EFF", "#00DDFF", "#2AFFFF", "#68FFFF", "#8BFFE8", "#06FF0B", "#49FF7A", "#49FF00", "#9BFF00", "#D2FF00", "#E3FF00", "#F3FF00", "#FFF200", "#FFCB00", "#FFA300", "#FF7D00", "#FF5300", "#FF5300", "#FF0000"],
        namearray: [100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 1700, 1800, 1900, 2000],

    name: "SO2",
    "WS": [15.0, 4.0, 2.0, 1.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [90.0, 350.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [183.2, 173.4, 194.0, 175.75, 203.6, 161.2, 142.0, 163.0, 175.5, 208.4, 205.0, 171.2, 143.6, 116.0, 110.6, 93.2, 98.2, 91.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
    }, {
        colorarray: ["#0000FF", "#8BFFE8", "#49FF7A", "#D2FF00", "#E3FF00", "#F3FF00", "#FFF200",  "#FFA300", "#FF5300"],
        namearray: [100, 200,  500, 600, 700,  1000, 1100, 1200, 1300, 1400],

    name: "CO2",
    "WS": [4.0, 1.0, 2.0, 1.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [120.0, 350.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [183.2, 173.4, 194.0, 175.75, 203.6, 161.2, 142.0, 163.0, 175.5, 208.4, 205.0, 171.2, 143.6, 116.0, 110.6, 93.2, 98.2, 91.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
    }, {
        colorarray: [ "#9BFF00", "#D2FF00", "#E3FF00", "#F3FF00", "#FFF200", "#FFCB00",  "#FF7D00", "#FF5300", "#FF5300", "#FF0000"],
        namearray: [ 1100, 1200, 1300, 1400, 1500, 1600, 1700, 1800, 1900, 2000],

    name: "O3",
    "WS": [5.0, 4.0, 2.0, 1.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [180.0, 350.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [183.2, 173.4, 194.0, 175.75, 203.6, 161.2, 142.0, 163.0, 175.5, 208.4, 205.0, 171.2, 143.6, 116.0, 110.6, 93.2, 98.2, 91.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
    }, {
        colorarray: [ "#49FF00", "#FFCB00","#FF0000"],
        namearray: [100, 200, 800],

    name: "CO",
    "WS": [6.0, 4.0, 12.0, 1.0, 3.0, 3.0, 3.0, 2.0, 2.0, 1.0, 1.0, 1.0, 3.0, 3.0, 3.0, 2.0, 5.0, 4.0, 6.0, 4.0, 2.0, 1.0, 2.0, 3.0, 3.0, 3.0, 4.0, 3.0, 3.0, 7.0, 6.0, 7.0, 4.0, 8.0, 6.0, 6.0, 7.0, 7.0, 6.0, 8.0, 8.0, 8.0, 7.0, 5.0, 4.0, 3.0, 3.0, 1.0, 2.0, 2.0, 2.0, 2.0],
    "WD": [270.0, 350.0, 20.0, 20.0, 20.0, 20.0, 20.0, 0.0, 0.0, 0.0, 0.0, 0.0, 170.0, 135.0, 135.0, 135.0, 90.0, 90.0, 90.0, 90.0, 100.0, 80.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 10.0, 0.0, 20.0, 30.0, 45.0, 45.0, 45.0, 80.0, 45.0, 45.0, 75.0, 45.0, 45.0, 45.0, 60.0, 45.0, 70.0, 80.0, 90.0, 225.0, 270.0, 260.0, 225.0],
    "value": [70.2, 73.4, 94.0, 75.75, 3.6, 61.2, 42.0, 13.0, 15.5, 28.4, 5.0, 11.2, 13.6, 16.0, 10.6, 3.2, 8.2, 9.8, 83.6, 88.4, 81.4, 77.0, 81.8, 89.4, 115.8, 131.2, 166.4, 174.0, 170.2, 152.4, 184.4, 203.8, 212.6, 627.8, 1290.4, 1581.25, 1711.525, 1841.8, 2128.4, 2406.8, 2576.8, 2035.6, 1615.0, 1286.8, 1202.4, 1015.2, 733.8, 635.6, 339.2, 331.4, 303.2, 282.6]
}]

           $(document).ready(function() {
			
			});
			
			 function hzcanvas(name1,name2,index){
			 	
			 	var Legend = {
			        "DistanceLeft": width,
			        "With": 20,
			        "Height": height,
			        "Colorarray": table[index].colorarray,
			        "Namearray": table[index].namearray
			    };
				zzb(name2, Legend);
			    parm(name1, width, height);
				wwDrawpolygon(table[index]);
				
				//纵坐标
				/**
				 * Name：纵坐标的名称
				 * DistanceTop：距离顶部距离
				 * DistanceLeft：距离左边距距离
				 */
				var OrdinateName = {
					"Name": "风速(m/s)",
					"DistanceTop": 30,
					"DistanceLeft": 10
				};
				/**Scale对象纵坐标标线与刻度
				 * Min:最小值
				 * Max：最大值
				 * Stepnumber：取多少个刻度(步数)
				 * height：圆的高度
				 * DistanceTop：坐标轴距离顶部的距离
				 * DistanceLeft：坐标轴距离左边的距离
				 * FontLeft：坐标轴的字体与纵坐标标线的距离
				 */

				var Scale = {
//					"Min": - Math.max(...table[index].WS),
//					"Max": Math.max(...table[index].WS),
//					"Min": - 15,
//					"Max": 15,
					"Min": -maxvalue,
					"Max": maxvalue,
					"Stepnumber": 10,
					"height": height,
					"DistanceTop": 30,
					"DistanceLeft": 40,
					"FontLeft": 10
				};
				xzb(name2, OrdinateName, Scale);

			 }
		//	var datalength = app.items.length;
					var index = 0;
					var Interval;
			var app = new Vue({
				  el: '#app',
				  data: {
				    items: []
				  },
				  updated: function () {
//					  app.items.map(function(it,index){
//					  	
//					  	  hzcanvas('canvas'+index,'canvas2'+(index+1));
//					  	  
//					  })
					
					 Interval =   setInterval(function(){
					  	
					  	 hzcanvas('canvas'+index,'canvas2'+(index+1),index);
					  	 index++;
					  	 
					  	 if(index >= app.items.length){
						
								clearInterval(Interval);
								
							}
					  	 
					  },0)
					
					  
				  },
				})
			
			app.items = table;
			
		</script>

	</body>

</html>

引入的js文件 vueWeathermapIDW文件

var radius = Math.min(width, height) / 2 - 30;
var canvas;
var canvasID;
var width;
var height;
var maxvalue = 0;
function parm(id, w, h) {
    canvas = document.getElementById(id);
    canvasID = id;
    //		var context = canvas.getContext("2d");
    width = w;
    height = h;
    radius = Math.min(width, height) / 2 - 30;
    //	$("#" + id).height(Math.sqrt(((h - 60) / 2) * ((h - 60) / 2) * 2));
    //	$("#" + id).width(Math.sqrt(((h - 60) / 2) * ((h - 60) / 2) * 2));

    //	var w = ((h - 60) - Math.sqrt(((h - 60) / 2) * ((h - 60) / 2) * 2)) / 2 + 30;
    //	$("#" + id).css({
    //		"margin-top": w + "px"
    //	});
    //	var w = (width - Math.sqrt(((h - 60) / 2) * ((h - 60) / 2) * 2)) / 2;
    //	$("#" + id).css({
    //		"margin-left": w + "px"
    //	});

    $("#" + id).height(h - 60);
    $("#" + id).width(h - 60);
    $("#" + id).css({
        "margin-top": 30 + "px"
    });
    var w = (width - (h - 60)) / 2;
    $("#" + id).css({
        "margin-left": w + "px"
    });

}
/**
 * canvas1:canvas的id
 * @param {Object} Legend
 *  DistanceLeft：距离左边的距离
 *  With：单位图例高度
 *  Height：单位图例高度
 *  Colorarray：颜色设定值 数据类型 -数组（Array）
 *  Namearray：颜色块儿对应的名称 数据类型 -数组（Array）
 */
function zzb(canvas1, Legend) {
    colorarray = Legend.Colorarray;
    namearray = Legend.Namearray;
    Legend.Height = (Legend.Height / (Legend.Colorarray.length + 2));
    Legend.DistanceLeft = Legend.DistanceLeft - 30
    var canvas1 = document.getElementById(canvas1);
    var canvasWidth1 = canvas1.width;
    var canvasHeight1 = canvas1.height;
    var context1 = canvas1.getContext("2d");

    for (var i = 0; i < Legend.Colorarray.length; i++) {
        var my_gradient = context1.createLinearGradient(0, 0, 0, Legend.Height);
        if (i != 0) {
            my_gradient.addColorStop(0, Legend.Colorarray[Legend.Colorarray.length - i]);
            my_gradient.addColorStop(1, Legend.Colorarray[Legend.Colorarray.length - i - 1]);
            context1.fillStyle = my_gradient;
            context1.fillRect(Legend.DistanceLeft * 1, Legend.Height * (i + 1), Legend.With, Legend.Height);
            context1.strokeStyle = "#000000";
            context1.strokeRect(Legend.DistanceLeft * 1, Legend.Height * (i + 1), Legend.With, Legend.Height);
            context1.fillStyle = "#000000";
            context1.font = "11px Arial";
            context1.fillText(Legend.Namearray[Legend.Namearray.length - i - 1], Legend.DistanceLeft + Legend.With + 5, Legend.Height * (i + 1) + Legend.Height * 2 / 3);

        } else {
            my_gradient.addColorStop(0, Legend.Colorarray[Legend.Colorarray.length - i - 1]);
            my_gradient.addColorStop(1, Legend.Colorarray[Legend.Colorarray.length - i - 1]);
            context1.fillStyle = my_gradient;
            context1.fillRect(Legend.DistanceLeft, Legend.Height * (i + 1), Legend.With, Legend.Height);
            context1.strokeStyle = "#000000";
            context1.lineHeight = Legend.Height;
            context1.strokeRect(Legend.DistanceLeft, Legend.Height * (i + 1), Legend.With, Legend.Height);
            context1.fillStyle = "#000000";
            context1.font = "11px Arial";
            context1.fillText(Legend.Namearray[Legend.Namearray.length - 1], Legend.DistanceLeft + Legend.With + 5, Legend.Height * (i + 1) + Legend.Height * 2 / 3);

        }
    }

}
/**
 * @param {Object} OrdinateName 纵坐标标题
 * Name：纵坐标的名称
 * DistanceTop：距离顶部距离
 * DistanceLeft：距离左边距距离
 * @param {Object} Scale 纵坐标刻度
 * Min:最小值
 * Max：最大值
 * Stepnumber：取多少个刻度(步数)
 * Step：单位刻度的长度(步长)
 * DistanceTop：坐标轴距离顶部的距离
 * DistanceLeft：坐标轴距离左边的距离
 * DistanceLeft：坐标轴距离左边的距离
 */
function xzb(canvas1, OrdinateName, Scale) {
    var Step = (Scale.height - 60) / Scale.Stepnumber;
    var canvas1 = document.getElementById(canvas1);
    var canvasWidth1 = canvas1.width;
    var canvasHeight1 = canvas1.height;
    var context1 = canvas1.getContext("2d");
    if ((OrdinateName == "") && (OrdinateName == null))
        OrdinateName = {
            "Name": "风速(m/s)",
            "DistanceTop": 200,
            "DistanceLeft": 10
        };
    if ((Scale == "") && (Scale == null))
        Scale = {
            "Min": -10,
            "Max": 10,
            "Stepnumber": 20,
            "Step": 17,
            "DistanceTop": 30,
            "DistanceLeft": 40,
            "FontLeft": 10
        };

    var Stepname = ((Scale.Max - Scale.Min) / Scale.Stepnumber).toFixed();
    context1.fillStyle = "#000000";

    for (var i = 0; i < (Scale.Stepnumber + 1); i++) {

        if (i != 0) {
            context1.fillRect(Scale.DistanceLeft, Step * (i + 1) + (Scale.DistanceTop - Step), 7, 1);
            context1.font = "11px Arial";
            context1.textAlign = "right";
            context1.fillText(Scale.Min + (Scale.Stepnumber - i) * Stepname, Scale.DistanceLeft - Scale.FontLeft, Step * (i + 1) + (Scale.DistanceTop + 5 - Step));
        } else {
            context1.fillRect(Scale.DistanceLeft, Step * (i + 1) + (Scale.DistanceTop - Step), 7, 1);
            context1.font = "11px Arial";
            context1.textAlign = "right";
            context1.fillText(Scale.Min + (Scale.Stepnumber - i) * Stepname, Scale.DistanceLeft - Scale.FontLeft, Step * (i + 1) + (Scale.DistanceTop + 5 - Step));
        }
    }
    context1.fillRect(Scale.DistanceLeft, Scale.DistanceTop, 1, Step * Scale.Stepnumber);
    context1.font = "12px Arial";
    context1.textAlign = "center";

    var DistanceTop = (Scale.height - 60) / 2;
    context1.translate(OrdinateName.DistanceLeft, DistanceTop + OrdinateName.DistanceTop);
    context1.rotate(270 * Math.PI / 180)
    context1.fillText(OrdinateName.Name, 0, 0);

}
var zuobiaoname = ['北', '东北', '东', '东南', '南', '西南', '西', '西北',]

// console.log($(".zuobiao").Width))

var data = [
    [24, 100]
]

var y = _.map(data, _.last);
var max = Math.max.apply(null, y);
max = Math.ceil(max * 10) / 10;

var angle = d3.scale.linear()
    .domain([0, 24])
    .range([0, 2 * Math.PI]);

var r = d3.scale.linear()
    .domain([0, max])
    .range([0, radius]);

var svg = d3.select(".zuobiao").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

var gr = svg.append("g")
    .attr("class", "r axis")
    .selectAll("g")
    .data(r.ticks(max * 0.1).slice(1))
    .enter().append("g");

gr.append("circle")
    .attr("r", r);

gr.append("text")
    .attr("y", function (d) {
        return -r(d) - 4;
    })
    .attr("transform", "rotate(20)")
    .style("text-anchor", "middle")
    .text(function (d) {
        return d + "%";
    });

var ga = svg.append("g")
    .attr("class", "a axis")
    .selectAll("g")
    .data(d3.range(-90, 270, 45))
    .enter().append("g")
    .attr("transform", function (d) {
        return "rotate(" + d + ")";
    });

ga.append("line")
    .attr("x2", radius);

ga.append("text")
    .attr("x", radius + 6)
    .attr("dy", ".35em")
    .style("text-anchor", function (d) {
        return d < 270 && d > 90 ? "end" : null;

    })
    .attr("transform", function (d) {
        //console.log(d)
        if (d < 270 && d > 90)
            return d < 270 && d > 90 ? "rotate(180 " + (radius + 6) + ",0)" : null;
        if (d == 90)
            return "rotate(270 " + (radius + 6) + ",5)";
        if (d == -90)
            return "rotate(90 " + (radius + 6) + ",-5)";
    })
    .attr("y", function (d) {
        if (d == 90)
            return "12";
        if (d == -90)
            return "-12";
    })

    .text(function (d, i) {
        return zuobiaoname[i]
    });

var color = d3.scale.category20();

function windrose2polar(a) {

    var d = [];
    for (var i = 0; i < a.length; i++) {
        var r = 360 - a[i] + 90;
        if (r > 360) {
            r = r - 360;
        }
        d.push(r)
    }
    return d;
}

function linspace(a, b, c) { //生成等差数列
    var d = (b - a) / (c - 1);
    var e = ((b - a) / d) + 1;
    var f = [];
    for (var i = 0; i < e; i++) {
        f.push(a + (d * i));
    }
    return f;
}

function radians(a) { //将角度转换为弧度
    var d = [];
    for (var i = 0; i < a.length; i++) {
        var rwd = (a[i] * Math.PI) / 180;
        d.push(rwd)
    }
    return d;
}

function degrees(a) {
    var d = [];
    for (var i = 0; i < a.length; i++) {
        var dwdbins = (a[i] * 180) / Math.PI;
        d.push(dwdbins)
    }
    return d;
}

function histogram(a, wdbins) {
    var numarry = [];
    for (var i = 0; i < wdbins.length - 1; i++) {
        var num = 0;
        for (var y = 0; y < a.length; y++) {
            if ((a[y] > wdbins[i]) && (a[y] < wdbins[i + 1])) {
                num++;
            }
        }
        numarry.push(num);
    }
    return numarry;
}

function pol2cartcos(rwd, ws) {
    var cos = [];
    for (var i = 0; i < rwd.length; i++) {
        cos.push(ws[i] * Math.cos(rwd[i]))

        //					cos.push(Math.sqrt(rwd[i]*rwd[i] + ws[i]*ws[i] ));
    }
    return cos;
}

function pol2cartsin(rwd, ws) {
    var sin = [];
    for (var i = 0; i < rwd.length; i++) {
        sin.push(ws[i] * Math.sin(rwd[i]))
    }
    return sin;

}

// 可以借助cos a 在0-180之间，单调递减！！！
// 这里用的是叉积，正弦的判断
function multiply(p0, p1, p2) {
    return ((p1.x - p0.x) * (p2.y - p0.y) - (p2.x - p0.x) * (p1.y - p0.y));
}

function distance_no_sqrt(p1, p2) {
    //return(sqrt((p1.x-p2.x)*(p1.x-p2.x)+(p1.y-p2.y)*(p1.y-p2.y))); 
    return ((p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y));
}

function Graham_scan(pointSet, ch, n) {
    var i, j, k = 0,
        top = 2;
    var tmp = new Object();
    for (i = 1; i < n; i++) {
        if ((pointSet[i].y < pointSet[k].y) || ((pointSet[i].y == pointSet[k].y) && (pointSet[i].x < pointSet[k].x))) {
            k = i;
        }
    }

    tmp = pointSet[0];
    pointSet[0] = pointSet[k];
    pointSet[k] = tmp;

    var use = n;
    for (i = 1; i < use - 1; i++) {
        k = i;
        for (j = i + 1; j < use; j++) {
            var direct = multiply(pointSet[0], pointSet[k], pointSet[j]);
            if (direct > 0) {
                k = j;
            } else if (direct == 0) {
                // k j 同方向
                var dis = distance_no_sqrt(pointSet[0], pointSet[j]) - distance_no_sqrt(pointSet[0], pointSet[k]);
                use--; // 也就是不要了
                if (dis > 0) {
                    // 保留j
                    // 把 k 就不要了
                    pointSet[k] = pointSet[j];
                    pointSet[j] = pointSet[use];
                    j--;
                } else {
                    tmp = pointSet[use];
                    pointSet[use] = pointSet[j];
                    pointSet[j] = tmp;
                }
            }
        }
        tmp = pointSet[i];
        pointSet[i] = pointSet[k];
        pointSet[k] = tmp;
    }

    ch.push(pointSet[0]);
    ch.push(pointSet[1]);
    ch.push(pointSet[2]);
    for (i = 3; i < use; i++) {
        while (!(multiply(pointSet[i], ch[top - 1], ch[top]) < 0)) {
            top--;
            ch.pop();
        }
        top++;
        ch.push(pointSet[i]);
    }

}

function drawCities(p) {
    for (var i = 0; i < p.length; i++) {
        // console.log(p[i].x + "-----" + p[i].y)

    }
}

function convexhull(rwdc, wsc) {
    var n = rwdc.length;
    var p = new Array(n);
    for (var i = 0; i < rwdc.length; i++) {
        p[i] = new Object();
        p[i].x = rwdc[i];
        p[i].y = wsc[i];
    }
    var res = new Array();
    Graham_scan(p, res, n);
    drawCities(res);
    return res;

}

function sortNumber(a, b) {
    return a - b
}
var ws = [];
var wd = [];
var pm10 = [];
var N = 0;

function wwDrawpolygon(table) {
    maxvalue = 0;
    ws = table.WS;
    wd = table.WD;
    pm10 = table.value;
    N = ws.length;

    var rwd = windrose2polar(wd); //从风玫瑰坐标转换为极坐标
    rwd = radians(rwd) //将角度转换为弧度

    var wdbins = linspace(0.0, Math.PI * 2, 9); //生成等差数列	
    var dwdbins = degrees(wdbins) // 将弧度转换成角度
    dwdbins = windrose2polar(dwdbins);
    var rwdbins = radians(dwdbins);
    var wdN = wdbins.length - 1;
    var theta = [];
    theta = rwdbins;
    theta[wdN] = theta[0];

    for (var i = 0; i < wd.length; i++) {
        wd[i] = wd[i] + (360 / wdN) / 2;
    }
    for (var i = 0; i < wd.length; i++) {
        if (wd[i] > 360) {
            wd[i] = wd[i] - 360;
        }
    }
    var wdhist = histogram(radians(wd), wdbins);
    for (var i = 0; i < wdhist.length; i++) {
        wdhist[i] = wdhist[i] / N;
    }
    var nwdhist = wdhist;
    nwdhist.push(nwdhist[0]);
    var rwdc = pol2cartcos(rwd, ws); //极坐标转换为笛卡尔坐标
    var wwrwdc = rwdc;
    var wsc = pol2cartsin(rwd, ws);
    var wwwsc = wsc;
    var poly = convexhull(rwdc, wsc) //计算凸包
    var dd = 0.5;

    var minX = 0,
        maxX = 0,
        minY = 0,
        maxY = 0;

    for (var i = 0; i < rwdc.length; i++) {
        if (minX > rwdc[i]) {
            minX = rwdc[i];
        }
        if (maxX < rwdc[i]) {
            maxX = rwdc[i];
        }
    }
    for (var i = 0; i < wsc.length; i++) {
        if (minY > wsc[i]) {
            minY = wsc[i];
        }
        if (maxY < wsc[i]) {
            maxY = wsc[i];
        }
    }

    var fn = new MapIDW();
    var datas = [];

    for (var i = 0; i < rwdc.length; i++) {
        datas.push({
            "x": wwrwdc[i] * 1,
            "y": wwwsc[i] * 1,
            "v": pm10[i],
        })

    }

    if (maxvalue < Math.abs(minX)) {
        maxvalue = Math.abs(minX);
    }
    if (maxvalue < Math.abs(minY)) {
        maxvalue = Math.abs(minY);
    }
    if (maxvalue < Math.abs(maxX)) {
        maxvalue = Math.abs(maxX);
    }
    if (maxvalue < Math.abs(maxY)) {
        maxvalue = Math.abs(maxY);
    }
    var num = parseInt(maxvalue / 5);
    var numol = maxvalue % 5;

    if (numol > 0) {
        maxvalue = num * 5 + 5;
    } else {
        maxvalue = num * 5;
    }

    console.log(maxvalue);
    $("#" + canvasID).height((height - 60) * ((maxY - minY) / (maxvalue * 2)));
    $("#" + canvasID).width((height - 60) * ((maxX - minX) / (maxvalue * 2)));
    //var top = (height - 60) / 2 * ((10 - maxY) / maxvalue)
    var top = (height - 60) / 2 * ((maxvalue - maxY) / maxvalue)

    $("#" + canvasID).css({
        "margin-top": (30 + top) + "px"
    });
    var w = (width - (height - 60)) / 2;
    var left = (height - 60) / 2 * ((minX + maxvalue) / maxvalue)
    $("#" + canvasID).css({
        "margin-left": (w + left) + "px"
    });

    var points = fn.getTrainPonits(datas, 1, minX, maxX, minY, maxY, 25000, poly);
    fn.draw(canvas, points, colorarray, namearray, function (v) {

        for (var i = 0; i < colorarray.length; i++) {
            if (i == 0) {
                if (v < namearray[i]) {
                    return colorarray[i];
                }
            } else if ((i < (colorarray.length - 2)) && (i != 0)) {
                if ((v > namearray[i - 1]) && (v < namearray[i])) {
                    return colorarray[i];
                }
            } else if (i == (colorarray.length - 1)) {
                if ((v > namearray[i])) {
                    return colorarray[i];
                }
            }
        };

    });

}

//worker 内容
function MapIDW() {

    /**
     * 反向距离权重法模拟点位
     * @param {Object} datas 原始数据
     * @param {Object} minlon 经度边界
     * @param {Object} maxlon 经度边界
     * @param {Object} minlat 纬度边界
     * @param {Object} maxlat 纬度边界
     * @param {Object} num 生成点数
     * @param {Object} isRange 判断点是否在范围内，在则显示，否则抛弃
     */
    this.getTrainPonits = function (datas, weight, minlon, maxlon, minlat, maxlat, num, polygon) {
        var deltx = maxlon - minlon;
        var delty = maxlat - minlat;

        var b = deltx / delty;
        var numy = Math.floor(Math.sqrt(num / b), 0)
        var numx = Math.floor(b * Math.sqrt(num / b), 0)

        var wx = deltx / numx;
        var wy = delty / numy;
        var result = [];
        for (var j = 0; j < numy; j++) {
            for (var i = 0; i < numx; i++) {
                var tempx = minlon + i * wx;
                var tempy = minlat + j * wy;
                if (!isRange(tempx, tempy, polygon)) {
                    continue;
                }
                result.push({
                    x: tempx,
                    y: tempy,
                    v: 0,
                    id: i + ":" + j
                })
            }
        }
        var isallOffline = true; //站点如果全部离线，值都置为-1，地图用灰色显示
        datas.forEach(function (d, index) {
            if (!d.v) {
                return;
            }
            isallOffline = false;
        })
        if (isallOffline) {
            console.log("无值！");
        }

        var maxdis = Math.sqrt(Math.pow(Math.abs(maxlon - minlon), 2) + Math.pow(Math.abs(maxlat - minlat), 2));
        result = result.map(function (r) {
            if (isallOffline) {
                r.v = -1
                return r;
            }
            var v = 0;
            var n = 0;
            var disLimit = maxdis / (20);
            var blog = false; // r.id == "6:4";
            if (blog) {
                //	console.log(r)
            }
            var fenmu = 0;
            datas.forEach(function (d, index) {
                if (!d.v) { //站点无值，则不参与运算
                    return;
                }
                var dis = Math.sqrt(Math.pow(Math.abs(r.x - d.x), 2) + Math.pow(Math.abs(d.y - r.y), 2));
                d.dis = dis;
                fenmu += Math.pow((1 / dis), 2 * weight);
            })
            r.v = 0;
            for (var i = 0; i < datas.length; i++) {
                var d = datas[i]
                if (!d.v) {
                    continue;
                }
                d.weight = Math.pow((1 / d.dis), 2 * weight) / fenmu;
                r.v += d.v * d.weight;
                //	console.log(r.v);
            }

            if (blog) {
                console.log(r);
            }
            return r
        })

        this.numy = numy;
        this.numx = numx;
        this.deltx = deltx;
        this.delty = delty;
        this.minlon = minlon;
        this.minlat = minlat;
        this.maxlon = maxlon;
        this.maxlat = maxlat;
        this.resultPoints = result;
        return result;
    }

    this.draw = function (canvas, points, Colorarray, Namearray, getColorFuc) {
        var ctx = canvas.getContext("2d");
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        ctx.globalAlpha = 1;
        var wx = canvas.width / this.numx;
        var wy = canvas.height / this.numy;
        for (var i = 0; i < points.length; i++) {
            var x = (points[i].x - this.minlon) * canvas.width / this.deltx;
            var y = canvas.height - (points[i].y - this.minlat) * canvas.height / this.delty;
            var temp = points[i].v;
            ctx.fillStyle = getColorFuc(temp);
            ctx.fillRect(x - wx / 2, y - wy / 2, wx, wy);
        }
    }

    this.drawSelf = function (canvas, getColorFuc) {
        this.draw(canvas, this.resultPoints, getColorFuc);
    }

    this.getDataUrlSelf = function (getColorFuc) {
        var canvas = document.createElement("canvas");
        canvas.style.background = "transparent";
        canvas.width = 500;
        canvas.height = 500 * (this.maxlat - this.minlat) / (this.maxlon - this.minlon) * 1.13;
        this.drawSelf(canvas, getColorFuc);
        //图片展示的 data URI
        var dataUrl = canvas.toDataURL();
        return dataUrl;
    }

    this.getDataUrl = function (points, getColorFuc) {
        var canvas = document.createElement("canvas");
        canvas.style.background = "transparent";
        canvas.width = 500;
        canvas.height = 500 * (this.maxlat - this.minlat) / (this.maxlon - this.minlon) * 1.13;
        this.draw(canvas, points, getColorFuc);
        //图片展示的 data URI
        var dataUrl = canvas.toDataURL();
        return dataUrl;
    }

    //定义点的结构体
    function Point(x, y) {
        this.y = y;
        this.x = x;
    }
    //计算一个点是否在多边形里,参数:点,多边形数组

    function PointInPoly(pt, poly) {
       // console.log(2)
        for (var c = false, i = -1, l = poly.length, j = l - 1; ++i < l; j = i)

            //		((poly[i].x <= pt.x && pt.x < poly[j].x) || (poly[j].x <= pt.x && pt.x < poly[i].x))&& 
            //		(pt.y < (poly[j].y - poly[i].y) * (pt.x - poly[i].x) / (poly[j].x - poly[i].x) + poly[i].y)&&
            //		(c = !c);
            //		return c;


            for (var c = false, i = -1, l = poly.length, j = l - 1; ++i < l; j = i) {
                if ((poly[i].x <= pt.x && pt.x < poly[j].x) || (poly[j].x <= pt.x && pt.x < poly[i].x)) {
                    if (pt.y < (poly[j].y - poly[i].y) * (pt.x - poly[i].x) / (poly[j].x - poly[i].x) + poly[i].y) {
                        (c = !c)
                    }
                }
            }

        return c;


    }

    function isRange(x, y, polygon) {

        var p = new Point(x, y)
        return PointInPoly(p, polygon);
    }
}
var colorarray = [];
var namearray = [];
var colorArray = ["#00e400", "#ffff00", "#ff7e00", "#ff0000", "#99004c", "#7e0023"];
var colorchild = {
    "1": ['#2be900', '#55ed00', '#80f200', '#aaf600', '#d5fb00', "#ffff00"],
    "2": ['#ffea00', '#ffd400', '#ffbf00', '#ffa900', '#ff9400', "#ff7e00"],
    "3": ['#ff6900', '#ff5400', '#ff3f00', '#ff2a00', '#ff1500', "#ff0000"],
    "4": ['#ee000d', '#dd0019', '#cc0026', '#bb0033', '#aa003f', "#99004c"],
    "5": ['#950045', '#90003e', '#8c0038', '#870031', '#83002a', "#7e0023"]
}

var paraLevelRange = {
    'PM25': [0, 35, 75, 115, 150, 250, 500],
    'PM10': [0, 50, 150, 250, 350, 420, 600],
    'PM2.5': [0, 35, 75, 115, 150, 250, 500],
    'SO2': [0, 150, 500, 650, 800],
    'NO2': [0, 100, 200, 700, 1200, 2340, 3840],
    'CO': [0, 5, 10, 35, 60, 90, 150],
    'O3': [0, 160, 200, 300, 400, 800, 1200],
    'AQI': [0, 50, 100, 150, 200, 300, 500],
    'AQI': [0, 50, 100, 150, 200, 300, 500],
    'TVOC': [0, 60, 100, 200, 300, 500]
};

function getColorFuc(value) {
    if (value < 0) {
        return "gray";
    }
    let id = 0;
    var paraname = "NO2"
    for (let i = 1; i < paraLevelRange[paraname].length; i++) {
        if (value < paraLevelRange[paraname][i]) {
            id = i - 1;
            break;
        }
        if (i == paraLevelRange[paraname].length - 1) {
            id = i - 1;
        }
    }
    if (id > 0) {
        let max = paraLevelRange[paraname][id + 1];
        let min = paraLevelRange[paraname][id];
        let childColor = colorchild['' + id];
        let ci = Math.floor((value - min) * 6 / (max - min));
        return childColor[ci];
    }
    return colorArray[id];
}

var idw = new MapIDW();

引入的js文件 d3.min.js文件

引入的js文件 underscore.js文件

//     Underscore.js 1.8.3
//     http://underscorejs.org
//     (c) 2009-2015 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
//     Underscore may be freely distributed under the MIT license.
(function(){function n(n){function t(t,r,e,u,i,o){for(;i>=0&&o>i;i+=n){var a=u?u[i]:i;e=r(e,t[a],a,t)}return e}return function(r,e,u,i){e=b(e,i,4);var o=!k(r)&&m.keys(r),a=(o||r).length,c=n>0?0:a-1;return arguments.length<3&&(u=r[o?o[c]:c],c+=n),t(r,e,u,o,c,a)}}function t(n){return function(t,r,e){r=x(r,e);for(var u=O(t),i=n>0?0:u-1;i>=0&&u>i;i+=n)if(r(t[i],i,t))return i;return-1}}function r(n,t,r){return function(e,u,i){var o=0,a=O(e);if("number"==typeof i)n>0?o=i>=0?i:Math.max(i+a,o):a=i>=0?Math.min(i+1,a):i+a+1;else if(r&&i&&a)return i=r(e,u),e[i]===u?i:-1;if(u!==u)return i=t(l.call(e,o,a),m.isNaN),i>=0?i+o:-1;for(i=n>0?o:a-1;i>=0&&a>i;i+=n)if(e[i]===u)return i;return-1}}function e(n,t){var r=I.length,e=n.constructor,u=m.isFunction(e)&&e.prototype||a,i="constructor";for(m.has(n,i)&&!m.contains(t,i)&&t.push(i);r--;)i=I[r],i in n&&n[i]!==u[i]&&!m.contains(t,i)&&t.push(i)}var u=this,i=u._,o=Array.prototype,a=Object.prototype,c=Function.prototype,f=o.push,l=o.slice,s=a.toString,p=a.hasOwnProperty,h=Array.isArray,v=Object.keys,g=c.bind,y=Object.create,d=function(){},m=function(n){return n instanceof m?n:this instanceof m?void(this._wrapped=n):new m(n)};"undefined"!=typeof exports?("undefined"!=typeof module&&module.exports&&(exports=module.exports=m),exports._=m):u._=m,m.VERSION="1.8.3";var b=function(n,t,r){if(t===void 0)return n;switch(null==r?3:r){case 1:return function(r){return n.call(t,r)};case 2:return function(r,e){return n.call(t,r,e)};case 3:return function(r,e,u){return n.call(t,r,e,u)};case 4:return function(r,e,u,i){return n.call(t,r,e,u,i)}}return function(){return n.apply(t,arguments)}},x=function(n,t,r){return null==n?m.identity:m.isFunction(n)?b(n,t,r):m.isObject(n)?m.matcher(n):m.property(n)};m.iteratee=function(n,t){return x(n,t,1/0)};var _=function(n,t){return function(r){var e=arguments.length;if(2>e||null==r)return r;for(var u=1;e>u;u++)for(var i=arguments[u],o=n(i),a=o.length,c=0;a>c;c++){var f=o[c];t&&r[f]!==void 0||(r[f]=i[f])}return r}},j=function(n){if(!m.isObject(n))return{};if(y)return y(n);d.prototype=n;var t=new d;return d.prototype=null,t},w=function(n){return function(t){return null==t?void 0:t[n]}},A=Math.pow(2,53)-1,O=w("length"),k=function(n){var t=O(n);return"number"==typeof t&&t>=0&&A>=t};m.each=m.forEach=function(n,t,r){t=b(t,r);var e,u;if(k(n))for(e=0,u=n.length;u>e;e++)t(n[e],e,n);else{var i=m.keys(n);for(e=0,u=i.length;u>e;e++)t(n[i[e]],i[e],n)}return n},m.map=m.collect=function(n,t,r){t=x(t,r);for(var e=!k(n)&&m.keys(n),u=(e||n).length,i=Array(u),o=0;u>o;o++){var a=e?e[o]:o;i[o]=t(n[a],a,n)}return i},m.reduce=m.foldl=m.inject=n(1),m.reduceRight=m.foldr=n(-1),m.find=m.detect=function(n,t,r){var e;return e=k(n)?m.findIndex(n,t,r):m.findKey(n,t,r),e!==void 0&&e!==-1?n[e]:void 0},m.filter=m.select=function(n,t,r){var e=[];return t=x(t,r),m.each(n,function(n,r,u){t(n,r,u)&&e.push(n)}),e},m.reject=function(n,t,r){return m.filter(n,m.negate(x(t)),r)},m.every=m.all=function(n,t,r){t=x(t,r);for(var e=!k(n)&&m.keys(n),u=(e||n).length,i=0;u>i;i++){var o=e?e[i]:i;if(!t(n[o],o,n))return!1}return!0},m.some=m.any=function(n,t,r){t=x(t,r);for(var e=!k(n)&&m.keys(n),u=(e||n).length,i=0;u>i;i++){var o=e?e[i]:i;if(t(n[o],o,n))return!0}return!1},m.contains=m.includes=m.include=function(n,t,r,e){return k(n)||(n=m.values(n)),("number"!=typeof r||e)&&(r=0),m.indexOf(n,t,r)>=0},m.invoke=function(n,t){var r=l.call(arguments,2),e=m.isFunction(t);return m.map(n,function(n){var u=e?t:n[t];return null==u?u:u.apply(n,r)})},m.pluck=function(n,t){return m.map(n,m.property(t))},m.where=function(n,t){return m.filter(n,m.matcher(t))},m.findWhere=function(n,t){return m.find(n,m.matcher(t))},m.max=function(n,t,r){var e,u,i=-1/0,o=-1/0;if(null==t&&null!=n){n=k(n)?n:m.values(n);for(var a=0,c=n.length;c>a;a++)e=n[a],e>i&&(i=e)}else t=x(t,r),m.each(n,function(n,r,e){u=t(n,r,e),(u>o||u===-1/0&&i===-1/0)&&(i=n,o=u)});return i},m.min=function(n,t,r){var e,u,i=1/0,o=1/0;if(null==t&&null!=n){n=k(n)?n:m.values(n);for(var a=0,c=n.length;c>a;a++)e=n[a],i>e&&(i=e)}else t=x(t,r),m.each(n,function(n,r,e){u=t(n,r,e),(o>u||1/0===u&&1/0===i)&&(i=n,o=u)});return i},m.shuffle=function(n){for(var t,r=k(n)?n:m.values(n),e=r.length,u=Array(e),i=0;e>i;i++)t=m.random(0,i),t!==i&&(u[i]=u[t]),u[t]=r[i];return u},m.sample=function(n,t,r){return null==t||r?(k(n)||(n=m.values(n)),n[m.random(n.length-1)]):m.shuffle(n).slice(0,Math.max(0,t))},m.sortBy=function(n,t,r){return t=x(t,r),m.pluck(m.map(n,function(n,r,e){return{value:n,index:r,criteria:t(n,r,e)}}).sort(function(n,t){var r=n.criteria,e=t.criteria;if(r!==e){if(r>e||r===void 0)return 1;if(e>r||e===void 0)return-1}return n.index-t.index}),"value")};var F=function(n){return function(t,r,e){var u={};return r=x(r,e),m.each(t,function(e,i){var o=r(e,i,t);n(u,e,o)}),u}};m.groupBy=F(function(n,t,r){m.has(n,r)?n[r].push(t):n[r]=[t]}),m.indexBy=F(function(n,t,r){n[r]=t}),m.countBy=F(function(n,t,r){m.has(n,r)?n[r]++:n[r]=1}),m.toArray=function(n){return n?m.isArray(n)?l.call(n):k(n)?m.map(n,m.identity):m.values(n):[]},m.size=function(n){return null==n?0:k(n)?n.length:m.keys(n).length},m.partition=function(n,t,r){t=x(t,r);var e=[],u=[];return m.each(n,function(n,r,i){(t(n,r,i)?e:u).push(n)}),[e,u]},m.first=m.head=m.take=function(n,t,r){return null==n?void 0:null==t||r?n[0]:m.initial(n,n.length-t)},m.initial=function(n,t,r){return l.call(n,0,Math.max(0,n.length-(null==t||r?1:t)))},m.last=function(n,t,r){return null==n?void 0:null==t||r?n[n.length-1]:m.rest(n,Math.max(0,n.length-t))},m.rest=m.tail=m.drop=function(n,t,r){return l.call(n,null==t||r?1:t)},m.compact=function(n){return m.filter(n,m.identity)};var S=function(n,t,r,e){for(var u=[],i=0,o=e||0,a=O(n);a>o;o++){var c=n[o];if(k(c)&&(m.isArray(c)||m.isArguments(c))){t||(c=S(c,t,r));var f=0,l=c.length;for(u.length+=l;l>f;)u[i++]=c[f++]}else r||(u[i++]=c)}return u};m.flatten=function(n,t){return S(n,t,!1)},m.without=function(n){return m.difference(n,l.call(arguments,1))},m.uniq=m.unique=function(n,t,r,e){m.isBoolean(t)||(e=r,r=t,t=!1),null!=r&&(r=x(r,e));for(var u=[],i=[],o=0,a=O(n);a>o;o++){var c=n[o],f=r?r(c,o,n):c;t?(o&&i===f||u.push(c),i=f):r?m.contains(i,f)||(i.push(f),u.push(c)):m.contains(u,c)||u.push(c)}return u},m.union=function(){return m.uniq(S(arguments,!0,!0))},m.intersection=function(n){for(var t=[],r=arguments.length,e=0,u=O(n);u>e;e++){var i=n[e];if(!m.contains(t,i)){for(var o=1;r>o&&m.contains(arguments[o],i);o++);o===r&&t.push(i)}}return t},m.difference=function(n){var t=S(arguments,!0,!0,1);return m.filter(n,function(n){return!m.contains(t,n)})},m.zip=function(){return m.unzip(arguments)},m.unzip=function(n){for(var t=n&&m.max(n,O).length||0,r=Array(t),e=0;t>e;e++)r[e]=m.pluck(n,e);return r},m.object=function(n,t){for(var r={},e=0,u=O(n);u>e;e++)t?r[n[e]]=t[e]:r[n[e][0]]=n[e][1];return r},m.findIndex=t(1),m.findLastIndex=t(-1),m.sortedIndex=function(n,t,r,e){r=x(r,e,1);for(var u=r(t),i=0,o=O(n);o>i;){var a=Math.floor((i+o)/2);r(n[a])<u?i=a+1:o=a}return i},m.indexOf=r(1,m.findIndex,m.sortedIndex),m.lastIndexOf=r(-1,m.findLastIndex),m.range=function(n,t,r){null==t&&(t=n||0,n=0),r=r||1;for(var e=Math.max(Math.ceil((t-n)/r),0),u=Array(e),i=0;e>i;i++,n+=r)u[i]=n;return u};var E=function(n,t,r,e,u){if(!(e instanceof t))return n.apply(r,u);var i=j(n.prototype),o=n.apply(i,u);return m.isObject(o)?o:i};m.bind=function(n,t){if(g&&n.bind===g)return g.apply(n,l.call(arguments,1));if(!m.isFunction(n))throw new TypeError("Bind must be called on a function");var r=l.call(arguments,2),e=function(){return E(n,e,t,this,r.concat(l.call(arguments)))};return e},m.partial=function(n){var t=l.call(arguments,1),r=function(){for(var e=0,u=t.length,i=Array(u),o=0;u>o;o++)i[o]=t[o]===m?arguments[e++]:t[o];for(;e<arguments.length;)i.push(arguments[e++]);return E(n,r,this,this,i)};return r},m.bindAll=function(n){var t,r,e=arguments.length;if(1>=e)throw new Error("bindAll must be passed function names");for(t=1;e>t;t++)r=arguments[t],n[r]=m.bind(n[r],n);return n},m.memoize=function(n,t){var r=function(e){var u=r.cache,i=""+(t?t.apply(this,arguments):e);return m.has(u,i)||(u[i]=n.apply(this,arguments)),u[i]};return r.cache={},r},m.delay=function(n,t){var r=l.call(arguments,2);return setTimeout(function(){return n.apply(null,r)},t)},m.defer=m.partial(m.delay,m,1),m.throttle=function(n,t,r){var e,u,i,o=null,a=0;r||(r={});var c=function(){a=r.leading===!1?0:m.now(),o=null,i=n.apply(e,u),o||(e=u=null)};return function(){var f=m.now();a||r.leading!==!1||(a=f);var l=t-(f-a);return e=this,u=arguments,0>=l||l>t?(o&&(clearTimeout(o),o=null),a=f,i=n.apply(e,u),o||(e=u=null)):o||r.trailing===!1||(o=setTimeout(c,l)),i}},m.debounce=function(n,t,r){var e,u,i,o,a,c=function(){var f=m.now()-o;t>f&&f>=0?e=setTimeout(c,t-f):(e=null,r||(a=n.apply(i,u),e||(i=u=null)))};return function(){i=this,u=arguments,o=m.now();var f=r&&!e;return e||(e=setTimeout(c,t)),f&&(a=n.apply(i,u),i=u=null),a}},m.wrap=function(n,t){return m.partial(t,n)},m.negate=function(n){return function(){return!n.apply(this,arguments)}},m.compose=function(){var n=arguments,t=n.length-1;return function(){for(var r=t,e=n[t].apply(this,arguments);r--;)e=n[r].call(this,e);return e}},m.after=function(n,t){return function(){return--n<1?t.apply(this,arguments):void 0}},m.before=function(n,t){var r;return function(){return--n>0&&(r=t.apply(this,arguments)),1>=n&&(t=null),r}},m.once=m.partial(m.before,2);var M=!{toString:null}.propertyIsEnumerable("toString"),I=["valueOf","isPrototypeOf","toString","propertyIsEnumerable","hasOwnProperty","toLocaleString"];m.keys=function(n){if(!m.isObject(n))return[];if(v)return v(n);var t=[];for(var r in n)m.has(n,r)&&t.push(r);return M&&e(n,t),t},m.allKeys=function(n){if(!m.isObject(n))return[];var t=[];for(var r in n)t.push(r);return M&&e(n,t),t},m.values=function(n){for(var t=m.keys(n),r=t.length,e=Array(r),u=0;r>u;u++)e[u]=n[t[u]];return e},m.mapObject=function(n,t,r){t=x(t,r);for(var e,u=m.keys(n),i=u.length,o={},a=0;i>a;a++)e=u[a],o[e]=t(n[e],e,n);return o},m.pairs=function(n){for(var t=m.keys(n),r=t.length,e=Array(r),u=0;r>u;u++)e[u]=[t[u],n[t[u]]];return e},m.invert=function(n){for(var t={},r=m.keys(n),e=0,u=r.length;u>e;e++)t[n[r[e]]]=r[e];return t},m.functions=m.methods=function(n){var t=[];for(var r in n)m.isFunction(n[r])&&t.push(r);return t.sort()},m.extend=_(m.allKeys),m.extendOwn=m.assign=_(m.keys),m.findKey=function(n,t,r){t=x(t,r);for(var e,u=m.keys(n),i=0,o=u.length;o>i;i++)if(e=u[i],t(n[e],e,n))return e},m.pick=function(n,t,r){var e,u,i={},o=n;if(null==o)return i;m.isFunction(t)?(u=m.allKeys(o),e=b(t,r)):(u=S(arguments,!1,!1,1),e=function(n,t,r){return t in r},o=Object(o));for(var a=0,c=u.length;c>a;a++){var f=u[a],l=o[f];e(l,f,o)&&(i[f]=l)}return i},m.omit=function(n,t,r){if(m.isFunction(t))t=m.negate(t);else{var e=m.map(S(arguments,!1,!1,1),String);t=function(n,t){return!m.contains(e,t)}}return m.pick(n,t,r)},m.defaults=_(m.allKeys,!0),m.create=function(n,t){var r=j(n);return t&&m.extendOwn(r,t),r},m.clone=function(n){return m.isObject(n)?m.isArray(n)?n.slice():m.extend({},n):n},m.tap=function(n,t){return t(n),n},m.isMatch=function(n,t){var r=m.keys(t),e=r.length;if(null==n)return!e;for(var u=Object(n),i=0;e>i;i++){var o=r[i];if(t[o]!==u[o]||!(o in u))return!1}return!0};var N=function(n,t,r,e){if(n===t)return 0!==n||1/n===1/t;if(null==n||null==t)return n===t;n instanceof m&&(n=n._wrapped),t instanceof m&&(t=t._wrapped);var u=s.call(n);if(u!==s.call(t))return!1;switch(u){case"[object RegExp]":case"[object String]":return""+n==""+t;case"[object Number]":return+n!==+n?+t!==+t:0===+n?1/+n===1/t:+n===+t;case"[object Date]":case"[object Boolean]":return+n===+t}var i="[object Array]"===u;if(!i){if("object"!=typeof n||"object"!=typeof t)return!1;var o=n.constructor,a=t.constructor;if(o!==a&&!(m.isFunction(o)&&o instanceof o&&m.isFunction(a)&&a instanceof a)&&"constructor"in n&&"constructor"in t)return!1}r=r||[],e=e||[];for(var c=r.length;c--;)if(r[c]===n)return e[c]===t;if(r.push(n),e.push(t),i){if(c=n.length,c!==t.length)return!1;for(;c--;)if(!N(n[c],t[c],r,e))return!1}else{var f,l=m.keys(n);if(c=l.length,m.keys(t).length!==c)return!1;for(;c--;)if(f=l[c],!m.has(t,f)||!N(n[f],t[f],r,e))return!1}return r.pop(),e.pop(),!0};m.isEqual=function(n,t){return N(n,t)},m.isEmpty=function(n){return null==n?!0:k(n)&&(m.isArray(n)||m.isString(n)||m.isArguments(n))?0===n.length:0===m.keys(n).length},m.isElement=function(n){return!(!n||1!==n.nodeType)},m.isArray=h||function(n){return"[object Array]"===s.call(n)},m.isObject=function(n){var t=typeof n;return"function"===t||"object"===t&&!!n},m.each(["Arguments","Function","String","Number","Date","RegExp","Error"],function(n){m["is"+n]=function(t){return s.call(t)==="[object "+n+"]"}}),m.isArguments(arguments)||(m.isArguments=function(n){return m.has(n,"callee")}),"function"!=typeof/./&&"object"!=typeof Int8Array&&(m.isFunction=function(n){return"function"==typeof n||!1}),m.isFinite=function(n){return isFinite(n)&&!isNaN(parseFloat(n))},m.isNaN=function(n){return m.isNumber(n)&&n!==+n},m.isBoolean=function(n){return n===!0||n===!1||"[object Boolean]"===s.call(n)},m.isNull=function(n){return null===n},m.isUndefined=function(n){return n===void 0},m.has=function(n,t){return null!=n&&p.call(n,t)},m.noConflict=function(){return u._=i,this},m.identity=function(n){return n},m.constant=function(n){return function(){return n}},m.noop=function(){},m.property=w,m.propertyOf=function(n){return null==n?function(){}:function(t){return n[t]}},m.matcher=m.matches=function(n){return n=m.extendOwn({},n),function(t){return m.isMatch(t,n)}},m.times=function(n,t,r){var e=Array(Math.max(0,n));t=b(t,r,1);for(var u=0;n>u;u++)e[u]=t(u);return e},m.random=function(n,t){return null==t&&(t=n,n=0),n+Math.floor(Math.random()*(t-n+1))},m.now=Date.now||function(){return(new Date).getTime()};var B={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#x27;","`":"&#x60;"},T=m.invert(B),R=function(n){var t=function(t){return n[t]},r="(?:"+m.keys(n).join("|")+")",e=RegExp(r),u=RegExp(r,"g");return function(n){return n=null==n?"":""+n,e.test(n)?n.replace(u,t):n}};m.escape=R(B),m.unescape=R(T),m.result=function(n,t,r){var e=null==n?void 0:n[t];return e===void 0&&(e=r),m.isFunction(e)?e.call(n):e};var q=0;m.uniqueId=function(n){var t=++q+"";return n?n+t:t},m.templateSettings={evaluate:/<%([\s\S]+?)%>/g,interpolate:/<%=([\s\S]+?)%>/g,escape:/<%-([\s\S]+?)%>/g};var K=/(.)^/,z={"'":"'","\\":"\\","\r":"r","\n":"n","\u2028":"u2028","\u2029":"u2029"},D=/\\|'|\r|\n|\u2028|\u2029/g,L=function(n){return"\\"+z[n]};m.template=function(n,t,r){!t&&r&&(t=r),t=m.defaults({},t,m.templateSettings);var e=RegExp([(t.escape||K).source,(t.interpolate||K).source,(t.evaluate||K).source].join("|")+"|$","g"),u=0,i="__p+='";n.replace(e,function(t,r,e,o,a){return i+=n.slice(u,a).replace(D,L),u=a+t.length,r?i+="'+\n((__t=("+r+"))==null?'':_.escape(__t))+\n'":e?i+="'+\n((__t=("+e+"))==null?'':__t)+\n'":o&&(i+="';\n"+o+"\n__p+='"),t}),i+="';\n",t.variable||(i="with(obj||{}){\n"+i+"}\n"),i="var __t,__p='',__j=Array.prototype.join,"+"print=function(){__p+=__j.call(arguments,'');};\n"+i+"return __p;\n";try{var o=new Function(t.variable||"obj","_",i)}catch(a){throw a.source=i,a}var c=function(n){return o.call(this,n,m)},f=t.variable||"obj";return c.source="function("+f+"){\n"+i+"}",c},m.chain=function(n){var t=m(n);return t._chain=!0,t};var P=function(n,t){return n._chain?m(t).chain():t};m.mixin=function(n){m.each(m.functions(n),function(t){var r=m[t]=n[t];m.prototype[t]=function(){var n=[this._wrapped];return f.apply(n,arguments),P(this,r.apply(m,n))}})},m.mixin(m),m.each(["pop","push","reverse","shift","sort","splice","unshift"],function(n){var t=o[n];m.prototype[n]=function(){var r=this._wrapped;return t.apply(r,arguments),"shift"!==n&&"splice"!==n||0!==r.length||delete r[0],P(this,r)}}),m.each(["concat","join","slice"],function(n){var t=o[n];m.prototype[n]=function(){return P(this,t.apply(this._wrapped,arguments))}}),m.prototype.value=function(){return this._wrapped},m.prototype.valueOf=m.prototype.toJSON=m.prototype.value,m.prototype.toString=function(){return""+this._wrapped},"function"==typeof define&&define.amd&&define("underscore",[],function(){return m})}).call(this);
//# sourceMappingURL=underscore-min.map