1<html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 4 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 6 7 <!-- AmCharts includes --> 8 <script src="http://www.amcharts.com/lib/3/amcharts.js"></script> 9 <script src="http://www.amcharts.com/lib/3/xy.js"></script> 10 11 <!-- Export plugin includes and styles --> 12 <script src="../export.js"></script> 13 <link type="text/css" href="../export.css" rel="stylesheet"> 14 15 <style> 16 body, html { 17 height: 100%; 18 padding: 0; 19 margin: 0; 20 overflow: hidden; 21 font-size: 11px; 22 font-family: Verdana; 23 } 24 #chartdiv { 25 width: 100%; 26 height: 100%; 27 } 28 </style> 29 30 <script type="text/javascript"> 31 var chart = AmCharts.makeChart( "chartdiv", { 32 "type": "xy", 33 "marginTop": 25, 34 "startDuration": 1.5, 35 "trendLines": [], 36 "graphs": [ { 37 "title": "Diamonds", 38 "balloonText": "x:<b>[[x]]</b> y:<b>[[y]]</b><br>value:<b>[[value]]</b>", 39 "bullet": "diamond", 40 "id": "AmGraph-1", 41 "lineAlpha": 0, 42 "lineColor": "#b0de09", 43 "valueField": "value", 44 "xField": "x", 45 "yField": "y" 46 }, { 47 "title": "Balls", 48 "balloonText": "x:<b>[[x]]</b> y:<b>[[y]]</b><br>value:<b>[[value]]</b>", 49 "bullet": "round", 50 "id": "AmGraph-2", 51 "lineAlpha": 0, 52 "lineColor": "#fcd202", 53 "valueField": "value2", 54 "xField": "x2", 55 "yField": "y2" 56 } ], 57 "guides": [ { 58 "fillAlpha": 0.3, 59 "fillColor": "#ff8000", 60 "id": "Guide-1", 61 "toValue": -2, 62 "value": -8, 63 "valueAxis": "ValueAxis-2" 64 } ], 65 "valueAxes": [ { 66 "id": "ValueAxis-1", 67 "axisAlpha": 0 68 }, { 69 "id": "ValueAxis-2", 70 "axisAlpha": 0, 71 "position": "bottom" 72 } ], 73 "allLabels": [], 74 "balloon": {}, 75 "titles": [], 76 "dataProvider": [ { 77 "y": 10, 78 "x": 14, 79 "value": 59, 80 "y2": -5, 81 "x2": -3, 82 "value2": 44 83 }, { 84 "y": 5, 85 "x": 3, 86 "value": 50, 87 "y2": -15, 88 "x2": -8, 89 "value2": 12 90 }, { 91 "y": -10, 92 "x": -3, 93 "value": 19, 94 "y2": -4, 95 "x2": 6, 96 "value2": 35 97 }, { 98 "y": -6, 99 "x": 5, 100 "value": 65, 101 "y2": -5, 102 "x2": -6, 103 "value2": 168 104 }, { 105 "y": 15, 106 "x": -4, 107 "value": 92, 108 "y2": -10, 109 "x2": -8, 110 "value2": 102 111 }, { 112 "y": 13, 113 "x": 1, 114 "value": 8, 115 "y2": -2, 116 "x2": -3, 117 "value2": 41 118 }, { 119 "y": 1, 120 "x": 6, 121 "value": 35, 122 "y2": 0, 123 "x2": -3, 124 "value2": 16 125 } ], 126 "chartCursor": {}, 127 "legend": { 128 "position": "bottom" 129 }, 130 "export": { 131 "enabled": true 132 } 133 } ); 134 </script> 135 </head> 136 <body> 137 <div id="chartdiv"></div> 138 </body> 139</html>