@mescius/dsimageviewer
Version:
Document Solutions Image Viewer
362 lines (309 loc) • 14 kB
HTML
<html class="default" lang="en" data-base="../"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>PaintObjectParameters | Document Solutions Image Viewer - v9.1.3</title><meta name="description" content="Documentation for Document Solutions Image Viewer"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><link rel="stylesheet" href="../assets/custom.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script><script async src="../assets/hierarchy.js" id="tsd-hierarchy-script"></script><style type="text/css">
/* typedoc-theme-fresh */
/* @view-transition {
navigation: auto;
} */
:root {
--light-color-background: #fafafe;
--light-color-background-active: #eaeced;
--light-color-text: #222222;
--light-color-text-aside: #5e5e5e;
--dark-color-background: #1a1a1c;
--dark-color-background-active: #2f2f2b;
--dark-color-text: #dfdfd6;
--dark-color-text-aside: #b0b0b0;
--dim-header-height: 2.5rem;
--dim-footer-height: 0px;
--light-code-background: #ffffff18;
--dark-code-background: #00000018;
}
body {
padding: 0;
margin: 0;
& > .container.container-main {
margin: 0 auto;
margin-top: var(--dim-header-height);
--dim-container-main-margin-y: 0px;
}
}
@media (prefers-color-scheme: light) {
::selection {
background-color: #11111a20;
}
}
@media (prefers-color-scheme: dark) {
::selection {
background-color: #bbbbff48;
}
}
:root[data-theme="light"] {
::selection {
background-color: #11111a20;
}
}
:root[data-theme="dark"] {
::selection {
background-color: #bbbbff48;
}
}
h1, h2, h3, h4, h5, h6 {
font-weight: 500;
}
.tsd-page-toolbar {
position: fixed;
background: linear-gradient(
to bottom,
color-mix(in srgb, var(--color-background) 80%, transparent) 60%,
transparent
);
backdrop-filter: blur(2px);
border-bottom: none;
.title {
font-weight: 500;
font-size: 18px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
min-width: 0;
margin-right: auto;
&:hover {
color: var(--color-contrast-text);
text-decoration: none;
}
}
.tsd-theme-toggle {
display: flex;
position: relative;
margin-right: 12px;
color: var(--color-text-aside);
select {
cursor: pointer;
border: 1px solid var(--color-background-active);
border-radius: 4px;
padding: 6px 8px;
padding-left: 32px; /* Space for the icon */
font-size: 14px;
background: transparent;
transition: background-color 200ms;
color: var(--color-text-aside);
/* for Firefox and Chrome: these are inconsistent */
-moz-appearance: none;
-webkit-appearance: none;
&:hover {
background-color: var(--color-background-active);
}
}
}
}
.tsd-widget {
display: flex;
align-items: center;
height: auto;
width: auto;
padding: 4px;
font-size: 14px;
border-radius: 4px;
transition: background-color 200ms;
color: var(--color-text-aside);
opacity: 100%;
&:hover {
background-color: var(--color-background-active);
}
}
#tsd-search-results {
& > li {
padding-inline: 6px;
transition: background-color 200ms;
}
a:hover {
text-decoration: none;
}
}
.col-content {
overflow: hidden;
padding-block: 24px;
& > .tsd-typography {
padding-bottom: 24px;
}
}
.col-sidebar {
top: var(--dim-header-height); /* Relevant for tablet layout. */
}
.site-menu {
top: var(--dim-header-height);
padding-block: 24px;
box-sizing: border-box;
}
.page-menu {
top: var(--dim-header-height);
padding-block: 48px 24px;
box-sizing: border-box;
}
.tsd-navigation,
.tsd-page-navigation {
> details {
margin-bottom: 8px;
}
a {
border-radius: 4px;
padding-inline: 6px;
margin-bottom: 2px;
}
a:hover {
text-decoration: none;
background-color: var(--color-background-active);
}
a.current {
background-color: var(--color-background-active);
span {
color: var(--color-contrast-text);
}
}
}
.tsd-navigation {
& > a {
/* Top-level navigation anchor. */
margin-block: 16px;
font-size: 18px;
background: transparent ;
padding: 0;
&:hover {
color: var(--color-contrast-text);
}
}
}
.tsd-page-navigation {
border-left: 1px solid var(--color-background-active);
padding-left: 4px;
padding-block: 4px;
}
.tsd-page-navigation-section {
& > summary > svg {
margin-right: 0;
}
& > div {
margin-left: 24px;
}
}
.tsd-page-title {
color: var(--color-contrast-text);
}
h1 > code.tsd-tag {
margin-left: 12px;
}
code.tsd-tag {
display: inline-block;
transform: translateY(-0.1em);
background: var(--color-background-secondary);
border: 0;
border-radius: 8px;
padding: 2px 4px;
}
.tsd-breadcrumb {
margin-bottom: 12px;
li:after {
content: " › ";
opacity: 0.4;
}
li:last-of-type::after {
content: "";
}
}
.tsd-signature,
.tsd-signatures .tsd-signature {
border: 0;
border-radius: 8px;
background: var(--color-background-secondary);
font-weight: 500;
padding: 10px 8px;
line-height: 1.3;
}
.tsd-anchor-icon {
color: var(--color-text-aside);
padding-bottom: 1px;
}
.tsd-kind-icon {
filter: grayscale(0.5) opacity(0.8);
}
/* Accordion icon */
.tsd-accordion-summary > svg {
color: var(--color-text-aside);
opacity: 50%;
stroke-width: 1px;
transition: transform 200ms ease-in-out;
}
.tsd-accordion-summary > svg:has(+ h2) {
height: 24px;
width: 24px;
}
/* Desktop sizing */
@media (min-width: 1200px) {
.container-main {
grid-template-columns: minmax(0, 1.1fr) minmax(0, 2.5fr) minmax(0, 17rem);
}
.site-menu {
padding-right: 8px;
}
.page-menu {
padding-left: 24px;
}
.tsd-widget.menu {
display: none;
}
}
/* Tablet sizing */
@media (min-width: 770px) and (max-width: 1199px) {
.page-menu {
padding-block: 24px 24px;
}
.site-menu {
padding-block: 0 24px;
margin-top: 0;
}
.tsd-widget.menu {
display: none;
}
.lg-show {
display: none ;
}
}
/* Mobile sizing */
@media (max-width: 769px) {
.page-menu {
display: none;
}
.site-menu {
padding: 0;
}
.container {
padding: 0 1rem;
}
.has-menu .col-sidebar {
padding: 0 1rem;
max-height: 100dvh;
}
.lg-show {
display: none ;
}
.md-show {
display: none ;
}
}
</style></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => window.app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><a href="../index.html" class="title">Document Solutions Image Viewer</a><div id="tsd-toolbar-links"></div><div class="tsd-theme-toggle md-show" style="position: relative"><div style="position: absolute; left: 8px; top: 4px; pointer-events: none"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun-moon-icon lucide-sun-moon"><path d="M12 2v2"></path><path d="M14.837 16.385a6 6 0 1 1-7.223-7.222c.624-.147.97.66.715 1.248a4 4 0 0 0 5.26 5.259c.589-.255 1.396.09 1.248.715"></path><path d="M16 12a4 4 0 0 0-4-4"></path><path d="m19 5-1.256 1.256"></path><path d="M20 12h2"></path></svg></div><select id="tsd-theme"><option value="os">System</option><option value="light">Light</option><option value="dark">Dark</option></select></div><button id="tsd-search-trigger" class="tsd-widget" aria-label="Search" style="
border: 1px solid var(--color-background-active);
border-radius: 4px;
margin-left: 8px;
"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search-icon lucide-search" style="margin-bottom: 1px; margin-left: 4px; margin-right: 4px;"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg><span class="lg-show" style="margin-left: 4px; margin-right: 12ch;">Search…</span></button><dialog id="tsd-search" aria-label="Search"><input role="combobox" id="tsd-search-input" aria-controls="tsd-search-results" aria-autocomplete="list" aria-expanded="true" autocapitalize="off" autocomplete="off" placeholder="Search the docs" maxLength="100"/><ul role="listbox" id="tsd-search-results"></ul><div id="tsd-search-status" aria-live="polite" aria-atomic="true"><div>Preparing search index...</div></div></dialog><a href="#" class="tsd-widget menu" id="tsd-toolbar-menu-trigger" data-toggle="menu" aria-label="Menu" style="
border: 1px solid var(--color-background-active);
border-radius: 4px;
margin-left: 4px;
"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu-icon lucide-menu" style="margin-left: 4px; margin-right: 4px;"><path d="M4 5h16"></path><path d="M4 12h16"></path><path d="M4 19h16"></path></svg></a></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb" aria-label="Breadcrumb"><li><a href="" aria-current="page">PaintObjectParameters</a></li></ul><h1>Interface PaintObjectParameters</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Extended paint object parameters with additional rendering options</p>
</div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface</span> <span class="tsd-kind-interface">PaintObjectParameters</span> <span class="tsd-signature-symbol">{</span><br/> <a class="tsd-kind-property" href="#isdesigntime">isDesignTime</a><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">;</span><br/> <a class="tsd-kind-property" href="#context">context</a><span class="tsd-signature-symbol">:</span> <a href="ImageLayer.html" class="tsd-signature-type tsd-kind-interface">ImageLayer</a><span class="tsd-signature-symbol">;</span><br/><span class="tsd-signature-symbol">}</span></div><div style="margin-top: 64px"></div><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg><h2>Properties</h2></summary><section><section class="tsd-panel tsd-member"><h3 class="tsd-anchor-link" id="isdesigntime"><code class="tsd-tag">Optional</code><span>is<wbr/>Design<wbr/>Time</span><a href="#isdesigntime" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">isDesignTime</span><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div><div class="tsd-comment tsd-typography"><p>Whether the object is being rendered in design/edit mode.</p>
<p>In design mode (when editing objects), each object is rendered on its own canvas.
Padding is applied around the canvas to account for effects like shadows or outlines.
Rotation in this mode is handled at the DOM level (via CSS transform), so canvas
rotation is skipped.</p>
<p>In runtime (final rendering), all objects are drawn on a single shared canvas.
In this case, padding is not applied and rotation is handled via canvas transforms.</p>
</div></section><section class="tsd-panel tsd-member"><h3 class="tsd-anchor-link" id="context"><span>context</span><a href="#context" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">context</span><span class="tsd-signature-symbol">:</span> <a href="ImageLayer.html" class="tsd-signature-type tsd-kind-interface">ImageLayer</a></div><div class="tsd-comment tsd-typography"><p>Paint context</p>
</div></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-page-navigation"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#isdesigntime"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>is<wbr/>Design<wbr/>Time</span></a><a href="#context"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>context</span></a></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../index.html">Document Solutions Image Viewer - v9.1.3</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><div class="overlay"></div></body></html>