从FirefoxDriver和HtmlUnitDriver获取的渲染SVG的差异
Difference in rendered SVG fetched from FirefoxDriver and HtmlUnitDriver
我正在使用JQuery 1.8和Highcharts 4.1.9在HTML文件中使用以下代码创建highchart图表。
<div id="JSGraphContainer" class="GraphContainerJS" "></div>
<script>
$(function() {
var line;
var plotList= [];
data = {"vals": [['1244246400000', 11],
['1244332800000', 22],
['1244419200000', 11],
['1244505600000', 22],
['1244592000000', 33],
['1244678400000', 11],
['1244764800000', 22]
]};
$("#JSGraphContainer").highcharts({
chart: {
type: 'line',
zoomType: "x",
plotBorderWidth: 1,
plotBorderColor: 'black',
},
title: {text: null},
xAxis: {
crosshair: true,
type: 'datetime',
opposite: true,
tickmarkPlacement: "on",
gridLineDashStyle: "Dash",
gridLineWidth: 1,
tickWidth : 0,
plotLines: plotList,
},
yAxis: {
title: { text: null },
tickAmount: 5,
gridLineDashStyle: "Dash",
opposite: false
},
series: [{ data: data.vals }],
plotOptions: {
series: {
marker: {
enabled: true
}
}
},
legend: {enabled : false},
tooltip: {
formatterdd: function() {
return ((new Date(this.x)).toDateString()) + ", " + this.y;
},
pointFormat: '<span style="color:{point.color}">'u25CF</span><b>{point.y}</b><br/>',
crosshairs: {
color: 'green',
dashStyle: 'solid'
}
}
});
});
</script>
我的测试代码,这意味着提取生成的SVG出来比较的目的是
WebElement elem = driver.findElement(By.className("GraphContainerJS"));
String contents = (String)((JavascriptExecutor)driver).executeScript("return arguments[0].innerHTML;", elem);
System.out.println(contents);
当我使用FirefoxDriver,然后我得到正确的SVG打印出来的sysout,但当我使用JavaScript启用HTMLUnitDriver,然后我得到不同的SVG输出不匹配firefox,不渲染任何东西时复制到html文件。我尝试使用firefox的功能
new HtmlLUnitDriver(DesiredCapabilities.firefox());
但它没有帮助。我希望必须有一种方法来配置HtmlUnitDriver,如果有的话,以获得正确的输出。
感谢任何提示。
在highcharts中已经有一个叫做getvg的方法可以使用。
svg = chart.getSVG()
.replace(/</g, ''n<')
.replace(/>/g, '>');
http://jsfiddle.net/Nishith/g10j2ymc/相关文章:
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 如何使用javascript从主svg对象动态创建svg视图框
- 如何更改<svg>标记为<img>用js标记
- 锚点元素不't使用svg时,请打开EDGE上的href
- 带有填充属性的SVG矩形显示在包含元素的上方插入框阴影
- 使用onclick绘制SVG路径
- SVG/JavaScript:尝试选择和更改多边形点
- 顺时针旋转Svg元件
- 禁用SVG拖动
- 在select元素中显示highchart dashstyle(svg)
- 在D3.js中,有没有任何方法可以将x和y方向上的滚动事件绑定到平移svg
- 缩放Raphael/SVG容器以适应所有内容
- JavaScript-动态SVG-onload属性-未触发事件
- 设置动画时,SVG/Raphael大圆圈会变形
- 使用SVG和JavaScript创建波浪动画
- Canvas+svg路径动画,在路径中的特定点暂停一段时间,然后继续
- D3.js生成有效的SVG,但不显示任何内容
- SVG xml to image
- 如何自动保存动态生成的HTML SVG元素
- 从FirefoxDriver和HtmlUnitDriver获取的渲染SVG的差异