npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@ibiz-template-plugin/data-view

v0.0.6

Published

iBiz 数据大屏,基于iBiz标准门户部件扩展,提供动态数据展示、多样化可视化组件(表格/翻牌器/水位图等)、自定义装饰元素(边框/粒子特效)以及交互式功能(标签墙/按钮系统)的完整大屏解决方案。

Readme

@ibiz-template-plugin/data-view

iBiz数据大屏插件,提供以下核心功能模块:

  • 动态数据表格:支持实时滚动、分页和高亮显示
  • 数字翻牌器:流畅的数字动画效果,支持多种格式展示
  • 数据看板容器:灵活的面板布局系统,支持响应式设计
  • 百分比进度条:指示光标
  • 水位图:3D立体效果
  • 单选列表框:支持滚动选中
  • 装饰元素:
    • 可定制边框样式(多种预设+自定义SVG)
    • 动态装饰器(粒子效果、流光效果)
  • 标签墙:动态词云效果,支持点击交互
  • 自定义按钮系统:多种按钮样式

目录结构

├─ src
│  ├─ carousel-grid                             滚动表格
│  ├─ carousel-list                             滚动表格
│  ├─ custom-border                             自定义边框样式(1-13)
│  ├─ custom-button                             自定义按钮样式(1-6)
│  ├─ custom-decoration                         自定义装饰器样式(1-6,11)
│  ├─ custom-search-box                         搜索框
│  ├─ digital-flop                              数字翻牌器
│  ├─ index.ts
│  ├─ percent-pond                              百分比进度条
│  ├─ screen-dashboard                          大屏数据看板
│  ├─ screen-panel-container                    大屏面板容器
│  ├─ screen-portlet                            大屏门户部件
│  ├─ screen-portlet-real-time                  大屏门户实时时间
│  ├─ screen-radio-list                         大屏单选列表框
│  ├─ screen-real-time                          大屏实时时间
│  ├─ tagged-wall                               标签墙
│  ├─ util                                      工具类 
│  └─ water-level-pond                          水位进度条

开发

  1. 安装依赖

进入@ibiz-template-plugin/data-view工作空间后,执行以下命令安装依赖:

pnpm i
  1. 启动开发环境

进入@ibiz-template-plugin/data-view工作空间后,执行以下命令启动开发环境:

pnpm dev
  1. 将@ibiz-template-plugin/data-view包链接到全局

等待开发环境启动完成后,将@ibiz-template-plugin/data-view包添加pnpm link到全局:

pnpm link --global
  1. 链接依赖项目

在依赖此包的项目工作空间中,安装依赖后执行以下命令link插件包

pnpm link --global "@ibiz-template-plugin/data-view"