问题: 在使用highcharts生成的图标中dataLabels是有阴影的,通常是影响美观,那么如何去除阴影呢?

原因:是因为highcharts将dataLabels生成的标签是tspan,里面有fill 和stroke属性,而且是tspan的属性而不是style里的样式,所有无法通过修改css样式进行修改.

解决方案:

1. useHTML: true,该属性可以让highcharts将dataLabels生成span标签,也没有fill和stroke属性;  (该属性官方解释为:https://api.hcharts.cn/highcharts#plotOptions.series.dataLabels.useHTML)

dataLabels: {
    useHTML: true,//标签作为HTML
}

生成的span标签

2. 网友利用js粗暴将tspan标签的属性改掉.但是这个方法真的无法推荐. 网友解决方案:http://blog.csdn.net/qq_26599807/article/details/53697257

$("tspan.highcharts-text-outline").css("fill","none");
$("tspan.highcharts-text-outline").css("stroke","none");

highcharts的dataLabels如何去处阴影的更多相关文章

  1. highCharts 饼图动态加载

    饼图的动态加载 (1):导入样式 <script type="text/javascript" src="<%=request.getContextPath( ...

  2. Highcharts属性中英文参照

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  3. highcharts相关属性

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  4. HighCharts 详细使用及API文档说明

    一.HighCharts开发说明: HighCharts开发实际上配置HighCharts每个部分,比如配置标题(title),副标题(subtitle)等,其中每个部分又有更细的参数配置,比如标题下 ...

  5. Highcharts选项配置详细说明文档(zz)

    http://www.helloweba.com/view-blog-156.html Highcharts提供大量的选项配置参数,您可以轻松定制符合用户要求的图表,目前官网只提供英文版的开发配置说明 ...

  6. Highcharts的基本属性和方法详解

    Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用. 目前Hig ...

  7. 纯JavaScrip图表插件——Highcharts

    简介 Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用.目前H ...

  8. HighCharts开发说明及属性详解

    一.HighCharts开发说明: HighCharts 开发实际上配置HighCharts每个部分,比如配置标题(title),副标题(subtitle)等,其中每个部分又有更细的参数配置,比如标题 ...

  9. Highcharts属性详解

    Highcharts的基本属性和方法详解 Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学 ...

随机推荐

  1. 【ARC101F】Robots and Exits 树状数组

    题目大意 有 \(n\) 个机器人和 \(m\) 个出口. 这 \(n\) 个机器人的初始位置是 \(a_1,a_2,\ldots,a_n\),这 \(m\) 个出口的位置是 \(b_1,b_2,\l ...

  2. for循环里使用查询如何优化(代码库)

    for循环里的查询,只是为了赋值对象中的一个字段,如果每一个都重新查一下数据库,影响效率 应该先进行查询,然后再循环里组装自己需要的业务数据 如下代码:list1 查询出对象的一部分内容,list2 ...

  3. B-树(B树)详解

    具体讲解之前,有一点,再次强调下:B-树,即为B树.因为B树的原英文名称为B-tree,而国内很多人喜欢把B-tree译作B-树,其实,这是个非常不好的直译,很容易让人产生误解.如人们可能会以为B-树 ...

  4. 利用DOS命令窗口进行Mail通信(二)

    一:SMTP协议(对邮件进行发送) <SP>代表空格,<CRLF>代表回车和换行 SMTP命令格式 说明 ehlo<SP><domain><CRL ...

  5. qml : qml控件自适应;

    import QtQuick 2.4 Item { property var targetItem: parent property bool fixedAspectRatio: true // El ...

  6. Appium测试,定位H5元素(HTML5)

    代码如下: public static void main(String[] args) {         try {             AndroidDriver driver;       ...

  7. Numpy系列(三)- 基本运算操作

    Numpy 中数组上的算术运算符使用元素级别.最后的结果使用新的一个数组来返回. import numpy as np a = np.array( [20,30,40,50] ) b = np.ara ...

  8. Pandas系列(七)-计算工具介绍

    内容目录 1. 统计函数 2. 窗口函数 3. 加深加强 数据准备 # 导入相关库 import numpy as np import pandas as pd #Pandas 中包含了非常丰富的计算 ...

  9. CMDB服务器管理系统【s5day90】:API构造可插拔式插件逻辑

    1.服务器端目录结构: 1.__init__.py from django.conf import settings from repository import models import impo ...

  10. 基于alpine制作php镜像

    alpine包搜索https://pkgs.alpinelinux.org/ 安装依赖库 apk add --no-cache xxx 可以基于php apline镜像自行增加或删除扩展. https ...