OSM Hide Relation Centroid Circle

Hides the orange circle that appears at the centroid of selected relations (e.g. municipality/county borders) on openstreetmap.org

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name         OSM Hide Relation Centroid Circle
// @name:sv      OSM – Dölj relations-centroidcirkel
// @namespace    https://greasyfork.org/users/1168708-rotski
// @version      1.0.1
// @description  Hides the orange circle that appears at the centroid of selected relations (e.g. municipality/county borders) on openstreetmap.org
// @description:sv Döljer den orange cirkeln som visas vid centroiden av valda relationer (t.ex. kommun- och länsgränser) på openstreetmap.org
// @author       Rotski + Claude
// @match        https://www.openstreetmap.org/*
// @icon         https://www.openstreetmap.org/favicon.ico
// @grant        none
// @license      MIT
// ==/UserScript==

(function () {
  'use strict';

  var DEFAULT_COLOR = '#FF6200';
  var currentColor = GM_getValue('borderColor', DEFAULT_COLOR);

  function applyStyles() {
    document.querySelectorAll('.leaflet-interactive').forEach(function (el) {
      var stroke = el.getAttribute('stroke') || '';
      var fill = el.getAttribute('fill') || '';
      var d = el.getAttribute('d') || '';
      if (!d) return;
      if (fill === '#FF6200') {
        el.style.display = 'none';
      } else if (stroke === '#FF6200') {
        el.style.stroke = currentColor;
        el.style.fill = 'none';
      }
    });
  }

  // UI
  var ui = document.createElement('div');
  ui.style.cssText = [
    'position:fixed',
    'bottom:20px',
    'right:20px',
    'z-index:99999',
    'background:#fff',
    'border:1px solid #ccc',
    'border-radius:8px',
    'padding:10px 14px',
    'font:13px/1.4 sans-serif',
    'box-shadow:0 2px 8px rgba(0,0,0,0.2)',
    'display:flex',
    'align-items:center',
    'gap:8px'
  ].join(';');

  var label = document.createElement('span');
  label.textContent = 'Gränsfärg:';

  var picker = document.createElement('input');
  picker.type = 'color';
  picker.value = currentColor;
  picker.style.cssText = 'width:36px;height:28px;border:none;padding:0;cursor:pointer;background:none';

  var resetBtn = document.createElement('button');
  resetBtn.textContent = 'Återställ';
  resetBtn.style.cssText = 'font:12px sans-serif;padding:4px 8px;cursor:pointer;border:1px solid #ccc;border-radius:4px;background:#f5f5f5';

  picker.addEventListener('input', function () {
    currentColor = picker.value;
    GM_setValue('borderColor', currentColor);
    applyStyles();
  });

  resetBtn.addEventListener('click', function () {
    currentColor = DEFAULT_COLOR;
    picker.value = DEFAULT_COLOR;
    GM_setValue('borderColor', DEFAULT_COLOR);
    applyStyles();
  });

  ui.appendChild(label);
  ui.appendChild(picker);
  ui.appendChild(resetBtn);
  document.body.appendChild(ui);

  new MutationObserver(applyStyles).observe(document.documentElement, {
    childList: true,
    subtree: true
  });

  applyStyles();
  setTimeout(applyStyles, 500);
  setTimeout(applyStyles, 1500);
})();