背景 之前的项目因为要顾及体量问题,选用了highchart,没用上echarts:这次因为是本地部署电子屏幕的展示页,不需要考虑体量大小,直接用上了echarts:用起来觉得非常不错,特别是地图上非常炫酷的飞机飞行动画,吊炸天了.美中不足的地方是x轴上文字展示部分,想加些个性化的icon不支持,柱状图每条柱想用不同的颜色也不支持,那只能让设计师妥协了,呵呵! 一.地图的实现 注意要先引入地图依赖数据china.js或者异步请求china.json文件,其他代码如下: //地图 $(functi…
随着前端技术的飞速发展,大数据时代的来临,我们在开发项目时越来越多的客户会要求我们做一个数据展示的大屏,可以直观的展示用户想要的数据,同时炫酷的界面也会深受客户的喜欢. 大屏展示其实就是一堆的图表能够让人一目了然地看到该系统下的一些基本数据信息的汇总,也会有一些实时数据刷新,信息预警之类的.笔者在之前也做过一些大屏类的数据展示,但是由于都是一些图表类的,觉得没什么可说的,加之数据也都牵扯到公司,所以没有沉淀下来什么. 最近有朋友要做一个大屏,问了自己一个问题,自己也刚好做了一个简单的大屏数据展示…
发布时间:2018-10-31   技术:javascript+html5+canvas   概述 基于echarts的大数据中国地图展示,结合API定制,开发样式,监听鼠标事件,实现带参数路由跳转等自定义事件. 详细 代码下载:http://www.demodashi.com/demo/14294.html 一.概述 实际项目中大概率会遇到很多需要进行数据展示的地方,如折现图,柱状图等,今天给大家介绍一个更加炫酷的中国地图大数据展示,结合echarts免费开源第三方插件,可以实现自己的定制样式…
echarts api文档: http://echarts.baidu.com/echarts2/doc/doc.html echarts demo示例: http://echarts.baidu.com/echarts2/doc/example.html echarts 使用五部曲: 1. 制作一个图表容器 <div id="main" style="height:400px;"></div> 2. 引入echarts.js文件 <s…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link href="https://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"> <link rel="st…
在项目中运用到图形展示数据太常见了,echarts是一款使用率非常高的插件工具,很多大平台都是使用echarts: 一般运用到条形.折线.扇形图,今天说一说在中国地图上展示各地数据: 首先要准备中国地图的JS文件,可以在网盘下载,链接: https://pan.baidu.com/s/1j_edGU2ka9YeHBTErqDWdg 密码: ft9n 也可以在github上克隆下来:https://github.com/Luna829/incubator-echarts/blob/master/m…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Music</title> <script src="https://code.jquery.com/jquery.js"></script> <!-- 引入 Bootstrap --> <lin…
一.导入ECharts文件 二.HTML代码 大小后期自己调 三.后台代码 四.js代码 不要问为什么- -我是扒下来的 可复制代码: //基于准备好的dom,初始化echarts实例 var myData = echarts.init(document.getElementById('data')); //指定图表的配置项和数据 //var data = genData(50); option_data = { title: { text: '同名数量统计', subtext: '纯属虚构',…
一.由于项目需要进行手机看板展示设计及开发展示效果图如下:…
1. 概述 数据服务(https://ds-cn-shanghai.data.aliyun.com)  是DataWorks产品家族的一员,提供了快速将数据表生成API的能力,通过可视化的向导,一分钟“零代码”就可以生成API,让API开发从未有过如此便捷!同时支持自定义API查询SQL功能,对您的个性化复杂查询逻辑支持照样不在话下. DataWorks数据服务提供HTTP API服务,采用Serverless架构,您只需关注API本身的查询逻辑,无需关心运行环境等基础设施,零运维成本. Dat…