4

我有一个具有外部 JSON 样式文件的 ZingChart（通过 cfchart）。如何在不单独设置的情况下为图表中的所有文本设置字体属性，例如字体系列、字体粗细、字体大小？

到目前为止我的 JSON 文件：

{
"graphset":[
    {       
        "background-color":"white",
        "font-family":"Courier New",
        "scale-x":{
            "label":{
                "text":"Date"
            }
        },
        "scale-y":{
            "label":{
                "text":"Score"
            },
            "markers":[
                {
                    "type":"line",
                    "range":[75,76],
                    "line-color":"red"
                },
                {
                    "type":"line",
                    "range":[50,51],
                    "line-color":"yellow"
                }
            ]
        },
        "tooltip" : {
            "text" : "Score of %v on %k",
            "background-color" : "#ff9900"
        },
        "plot":{
            "marker":{
                "type":"square"
            }
        }
    }
  ]
}

我知道我可以为所有 scale-x "item"s 单独添加它：

"scale-x":{
            "label":{
                "text":"Date"
            },
             "item":{ 
                "font-angle":320,
                "font-family":"Arial",
                "font-weight":"bold",
                "font-size":13
            }
        }

但我想为图表中的所有文本添加它。

4

2 回答 2

6

您可以使用 CSS 后代选择器来执行此操作。使用图表 div 的 id 和 tspan 元素选择器将 font-family、font-weight、font-size 等应用于图表中的所有文本元素。以 div id="zc" 呈现图表的示例：

<style>
#zc tspan { font-family: Comic Sans, Comic Sans MS, cursive !important;font-weight:bold !important;font-size:12px !important; }
</style>

演示在这里

很抱歉造成混淆，这是一个非 CSS 解决方案：

在您的图表 JSON 对象中，将具有所需全局属性的“globals”对象放在根级别（与“graphset”相同的级别）：

  {      
    "globals":{
      "font-size":20,
      "font-family":"Papyrus"
    },
    "graphset":[
      {
        "type":"line",
        ...
      }
    ]
  };

新的演示在这里

于 2015-02-12T19:06:38.593 回答
-1

您还可以使用 *（通配符）选择页面上的所有元素

例如：

* { font-family: Comic Sans, Comic Sans MS, cursive !important;font-weight:bold !important;font-size:12px !important; }
于 2015-02-12T19:11:54.273 回答