echart——入门demo

引入echarts文件下载地址 https://download.csdn.net/download/sunshine0508/11171026

<script src="echarts.js" type="text/javascript" ></script>

准备一个dom

<div id="main" style="width:400px;height:400px;"></div>

通过echart.js 初始化一个echarts 的实例，并通过setOption方法生成简单的柱状图

<script>// 基于准备好的dom，初始化echarts图表var myChart = echarts.init(document.getElementById('main'));var option = {tooltip: {show: true},legend: {data:['销量']},xAxis : [{type : 'category',data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]}],yAxis : [{type : 'value'}],series : [{"name":"销量","type":"bar","data":[5, 20, 40, 10, 10, 20]}]};// 为echarts对象加载数据myChart.setOption(option);
</script>

echart——入门demo相关推荐

Dubbo入门Demo
2019独角兽企业重金招聘Python工程师标准>>> 1.Dubbo简单介绍 Dubbo是一个分布式服务框架,致力于提供高性能和透明化的RPC远程服务调用方案,以及SOA服务治理方 ...
rabbitmq 入门demo
rabbitmq 入门demo http://www.cnblogs.com/jimmy-muyuan/p/5428715.html http://www.cnblogs.com/shanyou/p/ ...
dubbo web工程示例_分布式开发-Zooker+dubbo入门-Demo
作者:知了堂-刘阳 1.什么是SOA架构 SOA 是Service-Oriented Architecture的首字母简称,它是一个面向服务的架构模式(俗称:分布式:面服务的分布式) 为什么互联网项目 ...
服务网关Ocelot 入门Demo系列（01-Ocelot极简单Demo及负载均衡的配置）
服务网关Ocelot 入门Demo系列(01-Ocelot极简单Demo及负载均衡的配置) 原文:服务网关Ocelot 入门Demo系列(01-Ocelot极简单Demo及负载均衡的配置) [前言] ...
分布式事务框架lcn入门demo
文章目录简介实现原理入门demo 简介 LCN分布式事务框架其本身并不创建事务,而是基于对本地事务的协调从而达到事务一致性的效果. LCN5.0.2有3种模式,分别是LCN模式,TCC模式,TX ...
java实现高德地图app,Android 高德地图入门demo，最新高德地图实现方法，附源码及apk...
[实例简介] Android 高德地图入门demo,最新高德地图实现方法,附源码及apk [实例截图] [核心代码] GaoDeDemo ├── GaoDeDemo │ ├── app │ │ ...
Qt网络编程-简易版UDP组播通信入门Demo（5）
Qt网络编程-简易版UDP组播通信入门Demo(5)
Qt网络编程-TcpServer入门Demo（2）
Qt网络编程-TcpServer入门Demo(2)
【Echart】echart 入门
echart 入门什么是Echart Echarts支持的图表? echarts和chart对比 echarts的优点: echarts的缺点: chart.js优点: 一. 基本概念二. ech ...

echart——入门demo

echart——入门demo相关推荐

最新文章

热门文章