0

我正在为客户的应用程序评估 ShieldUI，我遇到了在 Y 轴标题上设置样式的问题。以下是视图中的代码：

@(Html.ShieldChart(Model)
      .Name("chart")
      .PrimaryHeader(header => header.Text("")) //no header needed
      .Export(true) //turn on export
      .ChartLegend(legend => legend.Enabled(false)) //turn off legend since there's only 1 series
      .Tooltip(tooltip =>
               tooltip.ChartBound(true)
                   //turn on the axis marker tooltip thingy
                      .AxisMarkers(axisMarkers =>
                                   axisMarkers.Enabled(true).Mode(TooltipAxisMarkerMode.XY)
                                              .Width(1).ZIndex(3)
                   )
                      .CustomHeaderText("{point.pointName:MM-yyyy}")
                      .CustomPointText("{point.y:c}")
      )
      .AxisX(axisX => axisX
                          .CategoricalValues(model => model.Date)
                          .Title(title => title.Text("Month").Style(style => style.FontWeight(FontWeight.Bold)))
                          .AxisTickText(axisTickText => axisTickText.Format("{text:MM-yyyy}")))
      .AxisY(axisY => axisY
                          .Title(title => title.Text("Price").Style(style => style.FontWeight(FontWeight.Bold)))
                          .AxisTickText(axisTickText => axisTickText.Format("{text:c}")))
      .DataSeries(dataSeries => dataSeries.Line()
                                          .Data(model => model.Price)))

x 轴上的粗体设置工作正常，但我无法在 Y 轴上设置粗体或大小。看起来生成的标记可能有问题。以下是标记中的两个文本元素：

<text x="432" y="375" style="font-family:Segoe UI, Tahoma, Verdana, sans-serif;font-size:12px;color:#404040;font-weight:bold;fill:#404040;" zIndex="7" text-anchor="middle" visibility="visible"><tspan x="432">Month</tspan></text>

<text x="25" y="181" style="font-family:Segoe UI, Tahoma, Verdana, sans-serif;font-size:12px;color:#636363;font-weight:bold;font:11px Segoe UI, Tahoma, Verdana, sans-serif;fill:#636363;" zIndex="7" transform="rotate(270 25 181)" text-anchor="middle" visibility="visible"><tspan x="25">Price</tspan></text>

第一个工作正常，第二个没有，我注意到他们定义字体信息的方式不同（第一个使用 font-family 和 font-size，第二个使用单一字体设置。如果我复制 (通过萤火虫）从 x 到 y 的样式定义，y 轴变为适当的粗体。

是我做错了什么，还是 ShieldUI 生成 SVG 的方式有问题？如果它是一个错误，它是否有可能很快被修复？我可以想出几种方法来解决这个问题，但如果可能的话，我宁愿把黑客排除在外，然后等待修复，如果有的话。

编辑：我意识到我复制的 Y 轴标记与我在这里包含的视图代码不匹配，所以我更新了它。这样做之后，我意识到标签在已经定义了系列、大小等之后，在末尾添加了一个“字体：”样式。这让我更加思考，所以这是 ShieldUI 的一个错误生成该标记。

4

1 回答 1

0

我们在 Shield UI JavaScript Chart 组件中发现了一个错误，该错误也影响了 ASP.NET 和 MVC 包装器。您所描述的行为是由于字体设置应用于图表轴标题的方式存在问题。在某些情况下，Shield UI 图表应用了一种默认font样式，该样式阻止了诸如fontSize和fontWeight无法应用的设置。

该问题在发现后不久就得到了修复，预计将在下周发布的 Shield UI JavaScript 套件的1.6.4版本中提供。该修复与所有服务器端包装器兼容，包括 ASP.NET MVC。

于 2014-04-11T21:39:40.777 回答