HighCharts-动态配置csv格式数据
场景:
开发一个大型热力图。官网示例中只有设置静态csv数据的例子。一直没有找到如何给热力图加载动态数据。
无奈,只好把要加载的数据拼接成csv格式后,供热力图加载。
拼接数据js:(dataArr是从后台获取的数据)
var csv_data = 'xColumn,yColumn,zColumn'+' \n '; // 列名
if(undefined != dataArr && null != dataArr && dataArr.length > 0){
for(var i=0;i<dataArr.length;i++){ // 遍历拼接每行数据
var thisrow = dataArr[i].xValue.toFixed(2) + ',' + // 四舍五入,保留两位小数
dataArr[i].yValue.toFixed(4) + ',' + // 四舍五入,保留四位小数
dataArr[i].zValue.toFixed(4) + ' \n ';
csv_data += thisrow;
}
}
options配置:
var options = {
data: {
csv: csv_data
},
chart: {
// ...
},
// ...
};
生成图谱:
new Highcharts.Chart(options);
HighCharts-动态配置csv格式数据的更多相关文章
- Highcharts使用CSV格式数据绘制图表
Highcharts使用CSV格式数据绘制图表 CSV(Comma-Separated Values,逗号分隔值文本格式)是採用逗号切割的纯文本数据.通常情况下.每一个数据之间使用逗号切割,几个相关数 ...
- Bash中使用MySQL导入导出CSV格式数据[转]
转自: http://codingstandards.iteye.com/blog/604541 MySQL中导出CSV格式数据的SQL语句样本如下: select * from test_inf ...
- R语言笔记001——读取csv格式数据
读取csv格式数据 数据来源是西南财经大学 司亚卿 老师的课程作业 方法一:read.csv()函数 file.choose() read.csv("C:\\Users\\Administr ...
- postgresql数据库配置csv格式的日志输出
postgresql数据库配置csv格风格日志输出 以下介绍postgresql数据库中关于csv格式日志(pg中一种比較具体的日志输出方式)的设置方法. 1.进入$PGDATA文件夹(pg的安装文件 ...
- Mongodb 导出json 和csv 格式数据
导出到json: $ mongoexport.exe -d TestDB -c TestCollection -o ./test.json 导出到csv: If you want to outpu ...
- 使用Elasticsearch的processors来对csv格式数据进行解析
来源数据是一个csv文件,具体内容如下图所示: 导入数据到es中 有两种办法,第一种是在kibana界面直接上传文件导入 第二种方法是使用filebeat读取文件导入 这里采用第二种办法 配置文件名: ...
- mysql导入导出.csv格式数据
window下导入数据: LOAD DATA INFILE "C:\\1.csv" REPLACE INTO TABLE demo CHARACTER SET gb2312 FIE ...
- CSV格式数据如何导入SqlServer?
一.使用微软数据库IDE管理软件:Microsoft SQL Server Management Studio 1.标准的CSV文件格式如下: 2.建数据表 3.在需要导入的数据库右键点击“任务”,选 ...
- CSV格式数据如何导入MySQL?
经常有客户咨询如何将CSV文件导入到MySQL数据库中,特写此文介绍一种方便.快捷的方法. 我们要使用的辅助工具是著名的MySQL管理软件:Navicat for MySQL 1)我准备了一个字符编码 ...
随机推荐
- 15个优秀的开源项目,让你轻松应对Android开发
一.huabanDemo-android 应用material design版的花瓣网App 项目地址 https://github.com/LiCola/huabanDemo 二.创建视差效果引导页 ...
- 使用Date和SimpleDateFormat类表示时间
Date类: 使用 Date 类的默认无参构造方法创建出的对象就代表当前时间,我们可以直接输出 Date 对象显示当前的时间,显示的结果如下: Date d = new Date(); System. ...
- .net core 3.0中可以使用gRPC了
今天发现.net core下有gRPC模板了,这个可是补全了.net core下高性能RPC框架缺失这一大短板了. 使用模板创建了工程后,发现连客户端的示例也创建了. 更加给力的是,IDE是能直接识别 ...
- MDX Step by Step 读书笔记(七) - Performing Aggregation 聚合函数之 Max, Min, Count , DistinctCount 以及其它 TopCount, Generate
MDX 中最大值和最小值 MDX 中最大值和最小值函数的语法和之前看到的 Sum 以及 Aggregate 等聚合函数基本上是一样的: Max( {Set} [, Expression]) Min( ...
- LeetCode 90:Subsets II
Given a collection of integers that might contain duplicates, nums, return all possible subsets. Not ...
- oracle访问不同用户的表不添加用户名前缀
问题的出现,是技术的不断推进.为了更好地实现价值的提升! 01.用视图 create view tab1 select * from B.tab1; //在A用户下执行 02.同义词 gr ...
- Ubuntu菜鸟入门(十八)————解决Ubuntu下Sublime Text 3无法输入中文
一.下载我们需要的文件,打开终端,输入: git clone https://github.com/lyfeyaj/sublime-text-imfix.git 二.将subl移动到/usr/bin/ ...
- ceph rgw multisite基本用法
Realm: Zonegroup: 理解为数据中心,由一个或多个Zone组成,每个Realm有且仅有 一个Master Zonegroup,用于处理系统变更,其他的称为Slave Zonegroup, ...
- Effective Java 第三版——46. 优先考虑流中无副作用的函数
Tips <Effective Java, Third Edition>一书英文版已经出版,这本书的第二版想必很多人都读过,号称Java四大名著之一,不过第二版2009年出版,到现在已经将 ...
- Android解决NDK not configured问题
问题描述: // Error:Execution failed for task ':SoftkeyApp:compileDebugNdk'. // > NDK not configured. ...