javascript - 关于echarts图像中的条形图和饼状图的样式问题
请教大神,上图是我们要求实现的最终效果,但是我目前demo只实现了下图中的效果,那么问题来了: 1、怎么在下图一中(条形图),每个条形图的最后添加数字啦? 2、怎么去掉饼状图外每一部分的文字说明(参考上图中没有的),并且在饼状图中显示百分比啦?
198 2022-07-19
编程技术问答社区
javascript - Echart X坐标轴名称放在左边与Y坐标抽刻度重叠,如何解决?
下面这张图是正常情况下的折线图,现在需要的效果是把x轴的名称(年月)移动到图示指定区域,这样图表区域就可以撑满到右边边界了 然后就有了下图 图表是用百度图说绘制的,未找到调整坐标轴名称位置的参数,网上也未搜到,求助大神 使用nameGap参数,拉开了与X轴的距离 如下图 但是查了下文档好像没法拉开与Y轴的距离 使(年月)和(201605,201606...)在一条水平线上
988 2022-07-19
编程技术问答社区
javascript - 怎么设置echart中提示框的数据呢?
请教大神们,怎么让echarts中提示框出现多个数据?echarts提示框默认只显示Y轴坐标值一个数据,但是我还想让它显示多个数据。目前我只能显示总会话量,包过时间和其他的地区数据不知道怎么显示?还有就是x轴的样式,那些小圆点有数据和没数据怎么弄呀?以下是我的代码: option = { title: { text: '折线图' }, tooltip: { trigger: 'axis' }, legend: { data:['总访问量'] }, grid: { left: '1%', right: '2%', bottom: '3%', containLabel: true }, toolbox: { feature: { saveAsImage: {}
304 2022-07-19
编程技术问答社区
vue.js - 在vue2.0项目中使用echarts的地图功能
想要在vue项目中使用echarts的地图,但是一直提示 我在main.js引入了文件 import echarts from 'echarts' import zhejiang from 'echarts/map/js/province/zhejiang' Vue.prototype.$echarts=echarts 并在视图中使用 mychart=this.$echarts.init(id,theme);//初始化echart对象 mychart.setOption(option); 在视图中进行绘图,但是总是报错,有没有大神知道要怎样做呢?
1724 2022-07-19
编程技术问答社区
canvas - echarts如何绘制数组长度不同的两条折线?
问 题 RT,Arr1有100个数据,是形如[{time:'xxx',score:'223'}...]的对象数组,这样能够绘制一条x轴是时间的折线图,这一步没问题。 接着有20个数据的Arr2,这20个数据的时间范围不超过Arr1的,但是score是新的,就相当于从Arr1取出20个时间,再重新赋值score,得到的Arr2。 要怎么样设置option在第一条折线图的基础上把Arr2的折线图绘制出来?即使用同一个x轴。 解决方案 用{time:'xxx',score:null}或者{time:null,score:null}(时间长了记得不是很清楚了,两个你都试试吧),补足Arr2,使其长度和Arr1长度一样试试。
836 2022-07-19
编程技术问答社区
javascript - 百度echarts series数据更新问题
我直接上个演示地址吧,方便查看问题所在,代码也是写在页面中的 默认先请求一次,然后定时器,每隔一段时间去请求数据,更新图表,但是发现我请求成功后, 想重新 Tcharts.setOption(option)的时候,还是存在着上一次的数据,比如我第一次请求是2条数据,然后渲染没有问题,第二次请求返回1条数据的时候,渲染有问题,图表还存在着上一次的数据 我截了下ajax请求的图片 var maxpage = 1; var dataPage = 1; var option = {}; var dataArray ,xAxisArray,legendArray; var Tcharts = echarts.init(document.getElementById('Tcharts')); Tcharts.setOption({ title: { //是否显示标题组件 s
262 2022-07-19
编程技术问答社区
前端 - echarts柱状图x轴坐标有没有办法间隔一个显示?
如图,我用了ECharts的这个柱状图,下面x轴的数字太密集了,能不能让x轴的坐标间隔一个显示数字? xAxis: { axisTick: { show: false }, axisLine: { show: false, lineStyle: { color: 'rgba(255,255,255,0.2)' } }, interval: 5, type: 'value', axisLabel: { show: true, interval: 'auto', formatter: '{value}', textStyle: {
688 2022-07-19
编程技术问答社区
javascript - echarts的tooltip无法显示,触发时formatter可以打印出数据;
echarts版本:3.2.3; 安装:npm(通过页面直接引用js文件也不行,tooltip组件确定有); 浏览器:chrome 53; 所有图中的Tooltip都不显示;但是鼠标 hover 和 dispatchAction 触发都可以在控制台中打印出formatter处理好的数据;其他功能都没有问题; 其中一个散点图的配置: tooltip: { show: true, formatter: function (params) { var tmp = params.value[0]/100; var value = ~~(tmp) + '.' + Math.round(tmp%(~~tmp)*12) + '月 ' + params.seriesName + '退出金额:' + params.value[1] + '万元'; console.info(value);
772 2022-07-19
编程技术问答社区
ECharts3 IE8渲染新数据时不在原位置渲染
1.ECharts3 IE8渲染新数据时不在原位置渲染,如图 2. 出现的BUG: 想要的效果: 3. Title .nj_zb{height:270px;} // echarts绘画饼图 function xrzh02(id,datas){ var zh02_labels = new Array(); var zh02_values = new Array();
252 2022-07-19
编程技术问答社区
javascript - 请教:如何让echarts的地图悬浮框出现多组series数据?
是这样的,我们一个项目,需要echarts地图功能,别的都调整好了,但是却遇到一个很麻烦的问题:地图的悬浮框默认只显示一组数据,我尝试了很多办法也没能让设置的两组数据都呈现在悬浮框中,下面是我的代码。ps:在tooltip中我输出了params,发现输出的也是第一组数据。 $.get('data/hangzhou.json', function (hangzhoujson) { //图标的json数据 echarts.registerMap('hangzhou', hangzhoujson); //图标 chart.setOption({ title: { text: '杭州市各区县并网点个数分布', subtext: '拱墅区、西湖区、上城区、下城区、江干区、滨江区数据统一为主城区数据', textStyle:{
320 2022-07-19
编程技术问答社区
javascript - 饼图图例设置了,可初始化的图表中图例不出现
背景:angular自定义指令结合echarts生成饼图 昨天我在处理饼图的时候,莫名其妙图例没有了,也不知道因为什么原因,排查了很久都没有发现。legend正常设置,并且回调中输出legend的值也存在,请问有没有遇到过这样情况的?最终是怎么解决的呢?恳请指导。 html代码如下: js代码如下: var app=angular.module('reportPro',[]); app.controller('pieCtrl1',function($scope){ $scope.url='../../dataStatistics/getPieDataOne.action'; $scope.name='全市项目申请批复情况'
504 2022-07-19
编程技术问答社区
react.js - 在React中使用echarts省市地图
我需要实现一个:全国 =》 省 =》 市 的联动切换效果; 遇到一个问题:在使用echarts省市地图时报错。 代码如下: 1.引入地图文件: 我使用的是JS文件的地图文件。前提是已经用npm安装了echarts。 import React, { Component } from 'react'; import echarts from 'echarts'; import $ from '../../js/lib/jquery'; import './index.scss'; import '../../../node_modules/echarts/map/js/china'; import '../../../node_modules/echarts/map/js/province/anhui'; import '../../../node_modules/echarts/map/js/province/aomen'; import '../../..
1778 2022-07-19
编程技术问答社区
javascript - echarts 图形占满整个容器
如图,蓝色背景是容器,但是echarts图上下左右还有很多空间.导致显示不够.怎么铺满一点? tooltip: { formatter: "{a} {b} : {c}%" }, grid: { top: 0, bottom: 0 }, toolbox: { show: false }, pointer: { length: '10%', width: 4, color: 'auto' }, series: [{ name: '总数', type: 'gauge', max: 100, detail: { formatter: '{value}', offsetCenter: [0, '10%'], textStyle: { color: 'auto', fontSize: 12
276 2022-07-19
编程技术问答社区
javascript - echart饼图如何动态显示label
问 题 这是目前的效果,在codepen上,然后我想要的效果是,鼠标移开之后还是显示值,就是最后那个值,然后一开始没有交互的时候显示一个默认的项,目前用的是label的emphasis来显示,是否要改成normal来显示? 解决方案 var mychart = echarts.init(document.getElementById('chart')); mychart.on('mouseover', function(params) { option.series[0].data[params.dataIndex].label.normal={ show: true, textStyle: { fontSize: '35', fontWeight: 'normal' } } mychart.setOption(option); }); 监
1068 2022-07-19
编程技术问答社区
javascript - echarts中饼形图的legend的问题
如下图所示,legend的右边都有对应的数字,而legend的name和value都是后台动态生成的且以数组的形式发送过来,若是固定的name我是实现了,但是动态的我却怎么也显示不了legend右边的数字,以下是我的demo代码,我要实现的效果就是下图中legend的样式:name和value始终对应。请大神指点! 显示的效果: 代码: 后台传过来的data : {"dataTwo":["首页","提现页"], "dataThree":[128,85], } option函数: function userplace(data) { return { title: { text: '' }, tooltip: { trigger: 'item', formatter: "{a} {b} : {c} ({d}%)"
212 2022-07-19
编程技术问答社区