Več

Letak - Skrivanje oznak, ko je prikazano katero koli pojavno okno?


Sem nov v Leafletu in našel sem naslednjo rešitev za dodajanje statičnih oznak funkcijam na mojem zemljevidu:

L.CircleMarker.include ({bindLabel: function (content, options) {if (! This._label || this._label.options! == options) {this._label = nova L.Label (možnosti, to);} this._label.setContent (content); this._labelNoHide = options && options.noHide; if (! this._showLabelAdded) {if (this._labelNoHide) {this .on ('remove', this.hideLabel, this) .on ('move', this._moveLabel, this); this._showLabel ({latlng: this.getLatLng ()});} else {this .on ('miška', this._showLabel, to) .on ('premikanje miške' , this._moveLabel, this) .on ('mouseout remove', this._hideLabel, this); if (L.Browser.touch) {this.on ('klik', this._showLabel, to);}} to. _showLabelAdded = true;} vrni to;}, unbindLabel: function () {if (this._label) {this._hideLabel (); this._label = null; this._showLabelAdded = false; if (this._labelNoHide) {this. off ('remove', this._hideLabel, this) .off ('move', this._moveLabel, this);} else {this .off ('prehod miške', this._showLabel, to) .off ('premikanje miške', this._moveLabel, this) .off ('m ouseout remove ', this._hideLabel, this); }} vrni to; }}); L.marker ([-37.7772, 175.2606]). BindLabel ('Poglej razkrito oznako!'). AddTo (zemljevid);

Stvar je v tem, da če so oznake prevelike, se oznake prikažejo nad pojavnim oknom, ne zadaj.

Ne vem, kako skriti te oznake, ko se prikaže pojavno okno?


Lahko preprosto naredite preprost trik css pri odpiranju pojavnih oken. Predvidevam, da ste uporabili jquery, če kode niste ustrezno spremenili. Med dodajanjem oznake jih dodajte v določen razred in nato, ko je pojavno okno odprto, dodajte to

map.on ('popupopen', function () {// map je ime zemljevida, ki ste ga dali zemljevidu letaka $ ('. classoflabels'). addClass ('hidden');}) map.on ('popupclose' , function () {// map je ime zemljevida, ki ste ga dali zemljevidu letaka $ ('. classoflabels'). removeClass ('hidden');})

upam da ti pomaga.


Oznake lahko odstranite z removeLayer (oznako), ko se prikaže pojavno okno, in jih znova dodate na zemljevid, ko se zapre.


Skrivanje dejavnosti Facebook & ldquoKomentar & rdquo in & ldquoDelovanje prijateljev & rdquo preprečuje, da bi se na mojem zidu prikazovale posodobitve stanja

Na Facebooku, ker sem za svoje "Skrite vrste zgodb" izbral "Dejavnost komentarjev" in "Prijateljstvo", kadar koli objavim povezavo ali status na svojem zidu, ta izgine z moje stene in je viden samo v viru novic.

Vem, da moji prijatelji lahko vidijo, kaj objavim na svojem viru novic, ne pa tudi, ko preverijo mojo steno.

Je hrošč? Če je predvideno, kako naj moja stena prikaže moje povezave in posodobitve stanja, pri tem pa skrije »Dejavnost komentarjev« in »Prijateljska dejavnost«?


Kako prikazati modalno pojavno okno z obrazcem v komponenti Lightning

Ko kliknem na dogodek v koledarju, moram prikazati modalno pojavno okno z urejanjem podrobnosti o tem dogodku. Prosim, če mi kdo predlaga pravi način prikaza pojavnega okna, rad bi poklical "Klik na dogodek" funkcija celotnega koledarja za prikaz pojavnih oken.

Krmilnik na strani odjemalca

To je moja stran VF, ki uporablja komponento strele

In rad bi prikazal pojavno okno, kot je ta,

Prosim, če mi kdo predlaga boljšo idejo,


Korak: Oglejte si fotografije v pojavnem oknu

Odprite lastnosti točkovne plasti:

Nasvet za zemljevid HTML: preprosto uporabite oznako HTML & ltimg & gt z virom fotografije.

Tukaj je moj primer uporabe foto polja (iz tabele atributov). Če je pot do datoteke lokalna - to je na vašem lokalnem pogonu, jo boste morali vključiti mapa:/// označuje lokalno shranjeno fotografijo.

Preprost primer: & ltimg src = "file: /// [ % photo %]" & gt

Še en primer: opis je novo polje, ki sem ga dodal svojemu atributu (glej korak navzdol)
& lttable & gt
& lttr & gt
& ltth & gt [ % descriptionptio %] & lt/th & gt
& lt/tr & gt
& lttr & gt
& ltth & gt & ltimg src = "file: /// [ % photo %]" & gt & lt/th & gt
& lt/tr & gt
& lt/table & gt

Če si želite ogledati fotografije v pojavnem oknu:

Vklopite ali omogočite zemljevid Nasvet in

Premaknite miško na točko na zemljevidu, da si ogledate svojo fotografijo. Upoštevajte, da moja fotografija vsebuje tudi opis na vrhu - ki ga lahko dodate z urejanjem tabele atributov (glejte Neobvezni koraki spodaj)


4 odgovori 4

Na splošno uporabljam naslednje smernice za uporabo načinov:

Je osredotočen? Vsakič, ko pred uporabnikom postavite modal, motite njihov potek dela. Motnje niso vedno slabe. Včasih si to želiš. Vendar se morate zavedati, da to počnete, in to uporabiti v svojo korist. Elementi v modalu morajo biti samostojni. Dobro pravilo je, da se modal uporablja le, če je vsebina osredotočena ali pa ga je mogoče prikazati na svoji strani. Primeri tega so Pinterest kartice, Trello zatiči, oz Behance objave. Upoštevajte, da so vse samostojne objave, do katerih je lahko globoko povezano, vendar vsi uporabljajo načine v vrstici, da se uporabnikova pozornost osredotoči na eno posebno postavko. Uporabniku se za interakcijo z njim ni treba spomniti drugih predmetov.

Ali je dosledno? Brez jasnih smernic, kdaj in kako se lahko uporabljajo predmeti, kot so načini uporabe, lahko izgubijo svojo učinkovitost, ker se bodo uporabljali povsod. Na žalost je slab primer tega tukaj Stack Exchange. V zgornjem meniju vašega uporabniškega profila so povezave do možnosti »Urejanje • Privilegiji • Nastavitve • Flur • Aplikacije«, vse te pa vodijo na druge strani. Zadnji element na tem seznamu, "Moje prijave", se odpre modalno. To ni v skladu s tem, kako se drugi načini uporabljajo za opozarjanje uporabnika ali pomoč pri osredotočanju na nalogo.

Je preveč zapleten? Uporaba modala na vrhu drugega modala je velika rdeča zastava, da se je v vašem delovnem toku nekaj pokvarilo. Če vaš potek dela zahteva drugi način, verjetno imate nekaj večjih težav s kompleksnostjo v svojem načinu. Ne pozabite: nekateri najboljši primeri uporabe modal so osredotočena in preprosta vsebina. Kvadratni prostor pri dodajanju določene vsebine uporabite več načinov. In čeprav mi je izdelek všeč, je to izdelek, ki ga v izdelku najbolj sovražim. To je zmedeno in dolgočasno.

Modali so odlično orodje. Njihova prekomerna uporaba pa lahko zmanjša vašo učinkovitost pri vašem delovnem toku.


Kot je komentiral uporabnik246, lahko napišete metodo za iskanje 'X' v pojavnem oknu in jo kliknete, če jo najdete. Nato lahko določite metodo po meri, da poiščete element na strani, nekako takole (vrsta psevdo kode):

Znotraj metode closethepopup () se lahko odločite, da dodate nekaj logike, da vrnete false, če pojavnega okna ne najdete

Če želite zapreti pojavno okno, morate najprej preveriti, katero okno je aktivno v vaši aplikaciji (pojavno okno ali glavno okno).

Če je pojavno okno aktivno, lahko uporabite driver.close () ALI

Če je glavno okno aktivno (Osredotočeno), morate zapreti to pojavno okno z upravljalnikom oken.

Preizkusite to. upam da ti bo to pomagalo ..

S to kodo lahko zaprete pojavno okno s klikom na [X].


Nato se morate odjaviti ali spremeniti slog, da znova naložite nove nastavitve.

Preprosto uredite datoteko /usr/share/themes/Ambiance/gtk-2.0/gtkrc iskanje

spremenite odstotek sence z 0,94 na vse, kar je vidno, na primer 0,54

Vaš posnetek zaslona izgleda, kar dobim. Meni je to v redu, če pa na vašem zaslonu ni dobro, bi morali spremeniti barve tako, da odprete Okno > Nastavitve > Splošno > Videz > Barve in pisave in spreminjanje ene ali obeh barv ozadja »Content Assist«, »Barva ospredja Content Assist«. Vendar ni videti, da lahko ločeno nadzirate barve za označene in druge vrstice.

Pri uporabi privzete barvne sheme Ubuntu 12.04 Ambiance sem spremenil barvo ozadja opisa orodja v tooltip_bg_color:#7F7F7F, kar je omogočilo pojavnim oknom inšpektorja, da prikažejo vidno besedilo:

Odjavite se iz ubuntuja in se znova prijavite, da vidite učinek

Za več izkušenj z Ubuntu poskusite uporabiti #DA8C6D kot novo barvo ozadja.

Morda je to neumen odgovor, ampak. ali je možno, da je barva pisave nastavljena na belo, tako da pravzaprav ne vidite ničesar? Mislim, da lahko barvo pisave spremenite nekje v nastavitvah.


3 odgovori 3

Če želite onemogočiti zaščito sistemske integritete (SIP), sledite spodnjim korakom.

Začnite z zagonom na macOS Big Sur in odpiranjem okna aplikacije Terminal. Nato vnesite spodnji ukaz. To bo ustvarilo spremenljivko NVRAM z želeno vrednostjo, vendar z napačno črkovanim imenom spremenljivke. Ta napačno črkovanje bo odpravljeno v naslednjem koraku.

Zaustavitev sistema macOS. V oknu Nastavitve za navidezni stroj izberite Startup Disk. Držite tipko možnosti in izberite gumb Restart to Firmware…, kot je prikazano spodaj.

Izberite notranjo lupino EFI, kot je prikazano spodaj.

Če želite, vnesite spodnji ukaz, da v celoti izkoristite okno.

Trenutni datotečni sistem nastavite na nosilec EFI. To bi moral biti preslikani datotečni sistem fs0, zato morate vnesti naslednje

Nato preverite oznako EFI tako, da vnesete spodnji ukaz.

Če je narobe, poskusite fs1:, fs2:, fs3:,.

Vnesite spodnji ukaz, da spremenite spremenljivko Asr-active-config v datoteko csr.bin.

Opomba: Za več informacij o tem ukazu vnesite help -b dmpstore.

Nato vnesite spodnji ukaz za urejanje datoteke csr.bin. Črkovanje boste morali popraviti tako, da črko A zamenjate s črko c. To lahko storite tako, da v prvo vrstico vnesete 63 nad 41.

Popravljena datoteka se prikaže, kot je prikazano spodaj. Ko končate, shranite spremembe in zapustite.

Opomba: Vrednost spremenljivke je shranjena v zadnjih 4 bajtih te datoteke.

Vnesite spodnji ukaz, da ustvarite spremenljivko csr-active-config v NVRAM-u.

SIP bo zdaj onemogočen pri naslednjem zagonu Big Surja. Če želite, vnesite spodnji ukaz, da odstranite spremenljivko Asr-active-config iz NVRAM.

Vnesite spodnji ukaz, da zapustite ukazno lupino.

V zagonskem upravitelju izberite Mac OS X za zagon Big Sur.


Letak - Skrivanje oznak, ko je prikazano katero koli pojavno okno? - Geografski informacijski sistemi

Constellation je sistem za vizualizacijo rezultatov poizvedb iz pomenskega omrežja naravnega jezika MindNet. Constellation je namenjen ustvarjalcem in uporabnikom MindNeta, da izboljšajo svoje algoritme s preverjanjem verodostojnosti, namesto da bi razumeli strukturo jezika. Oddelek 5.1 vsebuje popolno razlago izbrane naloge.

Oblikovali smo algoritem postavitve grafa za posebne namene, ki poleg osnovne povezave vozlišč in robov izkorišča strukturo višje ravni. Naša prostorska postavitev daje prednost ustvarjanju semantičnega prostora za kodiranje verodostojnosti namesto tradicionalnih meritev risanja grafov, kot je zmanjšanje križanja robov, kot je opisano v poglavju 5.2.

Oddelek 5.3 obravnava našo uporabo več zaznavnih kanalov za zmanjšanje vizualnega vpliva prečkanja robov in za poudarjanje poudarjenih ozvezdij vozlišč in robov. Poglavje 5.4 opisuje naše pristope k navigaciji in interakciji, vključno z novimi pladenj za pite interakcijska tehnika, ki uporablja drsno miško za izbiro primerkov kategorije ozvezdja. Izvajanje obravnavamo v oddelku 5.4, poglavje pa se zaključi z razpravo o rezultatih in izidih projekta v razdelku 5.6.

Eksplicitni cilj projekta Constellation je bil pomagati ciljni skupini ljudi, da učinkoviteje opravi določeno nalogo, v nasprotju s tem, da bi našli skupino ljudi s problemom, ki bi se dobro ujemal s posebno vnaprej določeno vizualizacijsko rešitvijo. Glede na časovno omejitev naše uporabniške skupnosti, ki je bila na začetku in sredi procesa precej na voljo, smo sledili uporabniškemu oblikovalskemu pristopu. Opravili smo več predhodnih razgovorov za določitev glavnih ciljev oblikovanja in pridobili podrobne povratne informacije, ki so vodile razvoj več prototipov papirja in programske opreme. Vključitev naših ciljnih uporabnikov je padla proti koncu procesa oblikovanja, ko je bila njihova pozornost preusmerjena v novo fazo njihovega projekta. Ta situacija je pri oblikovanju, osredotočenem na uporabnika, razmeroma pogosta, zato smo se zanašali na informacije, pridobljene iz prejšnjih interakcij. Naša ciljna skupnost uporabnikov je bila izredno majhna: nekaj računalniških jezikoslovcev, ki delajo na sistemu MindNet v skupini za obdelavo naravnega jezika pri Microsoftovih raziskavah.

MindNet je sistem, ki oblikuje veliko pomensko omrežje z razčlenjevanjem besedila strojno berljivih slovarjev in enciklopedij [DVR93, RDV98]. Njegove možne aplikacije vključujejo preverjanje slovnice, sisteme pomoči inteligentnih agentov, strojno prevajanje in razumno sklepanje.

Postopek razčlenjevanja MindNet spremeni vstopni stavek slovarja ali enciklopedije v majhno graf definicije približno enega ducata vozlišč. Vozlišča predstavljajo besedni čuti: beseda v naravnem jeziku ima lahko več pomenov, odvisno od konteksta, na primer "bank" kot "finančna institucija" ali "stran reke". MindNet razlikuje med temi besednimi čuti z dodajanjem številske pripone in jih obravnava kot ločena vozlišča. Slika 5.1 prikazuje razčlenjeni graf definicij za enega od pomenov besede KANGAROO. Izvirni stavek v angleščini je:

Slika 5.1: Graf razčlenjene definicije iz MindNet. Razčlenjeni graf definicij za KANGAROO100 je mešanica verjetnih prilog, kot je KANGAROO je MARSUPIAL in napake, kot je na primer napačna vezanost AVSTRALIJE na latinsko ime vrste namesto na besedno zvezo SODELALNI OTOKI.

Dva definicijska grafa, ki si delita vozlišče, je mogoče združiti v večji graf, ki ga je mogoče še povečati z vključitvijo drugih grafov opredelitve s skupnimi vozlišči. Postopek poenotenja končno povzroči ogromno pomensko omrežje, ki lahko vsebuje milijone vozlišč.

Tako ciljni uporabniki kot avtor sta se strinjala, da je primarni cilj raziskovalni sistem, ki bi bil aktivno uporaben pri vsakodnevnih raziskavah. Možni cilj predstavitve je bil manj pomemben.

Čeprav je MindNet po standardih področja NLP izjemno uspešen, je znano, da je nepopoln. Semantično omrežje je samodejno zgrajeno, vendar je povratna zanka del njihovega tekočega raziskovalnega programa: odgovore, ki jih vrne MindNet, ročno preverijo jezikoslovci, ki ugotovijo, ali so verjetni. Težave se po možnosti odpravijo z izboljšanjem algoritmov, uporabljenih za ustvarjanje MindNet, in omrežje se regenerira.

Ko smo v prvih intervjujih prvič slišali za nalogo preverjanja verodostojnosti, smo mislili, da bi si raziskovalci želeli ogledati globalni pregled celotnega omrežja, in predvidevali, da se bodo lotili nekaterih velikih algoritmov nabora podatkov. Vendar so nadaljnje razprave kmalu pokazale, da obsežen globalni pregled ni bil tisto, kar so raziskovalci potrebovali. Razumeli so že glavne značilnosti globalnega nabora podatkov, ki je zelo povezan: ena beseda se lahko poveže z večino drugih besed v omrežju po treh ali štirih skokih in z vsemi v petih. Semantična omrežja, ki jih ustvari MindNet, so dovolj velika in medsebojno povezana, da se njihovim razvijalcem zdi nepraktično preučevati njihovo globalno strukturo za namene preverjanja verodostojnosti.

Namesto tega se za iskanje majhnega pododseka omrežja zanašajo na poizvedbeni mehanizem in vsak od teh posnetkov se preveri glede morebitnih težav. Uporabnik jezikoslovca poda poizvedbo, sestavljeno iz dveh besed in števila poti vrniti. MindNet izračuna najboljše poti med besedami, kot je prikazano na sliki 5.2. Sistem vrne zahtevano število poti v skladu z izračunanimi verodostojnost, ki je izpeljana z uporabo (med drugimi dejavniki) uteži robov v enotni mreži grafov opredelitve. Vsako pot spremljajo prve besede vsakega definicijskega grafa, uporabljenega pri izračunu. Te besede so črno prikazane na desni strani slike 5.2. Jezikoslovec bi ročno preveril rezultate, da bi ugotovil, kako dobro se izračunana verodostojnost ujema z intuicijo človeka: na primer, da so vse visoko uvrščene poti verjetne in da so vse verjetne poti visoko uvrščene. Ponovno smo preverili, ali so besede ustavitve, ki bi lahko onesnažile nabor podatkov: se pravi besede, kot so SHE, IT ali THE, ki so v angleščini tako pogoste, da so običajno izključene iz izračunov.

Slika 5.2: Prej obstoječi besedilni pogled v MindNetu. Rezultate poizvedbe, ki jih je MindNet vrnil na vprašanje o desetih najboljših poteh med KANGAROO in TAIL. Na levi strani so obarvane besede na sami poti, na desni v črni barvi pa prve besede v vsakem od grafov definicije, uporabljenih pri izračunu. Prva pot je samo en skok, saj je TAIL101 prisoten v definiciji KANGAROO100. Ta beseda je označena s črno, ker je uporabnik kliknil nanjo in sprožil pojavno okno, ki prikazuje podatke na sliki 5.1. Presoja verodostojnosti v tem vmesniku zahteva veliko listanja med okni. Druga pot uporablja definicije za KANGAROO100 in TASMANIAN_DEVIL100 (prikazano na sliki 5.10 na strani), ki vsebujeta besedo MARSUPIAL100. Peta pot je primer tiste, ki je za izračun zahtevala veliko število grafov opredelitve.

En sam pomen besede se lahko pojavi na več mestih v rezultatu poizvedbe: na primer, KANGAROO103 je vključen v dve različni poti in je prikazan kot listna beseda znotraj definicije WALLABY100, pojavlja pa se tudi kot naslovna beseda z lastnim grafom opredelitve. Te skupne besede so razlog, zakaj je težko razumeti, kako so poti medsebojno povezane in z grafi definicij, ki so bili uporabljeni za njihovo ustvarjanje.

Prej obstoječi programski vmesnik MindNet za poizvedbo o poti, prikazano na sliki 5.2, je zagotavljal besedilni pogled na poti in glavne besede grafov definicij, uporabljenih pri izračunu. Raziskovalni jezikoslovci bi lahko kliknili katero koli od teh ključnih besed, da bi odprli ločeno pojavno okno, da bi videli graf definicij, kot je prikazano na sliki 5.1. Ta pristop je problematičen, ker je bilo težko razumeti več razmerij: odnos med eno in drugo potjo, med potjo in njenimi sestavnimi opredelitvami ter med definicijami različnih poti. Ker je na primer vsaka pot navedena ločeno, je edini način, da povemo, da imata dve poti skupne podpoti, prebrati posamezne besede in jih kognitivno primerjati. Da bi presodili, ali je pot verjetna, so morali uporabniki klikniti več definicij, da prikažejo okna posameznih definicij, nato pa ročno prelistati med mnogimi okni. Nastala kognitivna obremenitev je bila izjemno velika, saj je naloga vključevala primerjavo trenutno prikazanih predmetov s prej videnimi predmeti, kar je veliko težje kot primerjava drug ob drugem.

Razvijalci MindNet so izrazili željo, da bi videli integriran pogled na rezultate poizvedb, kjer so bile poti prikazane v kontekstu vseh besed grafa definicije, uporabljenih pri izračunu poti. Sistem Constellation je bil zasnovan kot posebno orodje za odpravljanje napak algoritmov. Čeprav vhodni nabor podatkov sestoji iz razmerij med angleškimi besedami, Constellation ni namenjen osvetlitvi strukture angleškega jezika kot takega, saj se jezikoslovci tega dobro spoznajo. Nekatere druge značilnosti, ki smo jih odkrili v naših predhodnih intervjujih, so bile vodilo za naš postopek iterativnega oblikovanja:

    Naročilo: Vrnjene poti imajo izrecno razvrstitev po pomembnosti, njihovo verodostojnost. Ker so grafi definicij povezani s potmi, jih je mogoče tudi uvrstiti. Še več, po prvi ali dveh visoko uvrščenih poteh običajno pride do velikega padca uteži poti. Dolge poti so pogosto, vendar ne vedno, nizko uvrščene.

Rezultate poizvedb, vrnjene iz MindNeta, je mogoče razlagati kot en sam srednje velik usmerjen graf, ki sega od nekaj sto do nekaj tisoč vozlišč. Ustvarili smo algoritem prostorske postavitve, ki vizualno kodira značilnosti, specifične za domeno, v nasprotju z običajnim pristopom uporabe prostorskega položaja za zmanjšanje lažnih prilog. Naš novi algoritem postavitve uporablja ukrivljeno mrežo kot hrbtenico za postavitev poti in besedam na poti pritrdi grafe definicij. Naša končna postavitev je bila posledica več ponovitev prototipov delovne programske opreme, saj smo skušali uravnotežiti cilj vizualnega sporočanja največje pomenske vsebine s ciljem zagotavljanja razumne gostote informacij.

Slika 5.3: Tradicionalne postavitve se izogibajo križanj, da preprečijo napačne priloge. Levo: Prečkanja roba vozlišča vodijo v dvoumnost, kjer ni jasno, ali je A povezan s C in B le na poti ali sta A in B povezana tako kot sta B in C. Prav: Križanja robov ustvarjajo vizualno izrazite "X" artefakte, ki gledalca pritegnejo pozornost s pomembnih vidikov strukture grafa.

V večini tradicionalnih sistemov za risanje grafov prostorski položaj nosi večino zaznavnega bremena, interakcija pa se uporablja zgolj za osnovno navigacijo. Obstaja več standardnih omejitev za prostorsko pozicioniranje, vključno z izogibanjem prečkanju, minimiziranjem ovinkov in zmanjšanjem dolžine robov. Različni razredi načinov postavitve so le redko optimizirani za vse tri: na primer postavitve, usmerjene v silo, se osredotočajo na zmanjšanje dolžine robov in se izognejo prehodu. V Constellationu imamo nov pristop k problemu prečkanja robov. Mnoge tradicionalne metode morajo zmanjšati prečkanje robov kot eno glavnih omejitev prostorskega pozicioniranja, da se izognejo vizualnemu vtisu prilog, ki ne odražajo prave strukture nabora podatkov. Slika 5.3 prikazuje dve zaznavni težavi, ki ju povzroča lažna pritrjenost s križanci: dvoumnost, ko lahko povezave preidejo pod vozlišča, in moteči vizualni artefakti na križiščih robov, ki odvračajo pozornost gledalca od pomembne strukture grafa.

Ključni vpogled iz literature za vizualizacijo informacij pa je, da je prostorski položaj najmočnejši zaznavni kanal. Namesto da "zapravljamo" moč prostorskega položaja s preprosto izogibanjem lažnim pritrditvam, uporabljamo položaj za vizualno kodiranje atributa verjetnosti, značilnega za domeno, kot je prikazano na sliki 5.4. Naš algoritem postavitve po meri uporablja odločitve o postavitvi vozlišč na visoki ravni struktur poti in definicijskih grafov. Čeprav sta poti in grafi definicij podmnožica globalnega pomenskega omrežja, imajo pri analizi vedenja programa MindNet zelo različne vloge. Tako smo želeli, da se v naši vizualizaciji zlahka razlikujejo.

Slika 5.4: Gradient verjetnosti kodira atribut, specifičen za domeno. Ker je prostorski položaj najmočnejši zaznavni kanal, ga uporabljamo za sporočanje informacij o domeni, namesto da bi ta kanal namenili izogibanju težavam lažnih pritrditev zaradi prečkanja robov. Vodoravna lega grafa definicij je vezana na izračunano verjetnost MindNeta, polja na verjetni levi strani pa so narisana večja od tistih na neverjetni desnici. Izogibamo se lažnim prilogam s selektivnim označevanjem, kot je prikazano na sliki 5.5.

Slika 5.5: Izbirni poudarek preprečuje zaznavanje lažnih navezanosti. Levo: Naš algoritem postavitve povzroči prečkanje robov na dolge razdalje, ki povezujejo vse primerke besede v skupni rabi. Prav: Izbirni poudarek z interakcijo in dodatnimi zaznavnimi kanali se izogne zaznavanje lažnih prilog.

Naš algoritem ima za posledico številne križanja robov na dolge razdalje med vsemi primerki besede v skupni rabi. Izogibamo se lažnim navezovanjem z uporabo več drugih zaznavnih kanalov skupaj za ustvarjanje dinamično spremenljivih vizualnih plasti ospredja in ozadja. Uporabnik lahko interaktivno raziskuje označene podskupine (ozvezdja) grafa, pri tem pa ohranja kontekst celotnega nabora podatkov. Slika 5.5 prikazuje, da se lahko izognemo zaznavanje lažnih navezanosti s kombinacijo interakcije in dodatnih zaznavnih kanalov, namesto da bi se zanašali na prostorski položaj, da bi nosili celotno zaznavno breme.

Graf smo se odločili postaviti v 2D prostor namesto v 3D prostor iz dveh glavnih razlogov: relativno skromna velikost grafa (pod pet tisoč vozlišč) in izjemno močna odvisnost naloge od branja nalepk.

Naš algoritem postavitve grafov je odvisen od domenskih elementov poti in grafov opredelitve. Poti, ki jih vrne MindNet, uporablja naš algoritem postavitve za ustvarjanje ogrodja okostja, okoli katerega so vstavljeni grafi definicij.

Slika 5.6: Poti v mrežah. (a) Osnovna mreža ima tok verjetnosti od leve proti desni med potmi in navpični tok znotraj vsake poti. (b) Združevanje elementov v skupni rabi vodi do lažne priloge med D in povezavo B-E. (c) Ukrivljena mreža rešuje problem kolinearnosti. (d) Ukrivljena mreža vključuje tudi več končnih točk.

Parametri široke postavitve temeljijo na dveh zaporedjih, ki jih neposredno vrne MindNet: vodoravni tok izhaja iz verjetnosti, ki ureja med potmi, navpični tok pa temelji na notranjem vrstnem redu besed znotraj poti, z virom na vrhu in umivalnikom na dnu. Slika 5.6 (a) prikazuje pravokotno mrežo s tem vrstnim redom z uporabo enostavnega vzorčnega nabora podatkov. Število segmentov mreže vodoravno je preprosto število poti. Število navpičnih segmentov je število skokov N najdaljše poti v naboru podatkov: N = 4 na sliki. Poti z manj kot N vozlišči bodo imele nekaj praznih notranjih navpičnih segmentov, vendar so izvorna in ponorna vozlišča vedno postavljena na prvem in zadnjem mestu.

Vendar ta postavitev nariše isto vozlišče na več mestih, kar skriva pomembne informacije o povezljivosti. Slika 5.6 (b) prikazuje isto mrežo, potem ko imamo konsolidirana skupna vozlišča. Če geslo pojavi na več kot eni poti, narisan je le v pasu najbolj verjetne poti.

Težava pri tej postavitvi je, da je črta med E in B kolinearna s črto med D in B, tako da je težko reči, ali je E povezan z D ali B. Te lažne priloge so neizogibne, če so vozlišča postavljena na pravokotne mreže in povezane s členi, narisanimi kot ravne črte. Rešitev je, da narišemo povezave kot ukrivljene črte ali vozlišča postavimo vzdolž krivulj namesto vzdolž ravnih črt. Slednji pristop smo izbrali iz dveh razlogov preprostosti zaznavanja in računalniške učinkovitosti. Ljudje lahko lažje zaznajo povezavo med dvema elementoma, ki sta povezani z ravno črto, kot dve stvari, povezani s krivuljo, v skladu z načelom dobrega nadaljevanja Gestalt. Tudi risanje ukrivljenih črt je v računalniškem smislu veliko dražje od risanja ravnih črt, saj morajo grafične knjižnice narisati eno samo ukrivljeno črto kot kosno-linearni približek z uporabo številnih kratkih ravnih segmentov. Risanje linij se v našem sistemu dogaja veliko pogosteje kot postavitev. Slika 5.6 (c) prikazuje, da ukrivljena mreža odpravlja problem kolinearnosti.

Najpomembnejša pot bo še vedno navpična, visoko uvrščene poti pa bodo le rahlo ukrivljene. Najmanj pomembne poti so tako najbolj popačene kot najdaljše. Za to izbiro obstajajo tako zaznavni kot praktični razlogi. Najkrajša in ravna pot se bo zdelo glede na njeno veliko težo po geštaltskem načelu bližine najbolj zaznavno pomembno. Praktično imajo manj verjetne poti pogosto več hmelja kot visoko uvrščene, zato je lahko koristno, da jih postavite na večjo razdaljo.

Predhodno prikazan primer nabora podatkov je preprostejši od dejanskega rezultata poizvedbe, ki ima več virov in ponorov. (Spomnite se, da čeprav ima predložena poizvedba eno izvorno besedo in eno ciljno besedo, imajo rezultati poizvedbe besedo občutki kot končne točke.) Na sliki 5.6 (d) je prikazan primer, ko ima končna pot drugačen vir kot drugi, ki ga zlahka sprejme krivuljasta mreža.

Slika 5.7: Slabi pristopi. (a) Srednja pot je v diagonalni postavitvi najkrajša. (b) Pri postavitvi od zgoraj na vrhu ima območje zaslona nasprotno razmerje stranic kot pri standardnem monitorju.

Slika 5.8: Ukrivljena mreža. Parabole in krogi se uporabljajo za ustvarjanje ukrivljene mreže, ki je osnova našega algoritma postavitve. Tukaj razmerje stranic zaslona podaljša kroge, da jim daje videz elipse. Razdalja med polmeri kroga se na neverjetni desni zmanjša. Odsek mreže, uporabljen na tipični sliki, je označen z modro škatlo, z zelenimi pikami, ki označujejo prvi uporabljeni pas celic. Razlika v ukrivljenosti med mrežo, prikazano tukaj, in rešetkami, ki so vidne na sliki 5.13 (stran), je posledica prilagajanja modrega polja okvirju zaslona.

Obstaja veliko možnih načinov za izdelavo mreže pasov in segmentov. Upoštevali smo druge možne izbire za lokacije končnih točk poti, vendar smo jih izključili zaradi nezaželenih zaznavnih ali praktičnih premislekov. Diagonalna postavitev v 5.7 (a) mora imeti srednjo pot kot najkrajšo ali uvesti nekaj neopaznega urejanja poti. Pristop od zgoraj navzgor po 5.7 (b) vodi do območja prikaza, ki je višje, kot je široko, če je veliko poti, kar je nasprotje standardnega razmerja stranic računalniškega monitorja.

Na sliki 5.8 je prikazan poseben ukrivljen koordinatni sistem, ki smo ga izbrali, ustvarjen s presečanjem družine parabolov z družino krogov. Želeli smo, da so pasovi na neverjetni desnici tanjši od tistih na verjetni levi, tako da se polmeri kroga logaritmično zmanjšajo glede na vodoravni gradient verjetnosti.

Za vrstico parametriramo parabolo jaz kot

Po eksperimentiranju smo empirično nastavili višinski odmik parabole preprosto na jaz, in "ukrivljenost" do. Reševanje za x nam daje

Krogi za stolpec j so parametrizirane z

Več eksperimentov je privedlo do nastavitev polmera. Nadomestitev vrednosti v enačbo parabole od zgoraj vodi do

Z Mathematico [Wol91] smo našli preprosto analitično rešitev:

Poti so hrbtenica našega algoritma postavitve: vsaka edinstvena geslo za pot je postavljeno v svojo ukrivljeno mrežo celic. Grafe definicij izpolnimo tako, da vsakega od njih pritrdimo na eno od ključnih besed. MindNet v svojem vrnjenem rezultatu poizvedbe zagotavlja izrecno povezavo med dano potjo in vsemi grafi definicij, uporabljenimi pri njenem izračunu. Na primer, peta pot na sliki 5.2 (stran) je izrecno povezana s 23 definicijskimi grafi. Definicijskim grafom, ki se pojavijo na več poteh, dodelimo najbolj verjetnega: na primer KANGAROO100 se pojavi na poteh 1, 2, 4 in 5, vendar je dodeljen poti 1.

V našem algoritmu postavitve vsak graf definicije dodatno dodelimo posamezni besedi na tej poti. Kadar je glavna beseda za definicijski graf enaka besedni poti, je dodelitev očitna. Pogostejši primer je, da se na poti pojavi nekaj listine v grafu definicij. Opredelitev TAPIR na primer vsebuje besedo SHORT, ki je beseda poti na peti poti.

Besedne besede, ki se pojavijo na več kot eni poti, imajo lahko z njimi povezane grafe definicij. Kombinacijo ključne besede in vseh z njo povezanih definicijskih grafov imenujemo a segment poti.

Slika 5.9: Dodajanje definicij segmentom poti. Vsak definicijski graf je narisan, priložen ključni besedi. Levo: Ko je ključni besedi dodeljen lasten graf definicije, je narisana na vrhu polja s segmentom poti proti porjavelosti ozadja, namesto da bi bila ugnezdena v običajno zeleno polje. Prav: Some words appear on a path because they appear as a leafword in a definition graph, and are not themselves defined. In this case only the pathword is drawn against the tan background, and each attached definition graph is drawn in its green box.

Although the placement grid is curvilinear, our drawing algorithms uses rectilinear boxes anchored at the upper left corner of the grid cell. The box allocated to each path segment is drawn in tan, as shown in Figure 5.9. The pathword itself is drawn at the top of the tan box. If a pathword has been assigned its own definition graph, as in the left side of the figure, that is also drawn in the tan section of the box. If there are other definition graphs assigned to that path segment, each of them is enclosed in a green box nested within the tan pathword box. The right of Figure 5.9 shows a path segment where the pathword is not itself defined, but has two green-boxed definition graphs associated with it. Some path computations involve the pooled influence of many definition graphs for a single pathword, so there may be many green boxes vertically stacked inside a single tan pathword box, as in the top left of Figure 5.14 on page . Path 7 of the KANGAROO-TAIL ten-path dataset is an extreme example in the bottom right of that figure, and is also visible as text in Figure 5.2 (page ).

Figure 5.10: Definition graph layout. Left: In the base layout, words are connected by rectilinear links. The headword is drawn at the top left and leaf words are enclosed in blue boxes. All vertical lines are white, and the horizontal lines are colored according to relation type. Middle: We draw long-distance links between the master version of a word and all its duplicated proxies. Right: The unhighlighted state is the default when a definition graph is not the focus of the user's attention.

Definition graphs are drawn with a ladder-like rectilinear structure, showcased in Figure 5.10, that is deliberately similar to the layout familiar to the linguists (shown in Figure 5.1 on page ). Each leafword is enclosed in its own blue label box. Vertical edges show the hierarchical microstructure inside the definition graph, and horizontal edges are color coded to show the relation type. (The full list of colors is given in Table 5.1 on page .) The left and middle of Figure 5.10 show the highlighted state, and the right the unemphasized state.

Pathwords that are shared among many paths are combined to create a semantically meaningful global structure encoding computed plausibility. Although pathwords and thus entire definition graphs are drawn only once, a word that appears in more than one definition graph will be drawn multiple times. We designate the mojster version of a definition graph leafword to be the one attached to the most plausible path, and draw it in black. All subsequent instances of the word are proxy versions, which are drawn in grey and visually connected to the master word by a long slanted line. These lines are visible in the middle and right sides of Figure 5.10, and in all other Constellation screen shots. The left side of Figure 5.10 is the only figure that does not show the long-distance proxy links, so as to showcase the base rectilinear definition graph layout.

Figure 5.11: Very early layout with empty proxy slots. In this very early layout attempt only master versions of words were drawn, so it was hard to read any single definition graph when zoomed in. Here the definition graph constellation for KANGAROO is highlighted.

An earlier iteration of our layout drew only the master word, leaving the proxy slots empty, as in Figure 5.11. Our intent was to ensure that the users were aware that proxy words appeared in multiple places in the input data. However, we observed that the linguists spend a significant amount of time reading individual definition graphs, and were disoriented when forced to navigate back along the proxy links during closeup reading. In the final version we instead optimized the spatial layout to support this reading task. In Section 5.3 we discuss the interaction paradigm that we designed to ensure that the connections between multiple instances of a shared leafword were always visually salient.

Figure 5.12: Early sparse layout. An earlier version of the software used only the base layout algorithm described in the previous sections, which is successful at encoding the plausibility spatially but results in a somewhat sparse layout with only about 20 legible words.

We need to balance the two competing needs of creating a spatial arrangement that faithfully reflects the structure of the dataset, and filling space to achieve a uniform information density. Figure 5.12 shows a layout from one of the earlier software prototypes, with a grid constructed according to the base algorithm described in section 5.2.2. The layout exactly represents the desired domain specific information, but is quite sparse. Although the empty space does have meaning, we can achieve much greater information density. Figure 5.13 shows a progression towards a more dense layout that retains almost all the informative semantics of the base algorithm shown in Figure 5.12.

The first optimization involves avoiding unnecessary path segments. Some path segments have no associated definition graphs at all, containing only a single pathword. That word is guaranteed to occur in one of the definition graphs in either the previous or the next path segment. In this case we elide the singleton path segment, so that the grid cell can be used more productively. The drawn links between the words in the path will still visually indicate a path, which is more comprehensible without the extra visual step of following links to the singleton pathword. Comparing the top left of Figure 5.13 to Figure 5.12 shows the information density improvement of 40 words due to this optimization.

Figure 5.13: Adjusting grid for maximum information density. Top Left: This view is already an improvement over the very sparse layout in Figure 5.12, because the singleton path segments have been elided. In the fullscreen view, over 60 words are legible. However, further improvements are still possible. The cyan circle shows a horizontal gap between the 7th and 10th band. Top Right: Removing the horizontal gap results in a more compact grid. Here we maintain the identical window borders in all three screen shots to facilitate size comparisons, but the cyan outline shows the borders that would normally be used. 80 words are now visible in the fullscreen view. Bottom: All cells have been vertically expanded that contained words of less than maximum size and were also bounded above and below by unoccupied neighboring cells. The vertical yellow lines in this and the previous shot mark a cell that has grown much taller, allowing the words to be drawn more legibly. This fullscreen view contains over 170 legible words.

An empty horizontal band is a visual indication that every pathword in that path is shared with previous paths. The resulting gaps are not critical for the plausibility-checking task, and removing these horizontal gaps is a straightforward algorithmic improvement. The top right of Figure 5.13 shows the 20-word improvement obtained from removing the gap between bands 7 and 10. The new outermost band is 8, which has more horizontal room to draw words than the former outermost band 10 did. Moreover, the grid is more compact so the global overview viewpoint can be zoomed in slightly more, up to the cyan frame.

The algorithm for using vertical space more effectively is somewhat more complicated. Some grid boxes are totally empty, whereas others are devoted to path segments packed with so many associated words that they have to be drawn in a very small font. The second pass of our layout algorithm allocates spare vertical space to overfull boxes so that they can expand. A box is a candidate for expansion if any word in it is drawn at less than the maximum font size. Boxes can only expand into empty grid cells directly above or below their horizontal extent. Because the grid is curvilinear, this is not as simple as checking in the band of the candidate box: non-empty boxes from other bands might also impede its growth. The expansion check is carried out band by band, starting with the most plausible one, so that more plausible boxes have priority. If two boxes from the same band could both potentially expand into an empty grid cell, the space is split between them. The bottom of Figure 5.13 shows the resulting grid of boxes after the vertical expansion pass. Over 90 more words are now readable, yet the semantically important path bands are preserved. The total information density difference between the base and optimized layouts is considerable: from 20 legible words to over 170.

Although the segments no longer necessarily lie on parabolas, we have not observed a problem with false attachments between pathwords. The fact that the layout was originally based on a curvilinear grid is not particularly visible after the expansion phase, nor should it be. Our goal is that the user perceive a structured space that reflects the left-to-right importance gradient and the connectivity between the paths. The curvilinear grid is simply a mechanism for avoiding false attachments within that structured space.

Another information density improvement involves the aspect ratio of the display window. The example curvilinear grid of intersecting parabolas and circles shown in Figure 5.8 is somewhat distorted. Figure 5.13 shows even more distortion, since the horizontal and vertical bounds were set so that the original grid exactly fills the display window. We maintained the same aspect ratio of the pre-compression limits among all three rows of the image for easy comparison. Subsequent figures such as 5.14 (page ) have even greater information density because the vertical and horizontal bounds were set after the compression pass.

We also considered the alternative of a global optimization by dynamically adapting the parameters of the parabola and circle families on a per-query basis. We rejected that choice because it would result in a highly irregular grid, which is not compatible with our goal of a structured space that shows semantic information via the concentric band spacing.

Our description of the layout algorithm has thus far been in terms of the domain-specific structures of paths and definition graphs. We can also describe the problem in more abstract graph-theoretic terms. The query results from MindNet form a directed graph of between a few hundred and a few thousand nodes. The observed edge density has been |E| <= 3|V|. Each path is a linear directed graph: jaz nodes connected by links, where each node has indegree and outdegree 1, except that the source node has no incoming link and the sink node has no outgoing link. Observed values for jaz range between 2 and about 8. The number of paths is explicitly requested by the user, and typical values are 10 and 50. These linear graphs can be combined based on shared nodes, but there is no guarantee that the result will be a single connected component.

The nodes in this combined graph are the path segments, which are drawn as variably-sized tan boxes with the pathword label in the upper left corner. These level 0 nodes can contain two levels of nested subgraphs. The first nesting level has a simple structure: there are j level 1 subnodes, where j varies between 1 and about 20. Each level 1 subnode corresponds to a single definition graph and is drawn as a green box of nonuniform size, with a headword label in the upper left corner. These nodes are all drawn nested within the boundaries of the tan level 0 box. Each of them has indegree 1 and outdegree 0, connected to the level 0 node but not to each other.

Finally, each of these level 1 nodes contains an entire nested subgraph, the definition graph itself, where each of the k level 2 nodes corresponds to a word in the definition. Observed values for k range between 2 and 20. These level 2 nodes are drawn nested inside the green box of their parent level 1 node. The level 2 nodes of a definition graph subgraph are a single connected component, and the node placement within the rectangular allotted space depends on the link structure of that subgraph. At least one level 2 (word) node per level 1 (definition) node is connected to the enclosing level 0 (pathword) node.

The base graph layout algorithm involves only the level 0 path segment nodes and the links between them. The second pass for maximizing information density tries to optimize the size of the level 0 enclosing node based on the size of the combined level 1 and 2 subgraphs.

In the Constellation layout algorithm, we completely ignore the set of links between a level 2 word node and all other nodes that have the same label. However, these links are always drawn. This approach is similar to the H3 layout algorithm, where the set of links that do not appear in the computed spanning tree does not affect the node layout decision. The difference lies in the drawing: in H3, these links are drawn only on demand, and usually only a subset of them are drawn at once.

The boxes allocated for words determine the font size that can be used to draw their labels. We always use a canonical stand-in word for the font size computation instead of the actual character string. (We discuss this design choice in detail in Section 6.1.1 on page .) Our stand-in word ``Etaoinshrd100'' is made from the first ten most commonly occurring characters in the English language combined with a word sense number. The correct distribution is important since we use a variable width font. The length of the stand-in was chosen empirically.

When the real label requires more horizontal room than is available in the box, we elide it to fit. For instance, the top left of Figure 5.14 shows an entire dataset at the global overview level, and the label ``Old_English_Sheepdog100'' in the lower left path segment is drawn as ``Old_English_sh.100''. The traditional three dots used to signal ellipsis takes more horizontal space than most single characters, so we instead use a single dot.

Constellation is optimized for three viewing levels: a global view for inter-path relationships, a local view for reading individual definition graphs, and an intermediate view for associations within path segments. These differing emphases are all accomplished by making the amount of vertical space devoted to classes of words depend on the current zoom level. This adaptive word layout is a form of continuous multiscale navigation, albeit a less drastic one than the extreme approach taken in the Pad++ system [BH94].

Figure 5.14: Viewing levels. Top Left: The overview level is optimized for showing global path structure, and the inset shows that in this case leafword text may be omitted completely. In this 10-path KANGAROO TAIL dataset all instances of TAIL101 are marked by the hovering cursor. The highlighted path 5 constellation shows that many green definition graph boxes are associated with the pathword ANIMAL109. Top Right: We avoid sudden jumps in visual salience with a greeking step between the complete omission of leafword text and the smallest size text font. In this 10-path ASPIRIN and HEADACHE dataset, the first path constellation is highlighted, and all instances of the word FEVER108 are marked by the hovering cursor. Bottom left: The definition graph reading level is shown for the same area as the inset above, and the different aspect ratio allows every word in the tan boxes to be easily readable. Bottom right: The intermediate path segment viewing level is shown with path 7 highlighted, emphasizing the legibility of the definition graph headwords at the top of each green box.

The overview level is optimized for showing global path structure, so that pathwords and headwords are emphasized at the expense of leafwords. That is, a relatively large part of the available vertical box space is devoted to the pathword, then much of the remaining goes to the headwords, and finally all the leafwords are then fit into a small amount of vertical space. In cases of extreme vertical crowding, leafword boxes are still drawn but the text is omitted completely, as shown in the inset of the top left of Figure 5.14.

An earlier version of the system would suddenly switch from omitting leafwords to drawing them at the smallest font level possible, which resulted in a visually obtrusive jump during zooming because of the sudden appearance of large amounts of dark pixels. The top right of Figure 5.14 shows the intermediate greeking state in the inset that is built into the final version of Constellation, where we draw one-pixel high black lines to visually smooth the transition between total omission and text drawing with the smallest font. We always draw the rectilinear ladder links, since when they are not highlighted they are visually unobtrusive and when they are highlighted they are explicitly intended to stand out.

The local viewing level was optimized for easy reading of definition graphs when zoomed in, and the allocation of vertical space is more equal between headwords and leafwords. The bottom left of Figure 5.14 shows that at high enough zoom levels, enough horizontal room is available to draw the full label for every word. The aspect ratio of the window is accordingly quite different from the equivalent area in the inset above it.

The path segment viewing level is optimized for showing the attachments between definition graphs and pathwords. In this intermediate stage between the global and local view, the size of headwords is close to that of pathwords. The bottom right of Figure 5.14 illustrates that framing an entire path segment with many associated definitions in the window results in much of the green box space being devoted to the definition graph headwords.

The zoom level is taken into account in the layout of words in a path segment. Since the layout inside a path segment changes when the zoom level does, it must be quickly computable to retain the reactive fluidity that is an important component of the visualization system. The mechanism for this proportional allocation of space is to simply put a maximum cap on the font size but allow differential scaling in the horizontal and vertical directions. The visual result is that as the zoom level increases, the proportion of room allocated to the pathwords and headwords decreases while that of the leafwords increases. When the user is looking at a definition close up, every word in the definition graph is large enough to read in almost all cases.

The previous section describes the use of quantitative spatial position to encode plausibility and proximity to encode association. We also allow exploration of the dataset through the selective highlighting of constellations of boxes and edges. We carefully chose perceptual channels so that information is never hidden but highlighted constellations are easily discernible.

There are four constellation types: paths, definition graphs, words, and relation types.

A path constellation highlights every word on a path and the links between them, as in the top left of Figure 5.15. In path constellations, all other versions of a highlighted word have subtle highlighting on their label boxes, but we do not explicitly emphasize the connecting links between master and proxy versions of the word. The relationship between a path and its constituent definition graphs can be quite complex. The top left of Figure 5.14 shows the constellation for the path , which visually reflects that the connection between ANIMAL109 and TAIL101 is due to a derivation by MindNet involving several definition graphs.

Figure 5.15: Constellations. Top Left: Path 37 of the ASPIRIN-HEADACHE 50 path dataset is highlighted. Top Right: The definition graph for ASPIRIN100 is highlighted here. Every long-distance link between a master word in that constellation and all its proxies is also highlighted to underscore the relationship of the shared words. Bottom: The constellation of all words connected to ACCOMPANY109 is highlighted in this partially zoomed-in view.

Figure 5.16: Relation type constellations. Dataset of the first 50 aspirin-headache paths. Top Right: All relations of type part-of are highlighted in green. Top Left: All relations of type transitive object are highlighted in yellow. Bottom: All relations of type modifier are highlighted in cyan.

A definition graph constellation highlights every word in a definition graph, the local axis-aligned links between those words, the long-distance slanted proxy links between every instance of those words, and the enclosing box. The top right of Figure 5.15 shows an example. A word constellation highlights a single word, all words directly connected to it via a relation, and the links in between, as in the bottom of Figure 5.15. If any of the highlighted words in a word or definition graph constellation appears in more than one place, every instance of it is highlighted, as are the links between all versions of that word. The final constellation category, relation type, highlights only the lines representing the relations of a particular category. Figure 5.16 shows several examples. Also, many additional figures throughout this chapter show constellations.

Figures 5.11 and 6.2 (page ) show previous versions of our system that implemented constellation emphasis by simply showing and hiding sets of nodes and edges. The danger of such filtering is that it introduces hidden state: users can easily forget the exact choices they made in the past that affect the current display. They might then reach a conclusion that is unwarranted given the true characteristics of the data, by drawing inferences from a subset rather than all of the data. In the final version of our system, user navigation is the only reason that all the information might not visible at all times. We solved the problem of visual clutter by the careful use of several perceptual channels to distinguish between emphasized and unemphasized information.

Although no other perceptual channel alone is as salient as spatial position, combining several of them has proved to be highly effective at creating visual popout to distinguish a foreground from a background visual layer [Tuf91]. The background layer with its many edge crossings is visible at all times for context, but is unobtrusive since the background boxes and lines have low saturation and their brightness is quite similar to that of the background color. We emphasize the foreground layer by increasing both saturation and brightness. In the case of lines, we also increase the size because hue differences in wide lines are much more discriminable than in the unhighlighted narrow ones.

The colored text background boxes inside the path segment boxes (as in Figure 5.9) use grouping and enclosure to encode the hierarchical relationship between pathwords and definition graphs. These boxes also provide a colored area large enough for effective hue discrimination and maximize the legibility of the black label text. The long slanted lines between master and proxy instances of the same word sense encode association with a connection cue. The orientation of a line is an additional perceptual cue for an additional orthogonal layer, since all local definition links are axis-aligned and only long-distance proxy edges between shared words are slanted.

Finally, we use hue as a nominal variable, to distinguish between the types of enclosure boxes and the types of relation lines. Each of the eight relation types is color coded with with hues 45 degrees apart on the HSB color wheel, whereas the three hues for the enclosure boxes (tan, green, and blue) were empirically chosen to complement them.

Table 5.1: Color scheme used for the visualization, in both HSB and RGB. Each relation type is coded with hues 45 degrees apart on the HSB color wheel, and the hues for word types were empirically chosen to complement them. The highlight colors are obtained by increasing both the saturation and brightness. Hues range from 0 to 360, saturation and brightness range from 0 to 100, and red/green/blue values range from 0 to 255.

    Conspicuity: The luminance contrast between an object and its background is the most important factor in conspicuity, which is further reinforced if the color used for an object is more saturated than its background. The similarity of brightness levels between the background and the unhighlighted information helps attenuate the visual clutter generated by edges. Proxy words are rendered at a lower brightness level than their background labels so that they are inconspicuous from afar.

The two main interaction techniques in Constellation are navigation and interactive visual emphasis through selective highlighting.

The previous section discusses the use of multiple perceptual channels to bring a particular subset of the data to the emphasized foreground visual layer. This interactive visual emphasis is similar in spirit to the dynamic queries of previous information visualization systems such as FilmFinder [AS94].

An early prototype of our system allowed the user to flip through instances of constellation categories by hitting keyboard keys. Our users found that it was difficult to keep track of which key would do what. Guimbretière designed an interface that would allow them to choose between possibilities without the cognitive burden of remembering. Some kind of menu is the obvious solution to this problem.

He chose to use the hardware affordances of the now-common scrolling mouse: a mouse with a small wheel between the main buttons that offers an additional linear control channel independent of the x-y positioning. Our user community is small enough that we can simply assume that they all have such a mouse.

In the current version, the user brings up his new pie flipper interface by holding down the right mouse button, which triggers the translucent radial popup display shown in Figure 5.17.

Figure 5.17: Pie flipper. The inset shows a translucent radial popup display for flipping between the instances of constellations in a category. The FOREMAN101 definition graph constellation is being chosen in the CHAIR-LOVE 10 path dataset.

Holding a mouse button down and dragging the cursor into a slice picks a category type, and then scrolling the wheel (with the button still held down) selects instances in that category. If the user drags the mouse over to a different radial slice, the constellation category changes accordingly. When the user releases the mouse button, the radial display disappears and the flipping operation is terminated, leaving the last-chosen constellation highlighted. The scrollwheel can be used both to quickly spin past many choices and to flip between constellations one by one using the subtle detents on the wheel. Visual feedback is provided by both the selective highlighting visible in the main window through the translucent popup, and auxiliary information in a lower status bar. If the initial mouse click is over a word instead of the background, then the word and definition constellation slices act as toggles for that word instead of flipping through all possibilities.

The pie flipper is similar to a pie menu [CHWS88] in that it has a pie chart layout on a popup menu, but it does not directly trigger an action. Instead, it allows the user to temporarily enter a mode that controls their category choice. Mode errors are minimized because of the sensory feedback of actively holding down the mouse button [SKB92]. Radial pie menus allow faster selection than linear ones [CHWS88], and the translucent popup provides a minimal screenspace footprint. Another reason that he chose to use a popup menu instead of a fixed menu location at the top of the window was so that constellation flipping would be extremely lightweight and not require any distracting mouse motion.

Our extremely lightweight hover mode allows quick visual inspection with no need to navigate. In hover mode, simply moving the mouse over a link marks it visually and shows full details about its origin and destination in an upper status bar. This functionality, shown in Figure 5.18, was added after a direct request from the linguists, who wanted to see offscreen information without needing to navigate there and back when zoomed in to read a definition graph. Hovering over a word will temporarily draw it at maximum size so that it is legible even from the overview position, and visually mark all proxy versions of the word by drawing their label backgrounds as white instead of blue. Again, the linguists requested this functionality to aid reading while avoiding navigation. They wanted to study shared word relationships from the overview position without zooming in to read small words. The large word is drawn to the left of the box so that the large word does not occlude the words directly below the highlighted one, as in Figure 5.14.

Figure 5.18: Hovering. Holding down the shift key enters the lightweight hover mode, where simply moving the mouse both visually marks it in white and yields more information about the object beneath it. Moving the mouse over a link marks it and shows detailed information about its origin and destination in an upper status bar. The mouse is also inside the green definition box for TAPIR, so it is marked by being drawn large on the left. If there were multiple instances of the word, all would be marked, as in Figures 5.14.

Figure 5.19: Zooming. This zoom sequence centered on TAPIR100 shows the adaptive layout in action.

The main navigation method is a mouse click inside any enclosure box, which triggers an animated transition. Such transitions are important for helping the user maintain mental context [RCM93], which is especially important in our system since zooms usually entail nonrigid motion. The horizontal and vertical zoom scales are computed separately, so that the enclosing box is vertically framed within the window and there is enough horizontal space to to draw every character in all the enclosed labels without elision. Thus a simple click in a definition graph box guarantees that every word in an entire definition is easily readable. The differing aspect ratios of equivalent regions of the screen depending on the zoom level is visible by comparing the global view at the top left of Figure 5.14 to the view after an animated transition shown below it.

A click in a path segment box will guarantee that every headword is in the field of view, and in most cases that at least every headword is large enough to read. The bottom right of Figure 5.14 illustrates the resulting view.

Mouse dragging offers the user direct control over panning and zooming. The pan control is a left mouse drag. Zooming is either continuous through a right mouse drag when the control key is held down, or in discrete increments using the mouse scrollwheel detents. Figure 5.19 illustrates the gradual change in relative word sizes during a long zoom sequence.

Constellation is implemented in C++, using OpenGL for drawing. Since MindNet runs only under Microsoft Windows, Constellation was also developed under Windows.

We implemented several optimizations to speed up the interaction. We avoid the slower immediate-mode drawing in favor of a using single cached large display lists whenever possible, for example when the user pans or triggers the transparent popup pie flipper. When user actions change the appearance of the window, for instance through selective highlighting, then we must create a new display list. The most expensive operations are zooming or changing the window size: these operations require recomputing the path segment spatial layout in addition to a redraw. The segment layout recomputation is necessary since the relative allocation of space on the screen inside the boxes depends on the zoom level. However, the curvilinear grid layout and vertical cell expansion happens only once per dataset.

With a sufficiently fast graphics card and PC, the frame rate remains interactive even in the worst case of redraw plus replace, but the optimizations result in smoother interaction in the other cases. We did not spend a great deal of time optimizing the drawing, instead focusing our attention on the iterative design of the rest of the system. This allocation of resources seemed reasonable given that our very small user community of researchers is quite well funded, and graphics card price and performance continue to improve rapidly.

We first cover the design tradeoffs of the project, then present the visual appearance of example datasets. Finally, we discuss the reasons for the project outcome, since Constellation is not in active use by our small target audience of computational linguists.

Our final layout algorithm is the result of many iterations as we explored the tradeoff between legibility and the semantic use of space on a finite resolution display. At the former extreme, we could tile the window with a rectangular grid containing 300 words, but there would be no spatial encoding whatsoever. At the latter extreme, a very strict spatial encoding (as in Figures 5.12 or 5.13) would allow an exact encoding of the desired attributes, but vast amounts of navigation would be required to do much reading because of low information density. Our horizontal plausibility gradient is a middle ground where more important words are allocated more room in the overview position. The transformations from the sparse to the dense grid work well because they preserve the ordinality of the bands and pathwords, which is our main concern for this task.

To compensate for our finite resolution, we offer easy navigation with animated transitions and intelligent zooming, where the relative amount of space devoted to words changes based on the zoom level. Rapid visual emphasis through hovering is useful in situations where navigation would be a cognitive burden.

The layout provides a great deal of structural information about the paths and definitions that were returned by a MindNet query, at the expense of many edge crossings. Our visual layering approach of using many perceptual channels in concert proved to be quite effective at both avoiding false edge attachments and visual emphasis. The psychophysical literature on color coding is extensive [War00, Chapter 4,] [RT96], and we benefited from it by following recommendations of Reynolds [Rey94].

Figure 5.20: Three effective viewing levels. Top: The global overview is effective for inter-path comparison. Middle: The intermediate view shows the definition graphs associated with a path word. Bottom: The closeup view allows the linguists to read an individual definition graph.

Figure 5.21: Dissimilar query words. The query words REGAIN and BANK are dissimilar, so there are few shared words. Three constellations are composed: path 2, a green definition graph for DEPOSIT119 on the far right, and words connected to BANK132 on the far left.

Figure 5.22: BIRD-FEATHER 10 path dataset. The strongly associated words BIRD and FEATHER results in a long characteristic T shape using our layout algorithm.

Figure 5.20 shows that we succeeded in creating a layout that was effective at three different viewing levels that corresponded to the three targeted subtasks: a global overview for inter-path comparison, an intermediate view to inspect the definition graphs associated with a particular pathword, and a closeup view well-suited for reading individual definition graphs. Reading the definition graphs, which correspond to a dictionary entry, is a critical part of the plausibility-checking task.

Our spatial layout provides insight into the similarity between the words of the initial query from the global overview level. Figure 5.22 shows the 10 path BIRD-FEATHER dataset, which has the typical sideways ``T'' shape formed by strongly associated words. The words REGAIN and BANK are quite dissimilar, so there are not many long-distance proxy links in Figure 5.21.

Figure 5.23: Layouts of kangaroo-tail dataset using pre-existing systems. Left: Layout using dot, one of the more flexible and scalable 2D graph layout systems. Right: Layout using our H3 system. Neither layout is effective for a linguist making plausibility judgements about paths or reading individual definition graphs.

The efficacy of the Constellation views is clear when compared to other pre-existing views of the same dataset. We found that relying on generic graph layout techniques to display this complex structure led to inadequate results. Figure 5.23 left shows part of the kangaroo-tail dataset laid out using dot [GKNV93], one of the more flexible and scalable 2D graph drawing systems. Figure 5.23 right shows the same dataset laid out in H3. Both views show an aspect of the graph structure, but neither are suitable for making plausibility judgements about paths by reading individual definition graphs.

Constellation is not in active use by our small target group of linguists, whose project goals shifted during the time that we built the visualization system.

Our target group was quite available during the first phase of the project when I was a summer intern at Microsoft Research in 1998. My coauthor and I were able to obtain more feedback on later prototypes during several visits to MSR over the course of the next year. Unfortunately, by the summer of 1999, the project goals of the linguists had shifted as new aspects of their research came to the fore, and plausibility checking was no longer a major task.

Although Constellation was designed for a small target audience, our design principles are relevant for many information visualization systems. The interactive visual emphasis capability is as fundamental to the dataset exploration as the interactive navigation, and these interactions are as important as the base spatial layout for understanding the full dataset. In this chapter we have presented a very detailed analysis of our design choices by justifying them against the task requirements. We have also documented some of the ways that the current version of the software differs from previous iterations as a result of informal usability observations of the linguists working with the earlier prototypes.


What is the simplest way to hide labels and inputs with javascript?

What is the simplest way of hiding labels and inputs in a way that they ne affect the layout. See image and the code below. The label text3 is hidden and there is no extra gap between text2 in text4. In this implementation I put both in div container and change its .style.display property.

Edit: the figure is excactly what I want but the implementation is not good. In other words, how to rewrite the function (e.g. getting rid of div and using css. ).


6 odgovori 6

The state of the taskbar, whether "Icons only", "Icons when full", or "Icon+label", is internally called the "glom" level, and is dictated by the registry key HKEY_CURRENT_USERSoftwareMicrosoftWindowsCurrentVersionExplorerAdvancedTaskbarGlomLevel where the possible values are 0, 1, and 2 respectively. Unfortunately this is a taskbar-wide setting and there is no finer grain control to do what you want, which would be to make an icon-ified application wider to display title text, or an icon+text taskbar button smaller to hide the title text.

I found a solution! This little application allows lables to be hidden per application ID. I think it is exactly what you and I have been looking for.

Not exactly what you're looking for, but 7stacks from Alastria Software can put shortcuts for several applications in 1 taskbar icon, using "stacks" (à la Mac OS X).

7stacks is an easy to use, free app that lets Windows 7 (and Vista and XP) users have "stacks" of icons in their Taskbar (in 7) or QuickLaunch Toolbar (in Vista and XP). By using stacks, users can reduce icon clutter, and combine a group of related icons into a single icon. For instance, if you use application suites such as Microsoft Office, OpenOffice, or Adobe CS4, you can have all the suite's icons combined into one icon!

I don't have access to my Windows 7 box now but you could try to specify an empty name for a new stack, use a custom icon and pin it to the taskbar.


Poglej si posnetek: AKČNÍ LETÁK - DETAILNĚ - (September 2021).