Code Monkey home page Code Monkey logo

wxchart's Introduction

modify 分支重写img

wxchart

k线图、直方图、曲线图、保持了和echart的类似的参数配置

使用方法

1、引入wxchart
	const wxChart = require('wxChart')
2、实例化初始对象
	consot chart =wxChart.init()
3、通过setOption方法生成图表
	chart.setOption(options)

options 参数配置

	options = {
		grid:{
			show: false, //是否显示直接坐标系网格
			showX: ture, //显示横轴网格线
			showY:true, //显示数轴网格线
			width: 'auto' //?
			height: '110' //组件的高度
			left: 0,
			top: 0,
			right: 0,
			bottom: 0,
			backgroundColor: 'transparent',
			borderColor: '#cccccc',
			showLable: true, //暂时好像没有用可以去掉
			length: 52 //默认数据长度
		},
		dataZoom:[{
			start: 0,
			end: 1
		}],
		xAxis: [
			{
				show: true,
				length: 52
			}
		],
		yAxis: [
			{
				max: '',
				min: '',
				show: true
			}
		],
		series: [
			{
				name: '',
				type: 'bar',
				show: true, //是否显示该图表数据
				data: [],//一维数组数据
				lineStyle: {
					color: '',
					width: 1,
					type: 'solid'
				}
			},
			{
				name: '',
				type: 'line', 
				show: true,
				data: [], //一维数组[]
				lineStyle: {
					color: '',
					width: 1,
					type: 'solid'
				}
			},
			{
                show: true,
                type: 'candlestick',
                name: '',
                data: '', //data 多维数组[[开盘、收盘、最低、最高]]
                itemStyle: {
                    color: '#c23531 ',
                    color0: '#314656 ',
                    borderColor: '#c23531',
                    borderColor0: '#314656',
                    borderWidth: 1,
                    type: 'solid'
                }
            }
		]
	}

效果预览

k线图

wxchart's People

Contributors

leewr avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.