1.html代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>第一个 Highcharts 图表</title>

    <!-- 引入 jquery.js -->

    <script src="static/jquery-3.3.1.min.js"></script>

    <!-- 引入 highcharts.js -->

    <script src="static/highcharts-7.0.3.js"></script>

    <style>

        #data {

            display: none;

        }

    </style>

</head>

<body>

<!-- 图表容器 DOM -->

<div id="container"></div>

<pre id="data">

    [

        [1,12],

        [2,5],

        [3,18],

        [4,13],

        [5,7],

        [6,4],

        [7,9],

        [8,10],

        [9,15],

        [10,22]

    ]

</pre>

<script src="static/b.js"></script>

</body>

</html>

2.js代码

var options = {

    chart: {

        renderTo: 'container',

        type: 'spline'

    },

    series: [{}]

};

var jsonStr = document.getElementById('data').innerHTML,

    jsonData = JSON.parse(jsonStr);

options.series[0].data = jsonData;

Highcharts.chart('container', options);

Python使用Flask框架，结合Highchart处理jsonl数据的更多相关文章

  1. Python的Flask框架应用调用Redis队列数据的方法

    转自:http://www.jb51.net/article/86021.htm 任务异步化 打开浏览器,输入地址,按下回车,打开了页面.于是一个HTTP请求(request)就由客户端发送到服务器, ...

  2. 使用Python的Flask框架，结合Highchart，动态渲染图表(Ajax 请求数据接口)

    参考链接:https://www.highcharts.com.cn/docs/ajax 参考链接中的示例代码是使用php写的,这里改用python写. 需要注意的地方: 1.接口返回的数据格式,这个 ...

  3. Python基于Flask框架配置依赖包信息的项目迁移部署小技巧

    一般在本机上完成基于Flask框架的代码编写后,如果有接口或者数据操作方面需求需要把代码部署到指定服务器上. 一般情况下,使用Flask框架开发者大多数都是选择Python虚拟环境来运行项目,不同的虚 ...

  4. python之Flask框架

    一.简单的Flask框架 1)flask简介 Flask 是一个 web 框架.也就是说 Flask 为你提供工具,库和技术来允许你构建一个 web 应用程序. 这个 wdb 应用程序可以使一些 we ...

  5. Python的Flask框架入门-Ubuntu

    全文请见tuts code:An Introduction to Python's Flask Framework Flask是Python一个小而强大的web框架.学起来简单,用起来也容易,能够帮你 ...

  6. Python之Flask框架项目Demo入门

    Python+Flask框架项目Demo入门 本例子用到了 Flask+蓝图+Flask-Login+SQLAlchemy+WTForms+PyMySQL相关架构 Flask Web框架介绍 Flas ...

  7. 使用Python的Flask框架，结合Highchart，动态渲染图表

    服务端动态渲染图表 参考文章链接:https://www.highcharts.com.cn/docs/dynamic-produce-html-page 参考文章是使用php写的,我这边改用pyth ...

  8. Python使用Flask框架，结合Highchart处理csv数据(引申-从文件获取数据--从数据库获取数据)

    参考链接:https://www.highcharts.com.cn/docs/process-text-data-file 1.javascript代码 var options = { chart: ...

  9. Python使用Flask框架，结合Highchart，自定义图表样式主题

    参考链接:https://www.highcharts.com.cn/docs/themes 1.使用官方提供的主题js文件,只需要在 highcharts.js 后引入对应的文件即可,不用修改原有的 ...

随机推荐

  1. HTTP请求错误码大全(转）

    一些常见的状态码为: 200 - 服务器成功返回网页 404 - 请求的网页不存在 503 - 服务不可用 详细分解: 1xx(临时响应) 表示临时响应并需要请求者继续执行操作的状态代码. 代码 说明 ...

  2. 解决 IDEA 中文乱码

    一.打开Intellij的根目录,找到下图的两个文件(根据你的系统是32位或64位选择其中一个配置文件),在配置文件中添加:-Dfile.encoding=UTF-8 二.   配置IDE编码 点击F ...

  3. 将属性和方法添加到Date原型中

    <button onclick="myFunction()">点我</button> <script> Date.prototype.myMet ...

  4. Maximum Gap 典型线性排序

    https://leetcode.com/problems/maximum-gap/ Given an unsorted array, find the maximum difference betw ...

  5. 为什么要用Go语言做后端

    FMZ数字货币量化平台 www.fmz.com, 后端使用Go语言,这里是创始人Zero谈论使用Go语言所带了的便利.原帖地址:https://www.zhihu.com/question/27172 ...

  6. Linux学习之01_基础命令介绍

    初学Linux,还在摸索中,在这个过程中希望能记录下学习到的东西,参考的的书籍为<鸟哥的Linux私房菜> 在这里学到的主要命令有这几个: data cal bc man shutdown ...

  7. 【Tair】淘宝分布式NOSQL框架：Tair

    Tair是淘宝的一个开源项目,它是一个分布式的key/value结构数据的解决方案. 一.基本组成 作为一个分布式系统,Tair由一个中心控制节点(config server)和一系列的服务节点(da ...

  8. [Qt Creator 快速入门] 第1章 Qt Creator简介

    Qt Creator 是一个跨平台的.完整的 Qt 集成开发环境,其中包括了高级C++代码编辑器.项目和生成管理工具.集成的上下文相关的帮助系统.图形化调试器.代码管理和浏览工具等.这一章先对 Qt ...

  9. Windows环境下使用Netsh命令快速切换IP配置

    不同的内网环境需要使用不同的IP配置,频繁切换令人发狂,因此搜索了快速切换IP配置的方法. Netsh interface IP Set address "以太网" Static ...

  10. document.write()、onclick="alert(xxx)、innerHTML、image.src.match("xxx")、id2.style.color="blue";、isNaN(id2)、document.write("糟糕！文档消失了。")、alert(id2.outerHTML)、id2.className="id06";、onclick="return registe"

    <html> <head> <meta charset="utf-8"> <title>javascript</title&g ...