| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <head>
- <meta http-equiv="content-type" content="text/html; charset=utf-8" />
- <meta name="generator" content="JsDoc Toolkit" />
-
- <title>JsDoc Reference - pv.Label</title>
- <style type="text/css">
- /* default.css */
- body
- {
- font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
- width: 800px;
- }
- .header
- {
- clear: both;
- background-color: #ccc;
- padding: 8px;
- }
- h1
- {
- font-size: 150%;
- font-weight: bold;
- padding: 0;
- margin: 1em 0 0 .3em;
- }
- hr
- {
- border: none 0;
- border-top: 1px solid #7F8FB1;
- height: 1px;
- }
- pre.code
- {
- display: block;
- padding: 8px;
- border: 1px dashed #ccc;
- }
- #index
- {
- margin-top: 24px;
- float: left;
- width: 160px;
- position: absolute;
- left: 8px;
- background-color: #F3F3F3;
- padding: 8px;
- }
- #content
- {
- margin-left: 190px;
- width: 600px;
- }
- .classList
- {
- list-style-type: none;
- padding: 0;
- margin: 0 0 0 8px;
- font-family: arial, sans-serif;
- font-size: 1em;
- overflow: auto;
- }
- .classList li
- {
- padding: 0;
- margin: 0 0 8px 0;
- }
- .summaryTable { width: 100%; }
- h1.classTitle
- {
- font-size:170%;
- line-height:130%;
- }
- h2 { font-size: 110%; }
- caption, div.sectionTitle
- {
- background-color: #7F8FB1;
- color: #fff;
- font-size:130%;
- text-align: left;
- padding: 2px 6px 2px 6px;
- border: 1px #7F8FB1 solid;
- }
- div.sectionTitle { margin-bottom: 8px; }
- .summaryTable thead { display: none; }
- .summaryTable td
- {
- vertical-align: top;
- padding: 4px;
- border-bottom: 1px #7F8FB1 solid;
- border-right: 1px #7F8FB1 solid;
- }
- /*col#summaryAttributes {}*/
- .summaryTable td.attributes
- {
- border-left: 1px #7F8FB1 solid;
- width: 140px;
- text-align: right;
- }
- td.attributes, .fixedFont
- {
- line-height: 15px;
- color: #002EBE;
- font-family: "Courier New",Courier,monospace;
- font-size: 13px;
- }
- .summaryTable td.nameDescription
- {
- text-align: left;
- font-size: 13px;
- line-height: 15px;
- }
- .summaryTable td.nameDescription, .description
- {
- line-height: 15px;
- padding: 4px;
- padding-left: 4px;
- }
- pre
- {
- border-left: solid 10px #ddd;
- padding-left: 1.5em;
- }
- .summaryTable { margin-bottom: 8px; }
- ul.inheritsList
- {
- list-style: square;
- margin-left: 20px;
- padding-left: 0;
- }
- .detailList {
- margin-left: 20px;
- line-height: 15px;
- }
- .detailList dt { margin-left: 20px; }
- .detailList .heading
- {
- font-weight: bold;
- padding-bottom: 6px;
- margin-left: 0;
- }
- .light, td.attributes, .light a:link, .light a:visited
- {
- color: #777;
- font-style: italic;
- }
- .fineprint
- {
- text-align: right;
- font-size: 10px;
- }
- </style>
- </head>
- <body>
- <!-- ============================== header ================================= -->
- <!-- begin static/header.html -->
- <div id="header">
- </div>
- <!-- end static/header.html -->
- <!-- ============================== classes index ============================ -->
- <div id="index">
- <!-- begin publish.classesIndex -->
- <div align="center"><a href="../index.html">Class Index</a>
- | <a href="../files.html">File Index</a></div>
- <hr />
- <h2>Classes</h2>
- <ul class="classList">
-
- <li><i><a href="../symbols/_global_.html">_global_</a></i></li>
-
- <li><a href="../symbols/Array.html">Array</a></li>
-
- <li><a href="../symbols/Date.html">Date</a></li>
-
- <li><a href="../symbols/pv.html">pv</a></li>
-
- <li><a href="../symbols/pv.Anchor.html">pv.Anchor</a></li>
-
- <li><a href="../symbols/pv.Area.html">pv.Area</a></li>
-
- <li><a href="../symbols/pv.Bar.html">pv.Bar</a></li>
-
- <li><a href="../symbols/pv.Color.html">pv.Color</a></li>
-
- <li><a href="../symbols/pv.Color.Hsl.html">pv.Color.Hsl</a></li>
-
- <li><a href="../symbols/pv.Color.Rgb.html">pv.Color.Rgb</a></li>
-
- <li><a href="../symbols/pv.Colors.html">pv.Colors</a></li>
-
- <li><a href="../symbols/pv.Dot.html">pv.Dot</a></li>
-
- <li><a href="../symbols/pv.Flatten.html">pv.Flatten</a></li>
-
- <li><a href="../symbols/pv.Image.html">pv.Image</a></li>
-
- <li><a href="../symbols/pv.Label.html">pv.Label</a></li>
-
- <li><a href="../symbols/pv.Layout.grid.html">pv.Layout.grid</a></li>
-
- <li><a href="../symbols/pv.Layout.icicle.html">pv.Layout.icicle</a></li>
-
- <li><a href="../symbols/pv.Layout.stack.html">pv.Layout.stack</a></li>
-
- <li><a href="../symbols/pv.Layout.sunburst.html">pv.Layout.sunburst</a></li>
-
- <li><a href="../symbols/pv.Layout.treemap.html">pv.Layout.treemap</a></li>
-
- <li><a href="../symbols/pv.Line.html">pv.Line</a></li>
-
- <li><a href="../symbols/pv.Mark.html">pv.Mark</a></li>
-
- <li><a href="../symbols/pv.Nest.html">pv.Nest</a></li>
-
- <li><a href="../symbols/pv.ns.html">pv.ns</a></li>
-
- <li><a href="../symbols/pv.Panel.html">pv.Panel</a></li>
-
- <li><a href="../symbols/pv.Rule.html">pv.Rule</a></li>
-
- <li><a href="../symbols/pv.Scale.linear.html">pv.Scale.linear</a></li>
-
- <li><a href="../symbols/pv.Scale.log.html">pv.Scale.log</a></li>
-
- <li><a href="../symbols/pv.Scale.ordinal.html">pv.Scale.ordinal</a></li>
-
- <li><a href="../symbols/pv.Tree.html">pv.Tree</a></li>
-
- <li><a href="../symbols/pv.Vector.html">pv.Vector</a></li>
-
- <li><a href="../symbols/pv.version.html">pv.version</a></li>
-
- <li><a href="../symbols/pv.Wedge.html">pv.Wedge</a></li>
-
- </ul>
- <hr />
- <!-- end publish.classesIndex -->
- </div>
-
- <div id="content">
- <!-- ============================== class title ============================ -->
- <h1 class="classTitle">
-
- Class pv.Label
- </h1>
- <!-- ============================== class summary ========================== -->
- <p class="description">
- <br />Extends
- <a href="../symbols/pv.Mark.html">pv.Mark</a>.<br />
-
-
- Represents a text label, allowing textual annotation of other marks or
- arbitrary text within the visualization. The character data must be plain
- text (unicode), though the text can be styled using the <a href="#font">#font</a>
- property. If rich text is needed, external HTML elements can be overlaid on
- the canvas by hand.
- <p>Labels are positioned using the box model, similarly to Dot. Thus,
- a label has no width or height, but merely a text anchor location. The text
- is positioned relative to this anchor location based on the
- <a href="#textAlign">#textAlign</a>, <a href="#textBaseline">#textBaseline</a> and <a href="#textMargin">#textMargin</a> properties.
- Furthermore, the text may be rotated using <a href="#textAngle">#textAngle</a>.
- <p>Labels ignore events, so as to not interfere with event handlers on
- underlying marks, such as bars. In the future, we may support event handlers
- on labels.
- <p>See also the <a href="../../api/Label.html">Label guide</a>.
-
-
- <br /><i>Defined in: </i> <a href="../symbols/src/mark_Label.js.html">Label.js</a>.
-
- </p>
- <!-- ============================== constructor summary ==================== -->
-
- <table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class pv.Label.">
- <caption>Class Summary</caption>
- <thead>
- <tr>
- <th scope="col">Constructor Attributes</th>
- <th scope="col">Constructor Name and Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription" >
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#constructor">pv.Label</a></b>()
- </div>
- <div class="description">Constructs a new label mark with default properties.</div>
- </td>
- </tr>
- </tbody>
- </table>
-
- <!-- ============================== properties summary ===================== -->
-
-
-
- <table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class pv.Label.">
- <caption>Field Summary</caption>
- <thead>
- <tr>
- <th scope="col">Field Attributes</th>
- <th scope="col">Field Name and Description</th>
- </tr>
- </thead>
- <tbody>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#defaults">defaults</a></b>
- </div>
- <div class="description">Default properties for labels.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#font">font</a></b>
- </div>
- <div class="description">The font format, per the CSS Level 2 specification.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#text">text</a></b>
- </div>
- <div class="description">The character data to render; a string.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textAlign">textAlign</a></b>
- </div>
- <div class="description">The horizontal text alignment.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textAngle">textAngle</a></b>
- </div>
- <div class="description">The rotation angle, in radians.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textBaseline">textBaseline</a></b>
- </div>
- <div class="description">The vertical text alignment.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textMargin">textMargin</a></b>
- </div>
- <div class="description">The text margin; may be specified in pixels, or in font-dependent units (such
- as ".1ex").</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textShadow">textShadow</a></b>
- </div>
- <div class="description">A list of shadow effects to be applied to text, per the CSS Text Level 3
- text-shadow property.</div>
- </td>
- </tr>
-
- <tr>
- <td class="attributes"> </td>
- <td class="nameDescription">
- <div class="fixedFont">
- <b><a href="../symbols/pv.Label.html#textStyle">textStyle</a></b>
- </div>
- <div class="description">The text color.</div>
- </td>
- </tr>
-
- </tbody>
- </table>
-
-
-
- <dl class="inheritsList">
- <dt>Fields borrowed from class <a href="../symbols/pv.Mark.html">pv.Mark</a>: </dt><dd><a href="../symbols/pv.Mark.html#bottom">bottom</a>, <a href="../symbols/pv.Mark.html#childIndex">childIndex</a>, <a href="../symbols/pv.Mark.html#cursor">cursor</a>, <a href="../symbols/pv.Mark.html#data">data</a>, <a href="../symbols/pv.Mark.html#index">index</a>, <a href="../symbols/pv.Mark.html#left">left</a>, <a href="../symbols/pv.Mark.html#parent">parent</a>, <a href="../symbols/pv.Mark.html#proto">proto</a>, <a href="../symbols/pv.Mark.html#reverse">reverse</a>, <a href="../symbols/pv.Mark.html#right">right</a>, <a href="../symbols/pv.Mark.html#root">root</a>, <a href="../symbols/pv.Mark.html#scene">scene</a>, <a href="../symbols/pv.Mark.html#title">title</a>, <a href="../symbols/pv.Mark.html#top">top</a>, <a href="../symbols/pv.Mark.html#type">type</a>, <a href="../symbols/pv.Mark.html#visible">visible</a></dd>
- </dl>
-
-
- <!-- ============================== methods summary ======================== -->
-
-
-
-
-
- <dl class="inheritsList">
- <dt>Methods borrowed from class <a href="../symbols/pv.Mark.html">pv.Mark</a>: </dt><dd><a href="../symbols/pv.Mark.html#add">add</a>, <a href="../symbols/pv.Mark.html#anchor">anchor</a>, <a href="../symbols/pv.Mark.html#anchorTarget">anchorTarget</a>, <a href="../symbols/pv.Mark.html#cousin">cousin</a>, <a href="../symbols/pv.Mark.html#def">def</a>, <a href="../symbols/pv.Mark.html#event">event</a>, <a href="../symbols/pv.Mark.html#extend">extend</a>, <a href="../symbols/pv.Mark.html#first">first</a>, <a href="../symbols/pv.Mark.html#last">last</a>, <a href="../symbols/pv.Mark.html#mouse">mouse</a>, <a href="../symbols/pv.Mark.html#render">render</a>, <a href="../symbols/pv.Mark.html#sibling">sibling</a></dd>
- </dl>
-
-
- <!-- ============================== events summary ======================== -->
-
- <!-- ============================== constructor details ==================== -->
-
- <div class="details"><a name="constructor"> </a>
- <div class="sectionTitle">
- Class Detail
- </div>
-
- <div class="fixedFont">
- <b>pv.Label</b>()
- </div>
-
- <div class="description">
- Constructs a new label mark with default properties. Labels are not typically
- constructed directly, but by adding to a panel or an existing mark via
- <a href="../symbols/pv.Mark.html#add">pv.Mark#add</a>.
-
- </div>
-
-
-
-
-
-
-
-
-
-
-
- </div>
-
- <!-- ============================== field details ========================== -->
-
- <div class="sectionTitle">
- Field Detail
- </div>
-
- <a name="defaults"> </a>
- <div class="fixedFont">
-
- <span class="light">{<a href="../symbols/pv.Label.html">pv.Label</a>}</span>
- <b>defaults</b>
-
- </div>
- <div class="description">
- Default properties for labels. See the individual properties for the default
- values.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="font"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>font</b>
-
- </div>
- <div class="description">
- The font format, per the CSS Level 2 specification. The default font is "10px
- sans-serif", for consistency with the HTML 5 canvas element specification.
- Note that since text is not wrapped, any line-height property will be
- ignored. The other font-style, font-variant, font-weight, font-size and
- font-family properties are supported.
-
-
- </div>
-
-
-
-
-
- <dl class="detailList">
- <dt class="heading">See:</dt>
-
- <dd><a href="http://www.w3.org/TR/CSS2/fonts.html#font-shorthand">CSS2 fonts</a></dd>
-
- </dl>
-
-
- <hr />
-
- <a name="text"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>text</b>
-
- </div>
- <div class="description">
- The character data to render; a string. The default value of the text
- property is the identity function, meaning the label's associated datum will
- be rendered using its <tt>toString</tt>.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="textAlign"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>textAlign</b>
-
- </div>
- <div class="description">
- The horizontal text alignment. One of:<ul>
- <li>left
- <li>center
- <li>right
- </ul>The default horizontal alignment is left.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="textAngle"> </a>
- <div class="fixedFont">
-
- <span class="light">{number}</span>
- <b>textAngle</b>
-
- </div>
- <div class="description">
- The rotation angle, in radians. Text is rotated clockwise relative to the
- anchor location. For example, with the default left alignment, an angle of
- Math.PI / 2 causes text to proceed downwards. The default angle is zero.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="textBaseline"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>textBaseline</b>
-
- </div>
- <div class="description">
- The vertical text alignment. One of:<ul>
- <li>top
- <li>middle
- <li>bottom
- </ul>The default vertical alignment is bottom.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="textMargin"> </a>
- <div class="fixedFont">
-
- <span class="light">{number}</span>
- <b>textMargin</b>
-
- </div>
- <div class="description">
- The text margin; may be specified in pixels, or in font-dependent units (such
- as ".1ex"). The margin can be used to pad text away from its anchor location,
- in a direction dependent on the horizontal and vertical alignment
- properties. For example, if the text is left- and middle-aligned, the margin
- shifts the text to the right. The default margin is 3 pixels.
-
-
- </div>
-
-
-
-
-
-
- <hr />
-
- <a name="textShadow"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>textShadow</b>
-
- </div>
- <div class="description">
- A list of shadow effects to be applied to text, per the CSS Text Level 3
- text-shadow property. An example specification is "0.1em 0.1em 0.1em
- rgba(0,0,0,.5)"; the first length is the horizontal offset, the second the
- vertical offset, and the third the blur radius.
-
-
- </div>
-
-
-
-
-
- <dl class="detailList">
- <dt class="heading">See:</dt>
-
- <dd><a href="http://www.w3.org/TR/css3-text/#text-shadow">CSS3 text</a></dd>
-
- </dl>
-
-
- <hr />
-
- <a name="textStyle"> </a>
- <div class="fixedFont">
-
- <span class="light">{string}</span>
- <b>textStyle</b>
-
- </div>
- <div class="description">
- The text color. The name "textStyle" is used for consistency with "fillStyle"
- and "strokeStyle", although it might be better to rename this property (and
- perhaps use the same name as "strokeStyle"). The default color is black.
-
-
- </div>
-
-
-
-
-
- <dl class="detailList">
- <dt class="heading">See:</dt>
-
- <dd><a href="../symbols/pv.html#.color">pv.color</a></dd>
-
- </dl>
-
-
-
-
-
- <!-- ============================== method details ========================= -->
-
-
- <!-- ============================== event details ========================= -->
-
-
- <hr />
- </div>
-
- <!-- ============================== footer ================================= -->
- <div class="fineprint" style="clear:both">
-
- Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.0 on Tue Oct 06 2009 09:59:02 GMT-0700 (PDT)
- </div>
- </body>
- </html>
|