Pramana Yuda Sayeti

@yudapramana·3 public vizzes

Visualization Task Test

This visualization presents a document user consent dashboard, displaying participant data across multiple sites and studies. It shows bar, pie, and doughnut charts built with Chart.js, rendering frequencies of quiz completion status and document types. The application loads a mock CSV dataset using D3’s `csv` function, then filters and refreshes charts dynamically based on user selections from dropdown menus. It employs Underscore.js utilities like `_.pluck` for data extraction, with custom color generation and tooltip percentage calculations.

Aug 19, 2020

Loading thumbnail…

Vue Startrt

This example demonstrates Vue.js interactive text binding and event handling. A large "Hello Vue!" message is displayed, a separate span reveals a dynamically bound tooltip with the current date on hover, and a button reverses a message on click. It uses Vue's `v-bind:title` for attribute binding and `v-on:click` for event handling, with the button also logging nested econsent data structures to the console. The code defines three separate Vue instances targeting distinct DOM elements in a single HTML page.

Aug 14, 2020

Loading thumbnail…

Visualitation Task

This visualization presents a dashboard of participant data from a mock clinical trial CSV file, using bar and pie charts to show quiz completion status, document types, participant countries, and study types. It relies on Chart.js to render the charts, with D3.js (`csv`) for data loading, Underscore.js (`_.pluck`) for data extraction, and a custom `convertToArrObj` utility to transform frequency counts into chart-ready objects. The charts sort categorical data by frequency, and pie charts display tooltip percentages.

Aug 9, 2020