Question

我正在开发一个蓝牙位置项目界面。我是html，javascript的新手。我需要为地图/区域等位置分配像素。但我需要它们用于放置物体。例如，当我创建一个对象时，我分配顶部：＆＃34; 50＆＃34; px，left＆＃34; 40＆＃34; px。我正在寻找一种方法来给我的对象提供区域ID，我的对象将被放置在该区域中。我希望你们能理解我的问题。

＆＃13;

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />
    <title>Index</title>

</head>

<body>

    <img src="~/Images/kroki.jpg" alt="map" usemap="#Map" />

    <map name="Map" id="Map">

        <area target="" alt="" id="galeri" title="" href="" coords="144,186,251,386" shape="rect">
        <area target="" alt="" id="a1" title="" href="" coords="42,32,106,31,106,37,163,37,163,160,40,162" shape="poly">
        <area target="" alt="" id="a2" title="" href="" coords="164,160,290,160,289,47,257,30,196,32,165,41" shape="poly">

    </map>

    <div class="row">

    <div style="position:absolute; top:15px; left:15px; width:15px; height:15px; margin:0; background-color:lawngreen" class="dot"></div>     
    <div style="position:absolute; top:290px; left:190px; width:15px; height:15px;  background-color:deeppink" class="dot" id="pink"></div>
    
        </div>

</body>
</html>

<script>

    var img = (document.getElementsByClassName("dot"));

    var interval = window.setInterval(function () {

        for (var i = 0; i < 100; i++) {

            if (img[i].style.visibility == 'hidden') {
                img[i].style.visibility = 'visible';
            } else {
                img[i].style.visibility = 'hidden';
            }
        }
        }, 500);

</script>

＆＃13;

正如您在此处所见，我手动分配位置值。但是你可以再次看到我创造的领域。如何将此方块直接分配到使用区域ID的区域？

Answer 1

<img src ="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

Answer 2

而不是使用地图，

您可以使用画布并绘制宽度和高度的像素。

Canvas HTML5： Drawing a dot on HTML5 canvas

如何使用坐标作为地图位置？

2 个答案: