「Relationship_javascript」の編集履歴（バックアップ）一覧はこちら

Relationship_javascript - (2026/06/12 (金) 17:43:57) の１つ前との変更点

追加された行は緑色になります。

削除された行は赤色になります。

#html2(){
<div class="relationship-graph-container"></div>
}
#javascript(){{
document.addEventListener('DOMContentLoaded', function() {
  // 1. &spanclassによって生成された「class="chara-argument"」「class="garden-argument"」の要素を探す
  var argChara = document.querySelector('.chara-argument');
  var argGarden = document.querySelector('.garden-argument');
  if (!argChara) return;

  // 2. その要素の中に書かれているキャラ名とガーデン名を取得
  var charaName = argChara.innerText.trim();
  var gardenName = argGarden ? argGarden.innerText.trim();
  if (!charaName) return;

  // 3. 一番近い「graph-container」を探してiframeを流し込む
  var container = document.querySelector('.relationship-graph-container');
  if (container && !container.querySelector('iframe')) {
      var iframe = document.createElement('iframe');

      // URLを組み立てる
      var url = "https://tgr55al.github.io/assault_lily-ga4-graph/relationship.html?chara=" +
          encodeURIComponent(charaName);

      // gardenが指定されているときだけ追加
      if (gardenName) {
          url += "&garden=" + encodeURIComponent(gardenName);
      }

      iframe.src = url;
      iframe.width = "100%";
      iframe.height = "600";
      iframe.style.border = "none";
      iframe.setAttribute('frameborder', '0');

      container.appendChild(iframe);
  }
});
}}

#html2(){
<div class="relationship-graph-container"></div>
}
#javascript(){{
document.addEventListener('DOMContentLoaded', function() {
  // 1. &spanclassによって生成された「class="chara-argument"」「class="garden-argument"」の要素を探す
  var argChara = document.querySelector('.chara-argument');
  var argGarden = document.querySelector('.garden-argument');
  if (!argChara) return;

  // 2. その要素の中に書かれているキャラ名とガーデン名を取得
  var charaName = argChara.innerText.trim();
  var gardenName = argGarden ? argGarden.innerText.trim() : "";
  if (!charaName) return;

  // 3. 一番近い「graph-container」を探してiframeを流し込む
  var container = document.querySelector('.relationship-graph-container');
  if (container && !container.querySelector('iframe')) {
      var iframe = document.createElement('iframe');

      // URLを組み立てる
      var url = "https://tgr55al.github.io/assault_lily-ga4-graph/relationship.html?chara=" +
          encodeURIComponent(charaName);

      // gardenが指定されているときだけ追加
      if (gardenName) {
          url += "&garden=" + encodeURIComponent(gardenName);
      }

      iframe.src = url;
      iframe.width = "100%";
      iframe.height = "600";
      iframe.style.border = "none";
      iframe.setAttribute('frameborder', '0');

      container.appendChild(iframe);
  }
});
}}