1.0.3 • Published 5 years ago

react-echarts-chinamap v1.0.3

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

react-echarts-chinamap

NPM JavaScript Style Guidenpm bundle size

安装

npm install --save react-echarts-chinamap

使用

import React, { Component } from 'react'

import ReactChinaMap from 'react-echarts-chinamap'

class Example extends Component {
  handleOnChange = (data) => {
    console.log(data) // 此时data是用户点击的区域的名称数组
  }
  render () {
    return (
      <ReactChinaMap onChange={this.handleOnChange} />
    )
  }
}

使用截图

1业务界面中初次加载组件(背景色可自己按需求添加)

overview

2点击某省时的界面(这里以点击江苏省为例,组件展示江苏省轮廓,点击市可继续显示被点击的市的轮廓)

step1

组件参数

参数说明类型默认值
onChange点击地图模块时的回调函数function(data:Array)-
extraOption用户自定义的对echarts的配置项Object{}
style自定义的styleObject{}
wrapperClassName自定义的加在组件最外层的样式名称String-
echartsClassName自定义的加载echarts组件上的样式名称String-
showCallbackBtn是否显示返回按钮Booleantrue
showTips是否在点击到最后一次地区时显示提示语Booleantrue
defaultSelectedAreaName默认选中高亮的区域的名称string''
isShowIsland是否显示南海群岛及南海轮廓线Booleantrue

License

MIT © zjz1993