javascript根据数字改变位置

Posted 2023-02-24

【中文标题】javascript根据数字改变位置

【英文标题】：javascript change position depending on number

【发布时间】：2015-06-26 20:05:28

【问题描述】：

当人们填写表格时，所有数据都会发送并保存在数据库中。 例如：

现在人们填写轴距（在下一页），轴距得到更新。他们对转向架表做同样的事情（不是距离，而是转向架编号）

这一切都填好后，DB看起来是这样的：

火车信息：

车轴：

转向架：

现在有了以下信息，它就形成了火车形状。

现在我通过选择轴的数量来制作这个形状，然后将它们转成一个圆圈。 我通过选择轴表来设置距离，并使用 margin-left。

现在。实际需要添加的东西，每个轴距为 1000-4000。因此，当我添加它时，如果火车成形，它将是巨大的。

所以我在想，（但不知道是否可行）而不是通过轴距离设置最终结果距离。但是有转向架编号。

所以轴 1 和 2 的转向架编号为 1。我希望转向架编号 1 位于左侧。 轴 3 和 4 的转向架编号为 2。我希望在 1 号旁边有 200px 之类的转向架。 轴 5 和 6 的转向架编号为 3。我希望在 2 号旁边有 200 像素。等等。等等。

这是 end_results 使其成形的方法：

<div id="axle_position2">
            <?php      
                foreach($show_axle as $axlefigure) ?>
                    <div style="margin-left:<?php echo $axlefigure['distance'];?>px;"> 
                        <?php echo $axlefigure['axle'] ?>
                    </div>
            <?php
                 
            ?>
        </div>

它所做的功能只是一个：SELECT * FROM axis where train_id = train_id

编辑：

这里是一个例子：

【问题讨论】：

有什么问题？

@Sidd 现在我通过选择轴数来制作这个形状，然后将它们转成一个圆圈。我通过选择轴表来设置距离，并使用左边距。现在。实际需要添加的东西，每个轴距为 1000-4000。因此，当我添加这一点时，如果火车成形，它将是巨大的。所以我在想，（但不知道是否可行）而不是通过轴距设置最终结果距离。但有了转向架编号。

所以轴之间的距离不再重要了，对吧？

正确的@AlvaroMontoro

【参考方案1】：

有很多方法可以解决这个问题。这是一种可能的解决方案：

由于轴之间的距离不再重要（在 cmets 中指定），因此请关注转向架。像这样选择转向架及其轴：

SELECT bogie_nr, GROUP_CONCAT(axle_id) AS axles
FROM   `bogie` 
WHERE   train_id = 17 
GROUP BY bogie_nr

此选择将返回转向架的编号，以及该特定转向架中以逗号分隔的轴列表。您唯一要做的就是像您一样遍历结果，并用逗号分隔axles 字符串。

最后，为了显示结果，将车轴包裹在转向架内并适当添加样式。像这样：（$bogies 将是上述查询的结果集）

<?php foreach($bogies as $bogie)  ?>
    <div class="bogie" id="bogie<?php echo $bogie["bogie_nr"]; ?>"> 
        <?php 
            $axles = explode(",", $bogie["axles"]);
            foreach($axles as $axle) 
        ?>
            <div class="axle"><?php echo $axle; ?></div>
        <?php  ?>
    </div>
<?php  ?>

我没有添加样式以使其更清晰，但我的想法是.bogie 类将具有margin-left 的200px（将其与下一个转向架分开）， .axle 类将包含您想要添加的任何 margin-left。