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 🙏

© 2024 – Pkg Stats / Ryan Hefner

vis-w

v0.1.0-beta2

Published

``` npm install vis-w ```

Downloads

2

Readme

安装

npm install vis-w

使用

import v from 'vis-w'
import css from 'vis-w/dist/leaflet.css'  //引入leaflet样式

地图

let vMap = new v.Map('map-container');  //map-container为地图容器div的id

properties

legendStyle:图例的样式

vMap.legendStyle = {
    bottom: '60px',
    right: '10px'
};

mapClickListener:地图点击事件

vMap.mapClickListener = (e)=>{
  console.log(e)
}

moveEndListener:地图停止移动事件

vMap.moveEndListener = (e)=>{
  console.log(e)
}

methods

getLeafletMapObject()

返回leaflet的map对象。

getBounds()

获取屏幕可视区域的地图边界。
返回类型:Bounds:{leftTop: [lat, lon], rightBottom: [lat, lon]}

add(layer)

添加图层,layer为图层对象。

removeLayer(layer)

移除图层,layer为图层对象。

hasLayer(layer)

是否存在图层layer。

图层

温度

TemperatureSurface: 地面温度

参数:
startTime: 起报时间, yyyyMMddHHmm
endTime: 预报时间, yyyyMMddHHmm
datasource: 数据源,可选'ecmwf'、'gfs',默认为'ecmwf'

methods:
    setTime(startTime, endTime): 更新起报时间和预报时间
示例:
let temp_surface = new v.TemperatureSurface('202009031200', '202009031200', 'gfs');
temp_surface.addTo(vMap);  //vMap.add(temp_surface);

temp_surface.setTime('202009031200', '202009031800');  //更新时间

TemperatureIsobaric: 高空温度

参数、方法及示例参考TemperatureSurface

*SkinTemperature: 体感温度

参数、方法及示例参考TemperatureSurface,此图层datasource只有'ecmwf'

DewpointTemperatureSurface: 露点温度

参数、方法及示例参考TemperatureSurface

降水

TotalPrecipitation: 总降水

参数、方法及示例参考TemperatureSurface

云量

LowCloud: 低云量

参数、方法及示例参考TemperatureSurface

TotalCloud: 总云量

参数、方法及示例参考TemperatureSurface,此图层datasource只有'ecmwf'

相对湿度

RelativeHumiditySurface: 地面相对湿度

参数、方法及示例参考TemperatureSurface,此图层datasource只有'gfs'

RelativeHumidityIsobaric: 高空相对湿度

参数、方法及示例参考TemperatureSurface,此图层datasource只有'ecmwf'

能见度

VisibilitySurface: 地面能见度,单位:km

参数、方法及示例参考TemperatureSurface

Wind: 风速色斑图层

参数:
startTime: 起报时间, yyyyMMddHHmm
endTime: 预报时间, yyyyMMddHHmm
windLevel: 高度层
    当datasource为'ecmwf'时可选:'10m', '100m', 10, 20, 50, 70, 100, 150, 200, 250, 300, 400, 500, 600, 700, 800, 850, 900, 925, 950, 1000.
    当datasource为'gfs'时可选:'10m'.
    (windLevel为数字时,表示气压,单位为hPa)
datasource: 数据源,可选'ecmwf'、'gfs',默认为'ecmwf'.

methods:
    setTime(startTime, endTime): 更新起报时间和预报时间
示例:
let wind = new v.Wind('202009031200', '202009031200', '10m', 'gfs');
//let wind = new v.Wind('202009031200', '202009031200', 1000, 'ecmwf');
wind.addTo(vMap)

WindVelocity: 风场粒子

参数及示例参考Wind.

methods:
    show(): 显示风场粒子
    hide(): 隐藏风场粒子
    setTime(startTime, endTime): 更新起报时间和预报时间