PageSourceSearch

https://ocic.com/hubfs/hub_generated/module_assets/1/191216163990/1785337245276/module_doughnut-chart.min.js

js ocic.com collected 2026-10-07 10:18:48 UTC 2,709 bytes, 2 lines download raw bytes

1var module_191216163990=function(){const setUpSegments=(items,module,toolTip,chart)=>{const allSegments=module.querySelectorAll(".doughnut-chart__segment"),circumference=2*Math.PI*130;let offset=0;items.forEach(segment=>{const segmentLength=segment.getAttribute("segment-value")/100*circumference;segment.setAttribute("stroke-width",40),segment.setAttribute("stroke-dasharray",`${segmentLength} ${circumference}`),segment.setAttribute("stroke-dashoffset",`${offset}`),offset-=segmentLength,((item,items,toolTip)=>{item.addEventListener("mouseenter",e=>{const segmentColor=e.target.getAttribute("stroke");items.forEach(item=>{item.style.opacity=".2"}),e.target.style.opacity="1";const colorBox=toolTip.querySelector(".doughnut-chart__tooltip--color"),label=toolTip.querySelector(".doughnut-chart__tooltip--text"),doughnutTooltipValue=toolTip.querySelector(".doughnut-chart__tooltip--right");colorBox.style.background=segmentColor,"#FFFFFF"===segmentColor&&colorBox.classList.add("white-stroke"),label.innerHTML=e.target.getAttribute("segment-label"),doughnutTooltipValue.innerHTML=e.target.getAttribute("segment-tooltip-value")})})(segment,allSegments,toolTip),((item,items,toolTip)=>{item.addEventListener("mouseleave",e=>{items.forEach(item=>{item.style.opacity="1"}),toolTip.style.opacity="0"})})(segment,allSegments,toolTip),function(segment,toolTip,chart){const chartMid=chart.offsetWidth/2;segment.addEventListener("mousemove",e=>{const x=`${e.offsetX+20}px`,y=`${e.offsetY}px`,rightPosition=parseInt(chart.offsetWidth)-e.offsetX+20+"px";e.offsetX>chartMid?toolTip.style.setProperty("--x",rightPosition):toolTip.style.setProperty("--x",x),toolTip.style.setProperty("--y",y),toolTip.style.opacity="1",toolTip.classList.toggle("tooltip--right",e.offsetX>chartMid)})}(segment,toolTip,chart)})};window.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll(".doughnut-chart").forEach(module=>{(module=>{const charts=module.querySelectorAll(".doughnut-chart__container");new IntersectionObserver(entries=>{entries.forEach(entry=>{entry.isIntersecting?(charts.forEach(chart=>{const toolTip=chart.querySelector(".doughnut-chart__tooltip"),segments=chart.querySelectorAll(".doughnut-chart__segment");setUpSegments(segments,module,toolTip,chart)}),module.classList.add("doughnut-chart--animate")):(module.classList.remove("doughnut-chart--animate"),charts.forEach(chart=>{chart.querySelectorAll(".doughnut-chart__segment").forEach(segment=>{segment.setAttribute("stroke-dashoffset",0)})}))})},{threshold:.1}).observe(module)})(module)})})}();
2//# sourceURL=https://22522971.fs1.hubspotusercontent-na1.net/hubfs/22522971/hub_generated/module_assets/1/191216163990/1785337245276/module_doughnut-chart.js

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.