Javascript 使用html按钮在google maps api上放置标记_Javascript_Google Maps_Google Maps Api 3

Javascript 使用html按钮在google maps api上放置标记

javascript google-maps google-maps-api-3

Javascript 使用html按钮在google maps api上放置标记,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,（我正在自学，我知道我的代码很乱，对不起）我有一个包含一些数据的表和一个按钮，我希望当我按下按钮时，地图上的位置会出现一个标记（sql工作正常）询问你想要的任何信息！提前谢谢 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> <link rel="styles

（我正在自学，我知道我的代码很乱，对不起）我有一个包含一些数据的表和一个按钮，我希望当我按下按钮时，地图上的位置会出现一个标记（sql工作正常）询问你想要的任何信息！提前谢谢

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>

    <!-- google maps api -->

    <div id="map" style="width:600px;height:500px"></div>
            <script>
        function myMap() {
            var santiago = new google.maps.LatLng(-33.4545832, -70.6541925);
            var mapCanvas = document.getElementById("map");
            var mapOptions = {center: santiago, zoom: 11};
            var map = new google.maps.Map(mapCanvas, mapOptions);
            function addmarker(lat, lon) {
                var location = new google.maps.LatLng(lat, lon);
                var marker = new google.maps.Marker({
                    position: location,
                    map: map
                });
            }
        }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDL5dMHBCV7crlostybmkuGBAXjOP3yawQ&callback=myMap">
    </script>
    <div id="tabla">
        <table Style="width:35%">
            <thead>
                <tr>
                    <th>Tiempo prom</th>
                    <th>Origen</th>
                    <th>Señal Or</th>
                    <th>Destino</th>
                    <th>Mapa</th>
                </tr>
            </thead>
            <tbody>
                <?php
                include "conexion.php";
                include "func.php";
                $sql = "SELECT avg(call_setup_time) as promllamada, CELL_ID_1, CELL_ID_2, avg(SENAL_1) as promsenal, LATITUD_1 as lat, LONGITUD_1 as lon from call_setup where SENAL_1<=-80 GROUP BY CELL_ID_1 ORDER BY promllamada desc limit 20";
                $resultado = $conn->query($sql);
                while ($row = $resultado->fetch_assoc()) {
                    ?>
                    <tr>
                        <td><?php echo $row['promllamada'] ?></td>
                        <td><?php echo $row['CELL_ID_1'] ?></td>
                        <td><?php echo $row['promsenal'] ?></td>
                        <td><?php echo $row['CELL_ID_2'] ?></td>
                        <td><button type="button" id="agregar" onclick="addmarker(<?php echo $row['lat'] . ", " . $row['lon']; ?>)">Ver en mapa</button></td>
                        <?php
                    }
                    ?>
            </tbody>
        </table>
        <!-- datos -->
    </div>
    <div id="datos"></div>
</body>


函数myMap（）{
var santiago=new google.maps.LatLng（-33.4545832，-70.6541925）；
var mapCanvas=document.getElementById（“map”）；
var mapOptions={中心：圣地亚哥，缩放：11}；
var map=new google.maps.map（mapCanvas，mapOptions）；
功能添加标记（横向、纵向）{
var location=new google.maps.LatLng（lat，lon）；
var marker=new google.maps.marker({
位置:位置,，
地图：地图
});
}
}
蒂恩波舞会
奥利金
塞纳尔或
德斯蒂诺
马帕
这就是你要找的吗
按钮agregar
调用的addmarker
函数位于myMap
函数内。我把他们分开了
我还简化了映射
初始化和标记“setter”，将新的
对象直接分配给属性
小提琴：


$（“#按钮”）。单击（函数（）{
addmarker（'-22.3157017'，'-49.0660877'，'信息窗口测试'）；
});
$（'#按钮2'）。单击（函数（）{
addmarker（'-23.5936152'，'-46.5856465'，'InfoWindowTest2'）；
});

点击
点击2
函数myMap（）{
map=new google.maps.map（document.getElementById（'map'）{
中心：新google.maps.LatLng（-33.4545832，-70.6541925），
缩放：11
});
}
功能添加标记（纬度、经度、信息）{
marker=新的google.maps.marker({
位置：新google.maps.LatLng（lat，lon），
信息：新建google.maps.InfoWindow({
内容：信息
}),
地图：地图
});
google.maps.event.addListener（标记'click'，函数（）{
标记信息打开（地图，标记）；
});
map.panTo（marker.getPosition（））；
}
是的，这正是我想要的！！谢谢：）还有一件事，是否可以每次都不重新加载地图？（希望你能理解这个问题）我在表格的每一行都有一个按钮，每次我点击一个按钮，地图就会重新加载到一个新的中心，是否有可能让地图不出现这种“闪烁”@SantiagoCenter，我在addmarker函数中重新创建地图。那真的不是必要的。请看看现在是否可以。没问题！！：）对不起，当我点击标记时，你能帮我添加一个信息窗口吗？