c ajax 图表,Pyechart Django：前端和后端分离（Ajax），多图表组合显示,pyechartsdjango,前后,ajax,合并,展示...

pyecharts django 前后端分离(ajax)，多图表合并展示

先看pyecharts 官方中文网站

pyecharts 官方中文网站

了解到官方是有相关关于django支持的代码示例的。

完全复制代码是可以正常运行并实现 ajax回调，实现前后端分离。

问题点在于多图表的构建、前端的js代码移植到自己项目的前端框架。

自己的项目前后端分离实现时的坑：(股票k线柱状线多图后端到前端)

多图表合并之后，得到了一个 Grid 对象，却无法将Grid对象转成json，原因为Grid对象无法转json。

官方文档中也有提示转存json支持不友好情况。(这个可以直接无视，目前没有发现问题)

在官方文档观察到单一图表代码中，直接 return c，将c再转成json。

def bar_base() -> Bar:

c = (

Bar()

.add_xaxis(["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"])

.add_yaxis("商家A", [randrange(0, 100) for _ in range(6)])

.add_yaxis("商家B", [randrange(0, 100) for _ in range(6)])

.set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副标题"))

.dump_options_with_quotes()

)

return c

处理分析了好几天注意官方代码比自己多了一句代码.dump_options_with_quotes()。猜测这个是问题的关键，将他加到自己代码的对象中

grid_chart = (

Grid()

.add_js_funcs("var barData = {}".format(data["datas"]))

.add(overlap_kline_line, grid_opts=opts.GridOpts(pos_left="3%", pos_right="1%", height="60%"), )

.add(bar_1, grid_opts=opts.GridOpts(pos_left="3%", pos_right="1%", pos_top="71%", height="10%"), )

.add(overlap_bar_line,

grid_opts=opts.GridOpts(pos_left="3%", pos_right="1%", pos_top="82%", height="14%"), )

.dump_options_with_quotes()

)

再尝试转化json成功。

ajax 前端回调后端地址中坑。

官方示例直接跑是没问题的，将代码移植到框架中却异常，请求时没生成回调请求。

检查问题出现在标签前置与后置的问题。由于本人使用的前端框架中后置的标签，正确的使用方法为代码前置。

c ajax 图表,Pyechart Django：前端和后端分离（Ajax），多图表组合显示,pyechartsdjango,前后,ajax,合并,展示...相关推荐

Django的前后端分离以及Rest风格接口开发大全
1.什么是前后端分离开发: 就是前后端工程师约定好数据交互接口,并行的进行开发和测试,后端只提供数据,不负责将数据渲染到页面上,前端通过HTTP请求获取数据并负责将数据渲染到页面上,这个工作是交给浏览 ...
教你玩转Vue和Django的前后端分离
题图:枯树新芽,来自网络,侵删. 阅读本文大概需要 10 分钟. 今天中秋节,先祝大家节日愉快,不在父母身边的都打个电话关心一下吧,我们最容易忽略的人恰恰是最爱我们的父母. 另外,节假日真的不适合出去 ...
利用Nginx轻松实现Ajax的跨域请求(前后端分离开发调试必备神技)
利用Nginx轻松实现浏览器中Ajax的跨域请求(前后端分离开发调试必备神技) 前言为什么会出现跨域? 造成跨域问题的原因是因为浏览器受到同源策略的限制,也就是说js只能访问和操作自己域下的资源,不 ...
后端处理数据保存请求流程multer+ajax 数据库添加数据前端与后端的数据联通在business_list 页面进行数据处理 @stage3---week3--day4
后端处理基础流程 $ npx be_app -e 快速构建项目骨架 $ yarn 安装依赖包修改 package.json {"name": "be-app" ...
php node.js django,Vue.js和Django搭建前后端分离项目示例详解
本篇文章主要介绍了Django+Vue.js搭建前后端分离项目的示例,具有一定参考价值,有兴趣的可以了解一下在写这篇文章的时候,顺带学习了一下关于Markdown的使用方法. 笔者是个渣渣,一切都是 ...
Django+vue前后端分离项目构建
本项目用的Django是4.0.4版本,vue是2.0版本一.背景主要介绍如何使用后端Django + 前端Vue 的技术栈快速地搭建起一套web项目的框架 1.Django项目和应用的创建 pi ...
手把手Django+Vue前后端分离开发入门(附demo)
前言众所周知,Django对于网站快速开发非常友好,这得益于框架为我们做了很多事情,让我们只需要做一些简单的配置和逻辑即可把网站的功能开发出来.但是,在使用Django的过程中,有一个地方一直是比较 ...
基于Vue和Django搭建前后端分离项目
前言最近公司要做一个系统,需要前后端分离,后端使用Django,前端使用Vue,因为之前主要做的是后端开发,前端只会写一写简单的,Vue只会绑定数据,至于Vue怎么与Django结合还是第一次接触, ...
django+vue前后端分离实现登录实践记载
在使用django+vue完成平台功能开发登录功能,实现后,写这个文章进行记载!!欢迎交流因为做的是内部使用平台,手动创建账号形式,没用到注册功能,无需实现一.登录的功能逻辑设计 1.前端页面输入 ...

c ajax 图表,Pyechart Django：前端和后端分离（Ajax），多图表组合显示,pyechartsdjango,前后,ajax,合并,展示...

c ajax 图表,Pyechart Django：前端和后端分离（Ajax），多图表组合显示,pyechartsdjango,前后,ajax,合并,展示...相关推荐

最新文章

热门文章