热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

网页中嵌入任意web字体解决方案

方案一:使用css3font-face,详细参照:http:www.w3cplus.comcontentcss3-font-face方案二:文字转svgpat
方案一:

使用css3  font-face,详细参照:http://www.w3cplus.com/content/css3-font-face


方案二:
文字转svg path,在html中使用svg标签绘制文字

String fOntPath="D:/IdeaProjects/text2svg/fonts/站酷酷黑.TTF";
String text="我们";
try {
ResultData resultData = Text2SvgUtils.toConvert(fontPath, text);
System.out.println(resultData);
} catch (Exception e) {
e.printStackTrace();
}
创建Font用时:172
总用时:179ms
ResultData{fOntFace=FontFace{fOntFamily='HuXiaoBo_KuHei', unitsPerEm=1000, panose='2 1 6 0 3 1 1 1 1 1', ascent=859, descent=-141}, charGlyphList=[CharGlyph{source=我, glyphName='uni6211', unicode='我', horizAdvX=1000, arabicForm='', d='M36 212V319L245 338V432H31V517L63 500H245V558L64 555L35 538V635L491 644Q500 644 511 647T526 664V563L373 560V500H580L567 648H722L704 629L715 500H836L828 633L810 652H945L953 500H970V412Q965 425 955 428T935 432H720L732 286L944 339L967 369V255L740 199L746 124H936L966 141V57H729H727H619L609 166L547 151Q538 146 531 138T519 115V233L601 253L586 432H373V350L513 364L542 399V274L373 260V57H278H277H39V141L70 124H245V249L67 234L36 212Z', missing=false}, CharGlyph{source=们, glyphName='uni4EEC', unicode='们', horizAdvX=1000, arabicForm='', d='M957 55Q952 65 941 69T921 73H680V159L712 142H829V568H571V654L602 637H957V55ZM242 75H113V438H43L136 647L118 666H267L202 512H242V75ZM426 74H298V477L280 496H426V74ZM552 532H414L342 647L309 666H470L552 532Z', missing=false}]}


html中svg:
其中 transform="translate(0, 860) scale(1, -1)"  // 860 参照: ResultData中的ascent

JAVA代码:参照  https://github.com/ahdshao/text-to-svg

方案三:
        方案二每次执行需要用时100+ms,用时过长。 解决用时问题,将文字path数据持久化到Redis(字体下的文字path几乎永久不会改变,只会新增)提供查询服务。
执行效率10ms以内,命中jvm 0ms以内
1、使用apach batik 工具将TTF文件转成SVG文件
java -jar batik-ttf2svg.jar C:\Users\zhaodahao\Desktop\字体包\站酷快乐体.ttf  -l 32 -h 65374 -o C:\Users\zhaodahao\Desktop\test\站酷快乐体.svg
2、使用SAX解析SVG文件
           log.info("开始解析svg文件:" + xmlPath);
//获取SAX分析器的工厂实例,专门负责创建SAXParser分析器
SAXParserFactory saxParserFactory = SAXParserFactory.newInstance();
//获取SAXParser分析器的实例
SAXParser saxParser = saxParserFactory.newSAXParser();
XmlSAXHandler saxHandler = new XmlSAXHandler();
saxParser.parse(new File(xmlPath), saxHandler);
log.info("解析 " + name + ".svg 用时:" + (System.currentTimeMillis() - start));
log.info("WebIcon数量:" + saxHandler.getWebIcons().size());

long ss = System.currentTimeMillis();
// 清空缓存中的数据
jimClient.del(RedisTypeEnum.FONT_DATA.getCode() + webFontId);
// 保存字体path数据缓存
batchAddWebIcon(webFontId, saxHandler.getWebIcons(), 10000);
log.info("保存字体数据 用时:" + (System.currentTimeMillis() - ss));

WebFont webFOnt=new WebFont();
webFont.setId(webFontId);
webFont.setDescName(name);
webFont.setFontFace(saxHandler.getFontFace());
//添加字体类型缓存
jimClient.hSet(RedisTypeEnum.FONT_TYPE.getCode(),webFontId+"",gson.toJson(webFont));
return true;

package com.jd.xml.handler;

import com.jd.webfont.common.entity.WebIcon;
import com.jd.webfont.common.util.UnicodeConverter;
import org.xml.sax.Attributes;
import org.xml.sax.SAXException;
import org.xml.sax.helpers.DefaultHandler;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

/**
* 字体SVG解析器
* Date: 16-10-25
* Time: 上午10:56
*/
public class XmlSAXHandler extends DefaultHandler {
private List webIcOns= new ArrayList();
private Map fOntFace=new HashMap();

@Override
public void startDocument() throws SAXException {
System.out.println("---->startDocument() is invoked...");
}

@Override
public void endDocument() throws SAXException {
System.out.println("---->endDocument() is invoked...");
}
@Override
public void startElement(String uri, String localName, String qName, Attributes attributes) throws SAXException {
if (qName.equalsIgnoreCase("font-face")){
for (int i=0;i fontFace.put(attributes.getQName(i),attributes.getValue(i));
}
}

if (qName.equalsIgnoreCase("glyph")){
/* */
String code = attributes.getValue("unicode");
if (code !=null){
if (code.startsWith("&#x")){ // code = ò
code=code.substring(3,code.length()-1);
}else{
code= UnicodeConverter.charToUnicode(code.charAt(0));
}
WebIcon icon = new WebIcon();
icon.setName(attributes.getValue("glyph-name"));
icon.setUnicode(code);
icon.setPath(attributes.getValue("d"));
webIcons.add(icon);
}
}
}

public List getWebIcons() {
return webIcons;
}

public Map getFontFace() {
return fontFace;
}
}






推荐阅读
  • 在Android开发中,使用Picasso库可以实现对网络图片的等比例缩放。本文介绍了使用Picasso库进行图片缩放的方法,并提供了具体的代码实现。通过获取图片的宽高,计算目标宽度和高度,并创建新图实现等比例缩放。 ... [详细]
  • android listview OnItemClickListener失效原因
    最近在做listview时发现OnItemClickListener失效的问题,经过查找发现是因为button的原因。不仅listitem中存在button会影响OnItemClickListener事件的失效,还会导致单击后listview每个item的背景改变,使得item中的所有有关焦点的事件都失效。本文给出了一个范例来说明这种情况,并提供了解决方法。 ... [详细]
  • Spring源码解密之默认标签的解析方式分析
    本文分析了Spring源码解密中默认标签的解析方式。通过对命名空间的判断,区分默认命名空间和自定义命名空间,并采用不同的解析方式。其中,bean标签的解析最为复杂和重要。 ... [详细]
  • 向QTextEdit拖放文件的方法及实现步骤
    本文介绍了在使用QTextEdit时如何实现拖放文件的功能,包括相关的方法和实现步骤。通过重写dragEnterEvent和dropEvent函数,并结合QMimeData和QUrl等类,可以轻松实现向QTextEdit拖放文件的功能。详细的代码实现和说明可以参考本文提供的示例代码。 ... [详细]
  • 本文分享了一个关于在C#中使用异步代码的问题,作者在控制台中运行时代码正常工作,但在Windows窗体中却无法正常工作。作者尝试搜索局域网上的主机,但在窗体中计数器没有减少。文章提供了相关的代码和解决思路。 ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 本文讨论了一个关于cuowu类的问题,作者在使用cuowu类时遇到了错误提示和使用AdjustmentListener的问题。文章提供了16个解决方案,并给出了两个可能导致错误的原因。 ... [详细]
  • XML介绍与使用的概述及标签规则
    本文介绍了XML的基本概念和用途,包括XML的可扩展性和标签的自定义特性。同时还详细解释了XML标签的规则,包括标签的尖括号和合法标识符的组成,标签必须成对出现的原则以及特殊标签的使用方法。通过本文的阅读,读者可以对XML的基本知识有一个全面的了解。 ... [详细]
  • 本文介绍了南邮ctf-web的writeup,包括签到题和md5 collision。在CTF比赛和渗透测试中,可以通过查看源代码、代码注释、页面隐藏元素、超链接和HTTP响应头部来寻找flag或提示信息。利用PHP弱类型,可以发现md5('QNKCDZO')='0e830400451993494058024219903391'和md5('240610708')='0e462097431906509019562988736854'。 ... [详细]
  • 本文讨论了如何使用GStreamer来删除H264格式视频文件中的中间部分,而不需要进行重编码。作者提出了使用gst_element_seek(...)函数来实现这个目标的思路,并提到遇到了一个解决不了的BUG。文章还列举了8个解决方案,希望能够得到更好的思路。 ... [详细]
  • 基于移动平台的会展导游系统APP设计与实现的技术介绍与需求分析
    本文介绍了基于移动平台的会展导游系统APP的设计与实现过程。首先,对会展经济和移动互联网的概念进行了简要介绍,并阐述了将会展引入移动互联网的意义。接着,对基础技术进行了介绍,包括百度云开发环境、安卓系统和近场通讯技术。然后,进行了用户需求分析和系统需求分析,并提出了系统界面运行流畅和第三方授权等需求。最后,对系统的概要设计进行了详细阐述,包括系统前端设计和交互与原型设计。本文对基于移动平台的会展导游系统APP的设计与实现提供了技术支持和需求分析。 ... [详细]
  • 本文介绍了关于Java异常的八大常见问题,包括异常管理的最佳做法、在try块中定义的变量不能用于catch或finally的原因以及为什么Double.parseDouble(null)和Integer.parseInt(null)会抛出不同的异常。同时指出这些问题是由于不同的开发人员开发所导致的,不值得过多思考。 ... [详细]
  • 本文讨论了如何在不使用SearchBar display controller的情况下,单独使用SearchBar并捕获其textChange事件。作者介绍了实际状况,即左侧SliderMenu中的SearchBar需要在主页TableView中显示搜索结果。然后,作者提供了解决方案和步骤,帮助读者实现这一功能。 ... [详细]
  • Python正则表达式学习记录及常用方法
    本文记录了学习Python正则表达式的过程,介绍了re模块的常用方法re.search,并解释了rawstring的作用。正则表达式是一种方便检查字符串匹配模式的工具,通过本文的学习可以掌握Python中使用正则表达式的基本方法。 ... [详细]
  • 自动轮播,反转播放的ViewPagerAdapter的使用方法和效果展示
    本文介绍了如何使用自动轮播、反转播放的ViewPagerAdapter,并展示了其效果。该ViewPagerAdapter支持无限循环、触摸暂停、切换缩放等功能。同时提供了使用GIF.gif的示例和github地址。通过LoopFragmentPagerAdapter类的getActualCount、getActualItem和getActualPagerTitle方法可以实现自定义的循环效果和标题展示。 ... [详细]
author-avatar
开心宝2502869253
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有