Highcharts 时区问题总结

首先请简单的看一下关于 时区UTC 的定义,我们可以简单的得出以下两个认知:

  1. UTC 是世界标准时间,用于协调各国时间
  2. 中国的时区是 UTC +8,即比标准时区的时间快 8 小时

接着来看问题,很多用户在使用 Highcharts 时,经常会遇到时间显示于预期的不一致,具体表现是:

new Date('2017/01/01').getTime() 获取的时间最终在 Highcharts 中显示的却是 2016-12-31 16:00,也就是时间相差 8 小时。经过上面的科普,你应该很快就知道问题所在,也就是时区惹的祸。

查看更多

分享到评论

Highcharts 6 功能模块详解

Highcharts 6 新增了很多新的图表类型和功能,新的图表类型一般是以模块的形式发布,所以从 Highcharts 6 开始,其模块的数量巨大,为了方便大家使用,在这里做一个详细的说明

查看更多

分享到评论

Highcharts 6 发布啦

经过一年多的开发和测试,我们很高兴的宣布 Highcharts 6 发布啦,一同发布的还有 Highstock 6 及 Highmaps 6。

大量的新的图表类型

Highcharts 6 提供 15 种新的图表类型,包括:桑基图流图旭日图可变宽度的柱形图平行坐标图可变宽度的环形图向量图风羽图贝尔曲线柏拉图词云图简易甘特图子弹图砖块图直方图 等,另外还有其他的图表类型将在接下来的几个月内发布,包括 韦恩图、 Marimekko 图等。

查看更多

分享到评论

Highcharts 轮播(Motion)插件

Highcharts 轮播插件 是用来实现图表数据轮播的插件,先来看几个例子:


查看更多

分享到评论

基于 Highmaps 查找经纬度点所在的区域

基于 Highcharts 的官方教程 我们可以很轻松的通过经纬度定位点,也很轻松的用眼睛看出其所在区域,但是如何用代码实现这个看的过程呢?

如何用代码实现“看出”点所在的区域呢

查看更多

分享到评论

在 Vue 中使用 Highcharts

实例代码及运行过程

请通过这个链接下载实例代码包:https://data.jianshukeji.com/upload/20170907/yvwmwm.zip

下载后解压并进入实例代码目录,执行 npm install 安装相关依赖,并通过 npm run dev 查看运行效果,如下图所示:

查看更多

分享到评论

GBK 页面导出 Highcharts 图表乱码解决办法

Highcharts 官方提供的导出服务器(https://export.highcharts.com.cn) 默认只支持 UTF-8 编码,如果从 GBK 页面提交导出请求,导出的结果是包含乱码的图片,这是很常见的编码问题。

在不能改变页面编码的情况下,解决办法有两种:

  1. 修改导出服务器源码(源码可以到 node-export-server 下载,详见 教程)使其能够支持 GBK 编码
  2. 另外一种方法是将发送到导出服务器的数据改成 UTF-8。

查看更多

分享到评论

Highcharts 性能提升模块

Highcharts 性能提升模块(boost.js) 是官方发布的用于提升性能的模块,可以轻松的让 Highcharts 加载十万、百万级的数据,下面是一个 Highcharts 加载 50 万数据的例子:

查看更多

分享到评论

在 React 及 Webpack 中使用 Highcharts

实例代码及运行过程

请通过这个链接下载实例代码包:https://pan.baidu.com/s/1o7IZfiM 提取码:ktrc

下载后进入实例代码目录,执行 npm install 来安装相关依赖,并通过 npm run build 将源代码打包。

查看更多

分享到评论

在 ionic 中使用 Highcharts

环境准备

通过下面的命令安装 ionic 及相关依赖包,其中 cordova 是用来将 web 资源(包括 HTML、SCSS、Typescript)转换成 Native 应用的包

npm install ionic cordova -g

创建 ionic 项目

ionic start highcharts-ionic blank

简单说明如下

  • highcharts-ionic 为项目名称,并且会创建对应的目录
  • blank 为 ionic 模板名,即用 blank 模板创建项目

查看更多

分享到评论