我需要一个工具来自动将简单的HTML转换为图像.我将控制HTML输入,它将包含简单的文本格式标签和可能的图像链接 - 我不需要能够呈现任意HTML.有一个简单的方法吗?
我看过像Gecko和Webkit这样的HTML布局引擎,但坦率地说,我对它们拥有的选项数量感到不知所措 - 我不需要一个完整的Web浏览器!是否可以这种方式使用这些引擎?有人能引导我朝着正确的方向前进吗?
浏览器等其他可能性依赖于真实浏览器的屏幕截图,但我将在具有潜在许多用户的Web服务器上运行此应用程序,因此性能非常重要,我担心这种解决方案无法扩展.
想法?
编辑:抱歉忘记提到我的服务器正在运行Linux,因此Windows解决方案无济于事.:)
我正在寻找一些物理模拟,我需要在Java中快速渲染.
我过去遇到过Java2d的性能问题,那么快速的选择是什么?JOGL明显比Java2d快吗?
这是一个html页面:
<html>
<head>
<title>
Frame Set
</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<link rel="stylesheet" href="frame.css" type="text/css" media="screen" />
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
var winSize = $(window).width();
var margin = (winSize-1000)/2;;
$('#main').css({'margin-left':margin,'margin-right':margin});
}
)
$(function() {
$(".frame").each(function() {
var width = ($(this).find('.h').width()),
height = $(this).find('.l').height(),
pad = $(this).find('.h').position().left,
actWidth = width + 10,
nHeight = height - (height * 2),
rLeftMargin = actWidth - 1,
bWidth = actWidth;
$(this).find('.r').css({'margin-top':nHeight, 'margin-left':rLeftMargin, 'height':height});
$(this).find('.h').css({'height':25});
$(this).find('.b').css({'width':bWidth, 'margin-top':0});
});
});
</script>
</head>
<body>
<div id="main" align="center" …Run Code Online (Sandbox Code Playgroud) 我想为iPhone制作一个简单的鼓机应用程序.
现在我正在为它设计archichecture.经过一些研究后,我决定坚持使用Apple的音频单元托管指南中描述的方法制作播放系统,这些技术也在音频混音器样本中展示,它们的复杂性非常适合我目前的工程知识.(Mixig C++和Objective-C代码并使用OpenAl看起来很可怕)
但我一直在搞清楚,我将如何制作一个简单的音乐可视化工具,我打算做标准的频谱可视化工具,显示表示不同频率成分强度的垂直条.
我无法决定用什么来分析原始声音数据,我将提供给声音I/O模块,是否有任何Objective-C框架?
另外我不知道使用什么类型的图形渲染?可以使用Core Graphics制作简单的可视化工具,还是仅仅是OpenGL的工作?我想每秒实现大约30次更新,以使其看起来流畅?
你能帮助我吗?
重要提示:这个问题不是关于几何剔除(截头剔除,背面剔除,遮挡剔除或任何朋友).这个问题是关于在设置时消除几何,早在我们进行剔除和渲染之前.
在一个单位立方体渲染的世界(一个 MineCraft)中,我试图找到如何从我的几何面列表中删除无法从任何角度看到的几何面的算法,无论相机在哪里.
例如,想象2个方块:
+----+ +----+
| | | |
| | | |
+----+ +----+
Run Code Online (Sandbox Code Playgroud)
显然有8个可见的边(每个方格4个.)现在我将方块移动到一起,相对于:
+----+----+
| |
| |
+----+----+
Run Code Online (Sandbox Code Playgroud)
而不是有8个方面,现在我只有6个!无论相机放置在何处,也无法看到它所面对的角度,无法看到中间触摸的两个.(方块的纹理不同,所以我们不能称它为4边.)
(同样的东西在3D中使用立方体,但是12个面(每个立方体6个)变为10个,因为2个触摸被消除了.)
我的问题是:有哪些算法可以帮助我识别这些隐藏的面孔?(我很高兴自己做谷歌搜索,但我甚至不知道这叫什么!)特别是,我正在寻找能够处理中间点的空洞点的东西,如果你是但是,因为它们被几何体包围,你无法看到它们.
例如:
+----+----+----+----+
| |
| |
+ +----+ +
| | | |
| | A | |
+ +----+ +
| |
| |
+----+----+----+----+
Run Code Online (Sandbox Code Playgroud)
在这种情况下,人们可能认为有18个"可见"的边,但是,因为我们知道相机在几何体之外的事实,所以方形"A"中的4个边是不可见的.
为了使事情进一步复杂化,我希望找到一种算法,如果添加或删除一个块,可以快速更新(再次,一个 MineCraft.)
谢谢!
我正在为一个Android应用程序编写一个图形库(是的,我知道有很多,但没有提供我们需要的可定制性).
我希望图表可以缩放和平移.
我希望体验顺畅,留下小巧的CPU占用空间.
View.onDraw(Canvas)BitmapOpenGLOpenGL可能是专业的解决方案,肯定会提供更多的灵活性,但它需要更多的工作(多少不清楚).
有一点在OpenGL中更容易实现平移/缩放,因为我可以操纵矩阵来使其正确,其余的应该更难,尽管我认为.
我不怕弄脏手,但我想知道在开始挖掘之前我正朝着正确的方向前进.
我错过了任何解决方案吗?我所有的解决方案都理智吗?
我可以补充一点,当图形发生变化时,我希望对变化进行动画处理,这可能是最苛刻的任务.
是否有可能提高webview中的渲染速度?使用简单的innerHTML,显示内容需要接近1秒,尽管js渲染需要几毫秒.使用IOS,即使使用性能较低的硬件,完全相同的代码也可以快速而完美地运行.
在Android下测试:2.3,3.2,4.0(Desire HD,Galaxy Nexus,Galaxy Tab)IOS:4,5(iPhone 3gs,4)
感谢任何有用的回应!
我正在使用python(在LinuxMint中使用虚拟环境),我安装了pygal.
一切正常(渲染到html)但不渲染到svg或png.结果:只有黑色背景.
我安装cssselect并tinycss喜欢这里提到的.
它是第一次工作,但在重试时,我遇到了同样的问题.
(我不知道这是否相关,但在上周使用黑暗表格导出照片时,这种情况发生在我身上)
我使用pygal网站上的例子:
import pygal # First import pygal
bar_chart = pygal.Bar() # Then create a bar graph object
bar_chart.add('Fibonacci', [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55]) # Add some values
bar_chart.render_to_file('bar_chart.svg') # Save the svg to a file
Run Code Online (Sandbox Code Playgroud)
编辑:
bar_chart.render_to_png('bar_chart.png')
Run Code Online (Sandbox Code Playgroud)
现在正在工作.
但不是:
bar_chart.render_to_file('bar_chart.svg')
Run Code Online (Sandbox Code Playgroud) 我正在处理类似于此的代码,以创建一个输入字段具有嵌入按钮的组件:
http://codepen.io/anon/pen/pgwbWG?editors=110
如您所见,按钮绝对定位top并bottom设置为0,以实现100%高度元素.
另外需要注意的是,文本输入的边框必须保持可见,并且还要包裹按钮.为了达到这个目的,我margin: 1px在按钮上添加了一个,以便(应该是)空间显示周围的文本输入红色边框(通常在输入字段内容无效时).
就是在Firefox上它(大部分)正确呈现,而在Chrome上(显然在最新的Safari上)它会在按钮底部有1px的间隙.
CSS似乎确定,但它似乎是在渲染,在底部或按钮的上边距是不是真的1px的计算/舍入的问题(可以看到它检查元素).此外,输入的填充似乎也会影响到.
在不同的缩放率下,它会在按钮的顶部或底部添加或删除1px的边距,从而产生1px间隙或覆盖边框.
当我设置按钮边距时0px,底部边距是固定的,但我松开顶部的1px边距,完成覆盖文本输入的红色边框.
也许我不明白或解释它太冗长,所以这里是错误的一些截图,从不同的缩放在Chrome(注意CSS始终是相同的):
我无法找到跨浏览器的解决方案.如何处理它并获得一致的组件?(请不要使用Javascript)
我有一个非常基本的vueJS应用程序,我正在关注该网站.
这是代码,为什么组件不呈现?
HTML
<script src="https://unpkg.com/vue"></script>
<div id="app">
<p>{{ message }}</p>
</div>
<div>
<ol>
<todo-item></todo-item>
</ol>
</div>
Run Code Online (Sandbox Code Playgroud)
JS
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
}
})
Vue.component('todo-item', {
template: '<li>This is a list item</li>'
})
Run Code Online (Sandbox Code Playgroud) rendering ×10
android ×2
html ×2
javascript ×2
performance ×2
3d ×1
audio ×1
css ×1
css3 ×1
drawing ×1
image ×1
iphone ×1
java ×1
java-2d ×1
jogl ×1
jquery ×1
layout ×1
minecraft ×1
mozilla ×1
objective-c ×1
opengl ×1
opengl-es ×1
optimization ×1
pygal ×1
python ×1
subpixel ×1
svg ×1
vue.js ×1
webview ×1