Question

我正在为客户的应用程序评估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的方式有关的错误？如果它是一个bug，它很快就会被修复的机会吗？我可以想办法解决这个问题的几种方法，但是如果可能的话，我宁愿把黑客留下来，只要等到一个人就可以解决这个问题。

编辑：我意识到我已经为Y轴复制了标记，该标记与此处包含的视图代码不匹配，因此我对其进行了更新。在这样做之后，我意识到标签正在变成一个＆＃34;字体：＆＃34;在它已经定义了系列，大小等之后添加了最后的样式。这让我更加想到这就是ShieldUI如何生成该标记的错误。

Answer 1

我们已经确定了Shield UI JavaScript Chart组件中的一个错误，该错误也影响了ASP.NET和MVC包装器。您描述的行为是由于字体设置应用于图表轴标题的方式存在问题。在某些情况下，Shield UI图表会应用默认的font样式，以防止fontSize和fontWeight等设置被应用。

该问题在发现后不久即已修复，并将在即将到来的即将发布的 1.6.4 版本的Shield UI JavaScript套件中提供。该修补程序与所有服务器端包装程序兼容，包括ASP.NET MVC。

ShieldUI图表Y轴样式无法正常工作

1 个答案: