%PDF- %PDF-
Direktori : /home/bitrix/www/bitrix/js/main/amcharts/3.21/plugins/export/examples/ |
Current File : //home/bitrix/www/bitrix/js/main/amcharts/3.21/plugins/export/examples/advanced.html |
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- AmCharts includes --> <script src="../../../AmDebug/lib/amcharts/amcharts.js"></script> <script src="../../../AmDebug/lib/amcharts/serial.js"></script> <!-- Export plugin includes and styles --> <script src="../export.js"></script> <link type="text/css" href="../export.css" rel="stylesheet"> <script src="export.config.advanced.js"></script> <style> body, html { height: 100%; padding: 0; margin: 0; overflow: hidden; font-size: 11px; font-family: Verdana; } #chartdiv { width: 100%; height: 100%; } </style> <script type="text/javascript"> var chart = AmCharts.makeChart( "chartdiv", { "type": "serial", "theme": "light", "legend": { "equalWidths": false, "useGraphSettings": true, "valueAlign": "left", "valueWidth": 120 }, "dataProvider": [ { "date": "2012-01-01", "distance": 227, "townName": "New York", "townName2": "New York", "townSize": 25, "latitude": 40.71, "duration": 408 }, { "date": "2012-01-02", "distance": 371, "townName": "Washington", "townSize": 14, "latitude": 38.89, "duration": 482 }, { "date": "2012-01-03", "distance": 433, "townName": "Wilmington", "townSize": 6, "latitude": 34.22, "duration": 562 }, { "date": "2012-01-04", "distance": 345, "townName": "Jacksonville", "townSize": 7, "latitude": 30.35, "duration": 379 }, { "date": "2012-01-05", "distance": 480, "townName": "Miami", "townName2": "Miami", "townSize": 10, "latitude": 25.83, "duration": 501 }, { "date": "2012-01-06", "distance": 386, "townName": "Tallahassee", "townSize": 7, "latitude": 30.46, "duration": 443 }, { "date": "2012-01-07", "distance": 348, "townName": "New Orleans", "townSize": 10, "latitude": 29.94, "duration": 405 }, { "date": "2012-01-08", "distance": 238, "townName": "Houston", "townName2": "Houston", "townSize": 16, "latitude": 29.76, "duration": 309 }, { "date": "2012-01-09", "distance": 218, "townName": "Dalas", "townSize": 17, "latitude": 32.8, "duration": 287 }, { "date": "2012-01-10", "distance": 349, "townName": "Oklahoma City", "townSize": 11, "latitude": 35.49, "duration": 485 }, { "date": "2012-01-11", "distance": 603, "townName": "Kansas City", "townSize": 10, "latitude": 39.1, "duration": 890 }, { "date": "2012-01-12", "distance": 534, "townName": "Denver", "townName2": "Denver", "townSize": 18, "latitude": 39.74, "duration": 810 }, { "date": "2012-01-13", "townName": "Salt Lake City", "townSize": 12, "distance": 425, "duration": 670, "latitude": 40.75, "dashLength": 8, "alpha": 0.4 }, { "date": "2012-01-14", "latitude": 36.1, "duration": 470, "townName": "Las Vegas", "townName2": "Las Vegas" }, { "date": "2012-01-15" }, { "date": "2012-01-16" }, { "date": "2012-01-17" }, { "date": "2012-01-18" }, { "date": "2012-01-19" } ], "valueAxes": [ { "id": "distanceAxis", "axisAlpha": 0, "gridAlpha": 0, "position": "left", "title": "distance" }, { "id": "latitudeAxis", "axisAlpha": 0, "gridAlpha": 0, "labelsEnabled": false, "position": "right" }, { "id": "durationAxis", "duration": "mm", "durationUnits": { "hh": "h ", "mm": "min" }, "axisAlpha": 0, "gridAlpha": 0, "inside": true, "position": "right", "title": "duration" } ], "graphs": [ { "alphaField": "alpha", "balloonText": "[[value]] miles", "dashLengthField": "dashLength", "fillAlphas": 0.7, "legendPeriodValueText": "total: [[value.sum]] mi", "legendValueText": "[[value]] mi", "title": "distance", "type": "column", "valueField": "distance", "valueAxis": "distanceAxis" }, { "balloonText": "latitude:[[value]]", "bullet": "round", "bulletBorderAlpha": 1, "useLineColorForBulletBorder": true, "bulletColor": "#FFFFFF", "bulletSizeField": "townSize", "dashLengthField": "dashLength", "descriptionField": "townName", "labelPosition": "right", "labelText": "[[townName2]]", "legendValueText": "[[description]]/[[value]]", "title": "latitude/city", "fillAlphas": 0, "valueField": "latitude", "valueAxis": "latitudeAxis" }, { "bullet": "square", "bulletBorderAlpha": 1, "bulletBorderThickness": 1, "dashLengthField": "dashLength", "legendValueText": "[[value]]", "title": "duration", "fillAlphas": 0, "valueField": "duration", "valueAxis": "durationAxis" } ], "chartCursor": { "categoryBalloonDateFormat": "DD", "cursorAlpha": 0.1, "cursorColor": "#000000", "fullWidth": true, "valueBalloonsEnabled": false, "zoomable": false }, "dataDateFormat": "YYYY-MM-DD", "categoryField": "date", "categoryAxis": { "dateFormats": [ { "period": "DD", "format": "DD" }, { "period": "WW", "format": "MMM DD" }, { "period": "MM", "format": "MMM" }, { "period": "YYYY", "format": "YYYY" } ], "parseDates": true, "autoGridCount": false, "axisColor": "#555555", "gridAlpha": 0.1, "gridColor": "#FFFFFF", "gridCount": 50 }, "export": AmCharts.exportCFG } ); </script> </head> <body> <div id="chartdiv"></div> </body> </html>