visjs实现三维立体点状图表效果代码
代码语言:html
所属分类:图表
代码描述:visjs实现三维立体点状图表效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/vis.4.21.0.css"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vis.4.21.0.js"></script> </head> <body> PC 1, 2, 3 <div id="pc123" style="width:80%"></div> PC 1, 3, 4 <div id="pc134" style="width:80%"></div> <script> //Timline demo created using vis.js - http://visjs.org/ //Configuration options for a timeline - http://visjs.org/docs/timeline.html#Configuration_Options // DOM element where the Timeline will be attached var pc123_div = document.getElementById('pc123'); var pc134_div = document.getElementById('pc134'); // Configuration for the Timeline as JSON object var options = { width: '100%', editable: true, /* this option means you can add or remove items by clicking on the timeline */ margin: { item: 20 } }; // Create a Timeline var timeline = new vis.Graph3d(pc123_div, pc123(), options); var timeline = new vis.Graph3d(pc134_div, pc134(), options); function pc123() { var data = new vis.DataSet([{ "x": 2.6659, "y": -1.4265, "z": -0.608, "PC4": -0.9068, "Aircraft": "Airbus A319" }, { "x": 6.9032, "y": 16.2428, "z": -4.5603, "PC4": -0.0506, "Aircraft": "Airbus A319 VIP" }, { "x": 2.4103, "y": -1.5265, "z": -0.7083, "PC4": -0.9482, "Aircraft": "Airbus A320" }, { "x": 2.4103, "y": -1.5265, "z": -0.7083, "PC4": -0.9482, "Aircraft": "Airbus A320 32-R" }, { "x": -4.7047, "y": 0.9708, "z": 0.6199, "PC4": -0.6701, "Aircraft": "Airbus A330-200" }, { "x": -4.6762, "y": 0.9983, "z": 0.5846, "PC4": 1.6746, "Aircraft": "Airbus A330-200 (3L2)" }, { "x": -5.153, "y": 0.9558, "z": 0.4596, "PC4": -0.7869, "Aircraft": "Airbus A330-200 (3L3)" }, { "x": -4.8537, "y": 0.7469, "z": 0.3278, "PC4": 1.5998, "Aircraft": "Airbus A330-300" }, { "x": 2.7615, "y": -1.6387, "z": -0.3242, "PC4": -0.1971, "Aircraft": "Boeing 717" }, { "x": 1.8389, "y": -1.4223, "z": -1.5152, "PC4": 1.2993, "Aircraft": "Boeing 737-700 (73W)" }, { "x": 1.7652, "y": -1.4751, "z": -1.6996, "PC4": 1.3111, "Aircraft": "Boeing 737-800 (738)" }, { "x": 1.5583, "y": -1.4905, "z": -1.8343, "PC4": 1.2722, "Aircraft": "Boeing 737-800 (73H)" }, { "x": 1.3196, "y": -1.3466, "z": -1.6577, "PC4": 0.2513, "Aircraft": "Boeing 737-900ER (739)" }, { "x": -7.2765, "y": 1.3057, "z": -0.4632, "PC4": -3.9734, "Aircraft": "Boeing 747-400 (74S)" }, { "x": 1.1197, "y": -1.1254, "z": -1.2934, "PC4": -0.3351, "Aircraft": "Boeing 757-200 (75A)" }, { "x": -2.2295, "y": 0.6042, "z": 0.8561, "PC4": 2.0165, "Aircraft": "Boeing 757-200 (75E)" }, { "x": 1.8741, "y": -1.5165, "z": -1.3881, "PC4": -0.9236, "Aircraft": "Boeing 757-200 (75M)" }, { "x": 1.8465, "y": -1.5465, "z": -1.376, "PC4": -0.9196, "Aircraft": "Boeing 757-200 (75N)" }, { "x": 1.8885, "y": -1.4138, "z": -1.5403, "PC4": -0.3071, "Aircraft": "Boeing 757-200 (757)" }, { "x": 1.4408, "y": -1.4126, "z": -1.8213, "PC4": -0.3438, "Aircraft": "Boeing 757-200 (75V)" }, { "x": -1.8919, "y": 0.2431, "z": 0.4212, "PC4": 1.5441, "Aircraft": "Boeing 757-200 (75X)" }, { "x": 1.0301, "y": -1.4042, "z": -2.0136, "PC4": -0.3908, "Aircraft": "Boeing 757-300" }, { "x": -3.8445, "y": 0.7243, "z": 0.9586, "PC4": 1.9065, "Aircraft": "Boeing 767-300 (76G)" }, { "x": -4.173, "y": 1.0134, "z": 1.1592, "PC4": -0.541, "Aircraft": "Boeing 767-300 (76L)" }, { "x": -0.0221, "y": -1.7461, "z": -3.0022, "PC4": 1.2887, "Aircraft": "Boeing 767-300 (76P)" }, { "x": -0.0221, "y": -1.7461, "z": -3.0022, "PC4": 1.2887, "Aircraft": "Boeing 767-300 (76Q)" }, { "x": -4.1216, "y": 1.0349, "z": 1.1961, "PC4": -0.5488, "Aircraft": "Boeing 767-300 (76T)" }, { "x": -1.2438, "y": -0.7269, "z": -1.799, "PC4": 2.2834, "Aircraft": "Boeing 767-300 (76U)" }, { "x": -4.2285, "y": 0.8824, "z": 1.0048, "PC4": -0.4944, "Aircraft": "Boeing 767-300 (76Z V.1)" }, { "x": -3.9101, "y": 0.8197, "z": 0.9994, "PC4": 1.8576, "Aircraft": "Boeing 767-300 (76Z V.2)" }, { "x": -4.6414, "y": 1.034, "z": 0.9467, "PC4": -0.6397, "Aircraft": "Boeing 767-400 (76D)" }, { "x": -5.8512, "y": 1.0406, "z": 0.2679, "PC4": -0.9847, "Aircraft": "Boeing 777-200ER" }, { "x": -6.0401, "y": 1.1167, "z": 0.2582, "PC4": -0.9896, "Aircraft": "Boeing 777-200LR" }, { "x": 4.2461, "y": 1.0823, "z": 5.5375, "PC4": -0.0572, "Aircraft": "CRJ 100/200 Pinnacle/SkyWest" }, { "x": 4.2461, "y": 1.0823, "z": 5.5375, "PC4": -0.0572, "Aircraft": "CRJ 100/200 ExpressJet" }, { "x": 3.784, "y": -1.4304, "z": 0.1879, "PC4": -0.8837, "Aircraft": "CRJ 700" }, { "x": 3.5749, "y": -1.4616, "z": -0.0428, "PC4": -0.872, "Aircraft": "CRJ 900" }, { "x": 5.111, "y": 1.0068, "z": 6.7253, "PC4": 1.1276, "Aircraft": "E120" }, { "x": 3.3361, "y": -1.565, "z": -0.226, "PC4": -1.1256, &qu.........完整代码请登录后点击上方下载按钮下载查看
网友评论0