Subversion Repositories php-qbpwcf

Rev

Rev 23 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
23 liveuser 1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2
<html>
3
 
4
    <head>
5
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
6
        <title>amMap examples</title>
7
 
8
        <link rel="stylesheet" href="../ammap/ammap.css" type="text/css">
9
        <script src="../ammap/ammap.js" type="text/javascript"></script>
10
        <!-- map file should be included after ammap.js -->
11
		<script src="../ammap/maps/js/worldLow.js" type="text/javascript"></script>
12
 
13
		<script>
14
            // svg path for target icon
15
            var targetSVG = "M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z";
16
            // svg path for plane icon
17
            var planeSVG = "m2,106h28l24,30h72l-44,-133h35l80,132h98c21,0 21,34 0,34l-98,0 -80,134h-35l43,-133h-71l-24,30h-28l15,-47";
18
 
19
 
20
            AmCharts.makeChart("mapdiv", {
21
                type: "map",
22
 
23
                dataProvider: {
24
                    map: "worldLow",
25
                    zoomLevel: 3.5,
26
                    zoomLongitude: -55,
27
                    zoomLatitude: 42,
28
 
29
 
30
                    lines: [{
31
                        id: "line1",
32
                        arc: -0.85,
33
                        alpha: 0.3,
34
                        latitudes: [48.8567, 43.8163, 34.3, 23],
35
                        longitudes: [2.3510, -79.4287, -118.15, -82]
36
                    }, {
37
                        id: "line2",
38
                        alpha: 0,
39
                        color: "#000000",
40
                        latitudes: [48.8567, 43.8163, 34.3, 23],
41
                        longitudes: [2.3510, -79.4287, -118.15, -82]
42
                    }],
43
                    images: [{
44
                        svgPath: targetSVG,
45
                        title: "Paris",
46
                        latitude: 48.8567,
47
                        longitude: 2.3510
48
                    }, {
49
                        svgPath: targetSVG,
50
                        title: "Toronto",
51
                        latitude: 43.8163,
52
                        longitude: -79.4287
53
                    }, {
54
                        svgPath: targetSVG,
55
                        title: "Los Angeles",
56
                        latitude: 34.3,
57
                        longitude: -118.15
58
                    }, {
59
                        svgPath: targetSVG,
60
                        title: "Havana",
61
                        latitude: 23,
62
                        longitude: -82
63
                    }, {
64
                        svgPath: planeSVG,
65
                        positionOnLine: 0,
66
                        color: "#000000",
67
                        alpha: 0.1,
68
                        animateAlongLine: true,
69
                        lineId: "line2",
70
                        flipDirection: true,
71
                        loop: true,
72
                        scale: 0.03,
73
                        positionScale: 1.3
74
                    }, {
75
                        svgPath: planeSVG,
76
                        positionOnLine: 0,
77
                        color: "#585869",
78
                        animateAlongLine: true,
79
                        lineId: "line1",
80
                        flipDirection: true,
81
                        loop: true,
82
                        scale: 0.03,
83
                        positionScale: 1.8
84
                    }]
85
                },
86
 
87
                areasSettings: {
88
                    unlistedAreasColor: "#8dd9ef"
89
                },
90
 
91
                imagesSettings: {
92
                    color: "#585869",
93
                    rollOverColor: "#585869",
94
                    selectedColor: "#585869",
95
                    pauseDuration: 0.2,
96
                    animationDuration: 2.5,
97
                    adjustAnimationSpeed: true
98
                },
99
 
100
                linesSettings: {
101
                    color: "#585869",
102
                    alpha: 0.4
103
                }
104
            });
105
        </script>
106
    </head>
107
 
108
    <body>
109
        <div id="mapdiv" style="width: 100%; background-color:#d5eff7; height: 500px;"></div>
110
    </body>
111
 
112
</html>