时间线 JS:更改时间线颜色

Timeline JS: Change Time Line Color

提问人:Carlos Andrés del Valle 提问时间:11/11/2023 更新时间:11/11/2023 访问量:18

问:

我制定了这个时间表:enter image description here

除了时间线本身之外,时间线看起来很棒。我很想改变时间线的颜色。另外,请注意,时间线分为 3 个。这是由于每个事件中的组标签,但很难区分组。

我的事件如下所示:

{
                "media": {
                    "url": "https://www.youtube.com/watch?v=6Qy5oY-aRDI",
                    "caption": "",
                    "credit": "",
                    "thumbnail": "https://educahistoria.com/wp-content/uploads/2023/04/DaMarkusWolf_cold_war_clash_cinematic_with_the_clash_of_the_sov_d9c0925d-ad54-4775-ac0a-99394cbf49cb-980x565.png"
                }

                ,
                "start_date": {
                    "month": "10",
                    "day": "30",
                    "year": "1962"
                }

                ,
                "end_date": {
                    "month": "10",
                    "day": "30",
                    "year": "1962"
                }

                ,
                "text": {
                    "headline": "Inicio de la distensi\u00f3n",
                    "text": "<strong>Guerra Fr\u00eda</strong>, <strong>Comunismo Internacional</strong>, <strong>Inteligencia Militar</strong><p>El periodo de distensi\u00f3n entre la Uni\u00f3n Sovi\u00e9tica (URSS) y Estados Unidos (EEUU) se trato de unos a\u00f1os de relativa relajaci\u00f3n de las tensiones y la hostilidad que caracterizaron gran parte de la Guerra Fr\u00eda, al menos entre las dos potencias. En este periodo hubo una serie de acuerdos y acontecimientos que llevaron a una disminuci\u00f3n de la confrontaci\u00f3n militar y pol\u00edtica entre las dos superpotencias como la pol\u00edtica de \"coexistencia pac\u00edfica\" promovida por los l\u00edderes sovi\u00e9ticos.    </p><a href='https://humanidades.com/distension-en-la-guerra-fria-1962-1975/' target='_blank'>Para saber m\u00e1s</a>"
                }

                ,
                "group": "Escala Internacional",
                "background": {
                    "url": "https://educahistoria.com/wp-content/uploads/2023/04/DaMarkusWolf_cold_war_clash_cinematic_with_the_clash_of_the_sov_d9c0925d-ad54-4775-ac0a-99394cbf49cb-980x565.png",
                    "color": "#2d2d2d"
                }
            }

我的 HTML 看起来像这样:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Timeline Example</title>
    <!-- Link to the Timeline.js library -->
    <link title="timeline-styles" rel="stylesheet" href="https://cdn.knightlab.com/libs/timeline3/latest/css/timeline.css">
    <!-- 2 -->
    <script src="https://cdn.knightlab.com/libs/timeline3/latest/js/timeline.js"></script>
    <div id='timeline-embed' style="width: 100%; height: 700px"></div>
    <style></style>

<body>
    <script type="text/javascript">
    var timeline_json = {....};
    window.timeline = new TL.Timeline('timeline-embed', timeline_json);
    </script>
</body>

</html>

在阅读了文档并滚动浏览了包的无穷无尽的CSS文件后,我无法更改时间线的颜色。我尝试这样做的方法是在网站的头部添加一个(上面未显示)。我也试图用谷歌搜索这个,但没有取得多大成功。<style></style>

如果有人能帮我为每个组添加不同的颜色,或者至少改变时间线的颜色,我将不胜感激。

谢谢。

JavaScript HTML 背景颜色 时间轴 .js

评论


答: 暂无答案