全部栏目

首页 热点资讯 义务教育 高等教育 出国留学 考研考公

SVG 显示不出中文

发布网友

我来回答

共2个回答

热心网友

年轻人。你用的函数是 File SVGOutputFile 吧。
我看你的SVG图像是动态生成的。我举一个例子你试一下就明白了
先看你的做的例子

import java.lang.Math;
import java.io.File;
import java.io.FileWriter;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
public class generateontology {

public static void main(String[] args) {
List list=new ArrayList();
list.add("数学");
list.add("中文");
list.add("语文");
String path="F:\\";
renderSVGGradientOnToLogy("abc",list,path);

}
public static void renderSVGGradientOnToLogy(String username,List list, String path) {

//此处为中间圆心的硬编码坐标，尚可修改，
int CirCenterX=500;
int CirCenterY=400;
int r=50;//圆的半径
int length=100;//射线的长度
int LineEndX=0;
int LineEndY=0;
int CirSecEndX=0;
int CirSecEndY=0;
String NewDirectPage="SVGSecInstance.jsp";

int ListAcount=list.size();

// This is where we find out what the largest value contained in each of the array is,
// its a simple loop that goes through each value passed, and determines the highest

try{
// Get the SVG file ready for the drawing of the perfomance graph
File SVGOutputFile = new File(path,"SVGOnToLogy.svg");
// File SVGOutputFile = new File("SVGOnToLogyTest1.svg");

FileWriter SVGout = new FileWriter(SVGOutputFile);

// Get the SVG graph ready
SVGout.write("<?xml version=\"1.0\"?>");
SVGout.write("\n<svg width=\"1300\" height=\"1300\">");
SVGout.write("\n<desc>Developer Works Dynamic OnToLogy Example</desc>");
//2010-8-8尹福青添加特效
SVGout.write("<script type=\"text/javascript\"><![CDATA[function changeDescriptionText(evt){ var targetButton = evt.getTarget(); targetButton.setAttribute(\"fill\",\"url(#rainbowRad)\"); }function resetText(){ var targetButton = evt.getTarget(); targetButton.setAttribute(\"fill\",\"blue\");}// ]]></script>");
SVGout.write("\n<defs>\n");
SVGout.write("\n<radialGradient id=\"rainbowRad\">");
SVGout.write("\n <stop offset=\"0\" style=\"stop-color: rgb(255,0,0);\"/>");
SVGout.write("\n <stop offset=\"16.6%\" style=\"stop-color: orange\"/>");
SVGout.write("\n <stop offset=\"33.3%\" style=\"stop-color: yellow;\"/>");
SVGout.write("\n <stop offset=\"50%\" style=\"stop-color: green;\"/>");
SVGout.write("\n <stop offset=\"66.6%\" style=\"stop-color : #00FFFF\"/>");
SVGout.write("\n <stop offset=\"83.3%\" style=\"stop-color: blue;\"/>");
SVGout.write("\n <stop offset=\"100%\" style=\"stop-color: indigo;\"/></radialGradient>");
//圆的提取可以在下面的<g>中重用，从第一秒开始放大
SVGout.write("<circle id=\"CirSec\" r=\"0\">");
SVGout.write("\n<animate attributeName=\"r\" begin=\'1s\' to=\"50\" r=\"1s\" fill=\"freeze\"/>");
SVGout.write("\n</circle>\n</defs>");

// This generates a linear and radial gradient using a random colour
//在此处需计算一下根据数组元素的个数总共需要生成几个圆和几条射线。圆和射线个数相同
//1、当没有数值时
if(ListAcount==0)
{

SVGout.write("<text x=\""+(CirCenterX-25)+"\" y=\""+(CirCenterY+5)+"\" id=\"ontology\" fill=\"red\" font-size=\"30\">没有此记录</text></a>");

}
else{

//开始画布：先画中间圆之外的线和圆，在画中间的一个中间圆，这样线条不会挡住中间的文本。

for(int i=1;i<=ListAcount;i++)
{
if(i==1)//当为一时将x,y坐标固定。
{
SVGout.write("\n <line x1=\""+CirCenterX+"\" y1=\""+CirCenterY+"\" x2=\""+CirCenterX+"\" y2=\""+CirCenterY+"\" stroke-width=\"2\" stroke=\"blue\" >");
SVGout.write("\n <animate attributeName=\"x2\" to=\""+(CirCenterX+r+length)+"\" r=\"1s\" fill=\"freeze\"/>");
SVGout.write("</line>");
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
//尹福青2010-8-26号修改，由于再输入汉字时SVG图像无法显示，原因为g的ID属性用了数组里的内容导致显示不出来，所以将ID改为字母+数字；
// SVGout.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
SVGout.write("\n<g id=\"GLogy"+(i-1)+"\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\" > <a xlink:href=\""+NewDirectPage+"?Instance="+list.get(i-1)+"\">");

SVGout.write("\n<g><use xlink:href=\"#CirSec\" x=\""+(CirCenterX+2*r+length)+"\" y=\""+CirCenterY+"\" /> </g> ");
SVGout.write("<text id=\"TextLogy"+(i-1)+"\" x=\""+(CirCenterX+2*r+length-25)+"\" y=\""+(CirCenterY)+"\" visibility=\"hidden\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+list.get(i-1)+"");
SVGout.write("\n <animate attributeName=\"visibility\" to=\"visible\" begin=\"2s\" r=\"1s\" fill=\"freeze\"/>");
SVGout.write("</text></a></g>");
}
else//当不为一时
{

LineEndX=(int)((Math.cos(2*Math.PI*(i-1)/ListAcount))*(r+length)+500);
LineEndY=(int)(400-Math.sin(2*Math.PI*(i-1)/ListAcount)*(r+length));
CirSecEndX=(int)((Math.cos(2*Math.PI*(i-1)/ListAcount))*(2*r+length)+500);
CirSecEndY=(int)(400-Math.sin(2*Math.PI*(i-1)/ListAcount)*(2*r+length));

SVGout.write("\n <line x1=\""+CirCenterX+"\" y1=\""+CirCenterY+"\" x2=\""+CirCenterX+"\" y2=\""+CirCenterY+"\" stroke-width=\"2\" stroke=\"blue\" >");
SVGout.write("\n <animate attributeName=\"x2\" to=\""+LineEndX+"\" r=\"1s\" fill=\"freeze\"/>");
SVGout.write("\n <animate attributeName=\"y2\" to=\""+LineEndY+"\" r=\"1s\" fill=\"freeze\"/>");

SVGout.write("</line>");

//圆生成并且附带了连接和数组中的字符
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
// SVGout.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
SVGout.write("\n<g id=\"GLogy"+(i-1)+"\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\"> <a xlink:href=\""+NewDirectPage+"?Instance="+list.get(i-1)+"\">");
SVGout.write("\n<g><use xlink:href=\"#CirSec\" x=\""+CirSecEndX+"\" y=\""+CirSecEndY+"\" /> </g> ");
SVGout.write("<text id=\"TextLogy"+(i-1)+"\" x=\""+(CirSecEndX-25)+"\" y=\""+(CirSecEndY)+"\" visibility=\"hidden\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+list.get(i-1)+"");
SVGout.write("\n <animate attributeName=\"visibility\" to=\"visible\" begin=\"2s\" r=\"1s\" fill=\"freeze\"/>");
SVGout.write("</text></a></g>");

}

}
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
//SVGout.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
SVGout.write("\n<g id=\"GLogyCenter\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\"> <a xlink:href=\""+NewDirectPage+"?Instance="+username+"\">");

SVGout.write("\n <circle cx=\""+CirCenterX+"\" cy=\""+CirCenterY+"\" r=\""+r+"\" fill=\"blue\"></circle>");
SVGout.write("<text x=\""+(CirCenterX-25)+"\" y=\""+(CirCenterY)+"\" id=\"ontology\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+username+"</text></a></g>");

}

SVGout.write("\n</svg>");
SVGout.close();
}
catch (java.io.IOException e){
System.out.println("IO Exception error caught");
e.printStackTrace();
}
catch (Exception e)
{
System.out.println("Unknown error caught");
e.printStackTrace();
}

}
}

你将上面的代码放到java里面运行。后会在F盘下面出现一个文件svgontology.svg这是我们动态生成的。双击它。在浏览器中打开时发现它是无法正常显示的。然后右击用Editplus打开。选择另存为UTF-8格式，保存，在浏览器中重新查看时。显示正常。（当然前提是你要安装svg的插件）。现在我们有另一种方式。可以直接让他生成utf-8的类型。无需转换。看我的改的代码：
import java.io.FileOutputStream;
import java.io.OutputStreamWriter;
import java.util.ArrayList;
import java.util.List;

public class asdf {

/**
* @param args
*/
public static void main(String[] args) {
List list=new ArrayList();
list.add("数学");
list.add("中文");
list.add("语文");
String path="F:\\";
renderSVGGradientOnToLogy("abc",list);

}

public static void renderSVGGradientOnToLogy(String username,List list) {

//此处为中间圆心的硬编码坐标，尚可修改，
int CirCenterX=500;
int CirCenterY=400;
int r=50;//圆的半径
int length=100;//射线的长度
int LineEndX=0;
int LineEndY=0;
int CirSecEndX=0;
int CirSecEndY=0;
String NewDirectPage="SVGSecInstance.jsp";
int ListAcount=list.size();
String path="F:\\SVGOnToLogy.svg";

// This is where we find out what the largest value contained in each of the array is,
// its a simple loop that goes through each value passed, and determines the highest

try{
// Get the SVG file ready for the drawing of the perfomance graph

OutputStreamWriter out = new OutputStreamWriter(
new FileOutputStream(path),"UTF-8");

// Get the SVG graph ready
out.write("<?xml version=\"1.0\"?>");
out.write("\n<svg width=\"1300\" height=\"1300\">");
out.write("\n<desc>Developer Works Dynamic OnToLogy Example</desc>");
//2010-8-8尹福青添加特效
out.write("<script type=\"text/javascript\"><![CDATA[function changeDescriptionText(evt){ var targetButton = evt.getTarget(); targetButton.setAttribute(\"fill\",\"url(#rainbowRad)\"); }function resetText(){ var targetButton = evt.getTarget(); targetButton.setAttribute(\"fill\",\"blue\");}// ]]></script>");
out.write("\n<defs>\n");
out.write("\n<radialGradient id=\"rainbowRad\">");
out.write("\n <stop offset=\"0\" style=\"stop-color: rgb(255,0,0);\"/>");
out.write("\n <stop offset=\"16.6%\" style=\"stop-color: orange\"/>");
out.write("\n <stop offset=\"33.3%\" style=\"stop-color: yellow;\"/>");
out.write("\n <stop offset=\"50%\" style=\"stop-color: green;\"/>");
out.write("\n <stop offset=\"66.6%\" style=\"stop-color : #00FFFF\"/>");
out.write("\n <stop offset=\"83.3%\" style=\"stop-color: blue;\"/>");
out.write("\n <stop offset=\"100%\" style=\"stop-color: indigo;\"/></radialGradient>");
//圆的提取可以在下面的<g>中重用，从第一秒开始放大
out.write("<circle id=\"CirSec\" r=\"0\">");
out.write("\n<animate attributeName=\"r\" begin=\'1s\' to=\"50\" r=\"1s\" fill=\"freeze\"/>");
out.write("\n</circle>\n</defs>");

// This generates a linear and radial gradient using a random colour
//在此处需计算一下根据数组元素的个数总共需要生成几个圆和几条射线。圆和射线个数相同
//1、当没有数值时
if(ListAcount==0)
{

out.write("<text x=\""+(CirCenterX-25)+"\" y=\""+(CirCenterY+5)+"\" id=\"ontology\" fill=\"red\" font-size=\"30\">没有此记录</text></a>");

}
else{

//开始画布：先画中间圆之外的线和圆，在画中间的一个中间圆，这样线条不会挡住中间的文本。

for(int i=1;i<=ListAcount;i++)
{
if(i==1)//当为一时将x,y坐标固定。
{
out.write("\n <line x1=\""+CirCenterX+"\" y1=\""+CirCenterY+"\" x2=\""+CirCenterX+"\" y2=\""+CirCenterY+"\" stroke-width=\"2\" stroke=\"blue\" >");
out.write("\n <animate attributeName=\"x2\" to=\""+(CirCenterX+r+length)+"\" r=\"1s\" fill=\"freeze\"/>");
out.write("</line>");
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
//尹福青2010-8-26号修改，由于再输入汉字时SVG图像无法显示，原因为g的ID属性用了数组里的内容导致显示不出来，所以将ID改为字母+数字；
// out.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
out.write("\n<g id=\"GLogy"+(i-1)+"\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\" > <a xlink:href=\""+NewDirectPage+"?Instance="+list.get(i-1)+"\">");

out.write("\n<g><use xlink:href=\"#CirSec\" x=\""+(CirCenterX+2*r+length)+"\" y=\""+CirCenterY+"\" /> </g> ");
out.write("<text id=\"TextLogy"+(i-1)+"\" x=\""+(CirCenterX+2*r+length-25)+"\" y=\""+(CirCenterY)+"\" visibility=\"hidden\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+list.get(i-1)+"");
out.write("\n <animate attributeName=\"visibility\" to=\"visible\" begin=\"2s\" r=\"1s\" fill=\"freeze\"/>");
out.write("</text></a></g>");
}
else//当不为一时
{

LineEndX=(int)((Math.cos(2*Math.PI*(i-1)/ListAcount))*(r+length)+500);
LineEndY=(int)(400-Math.sin(2*Math.PI*(i-1)/ListAcount)*(r+length));
CirSecEndX=(int)((Math.cos(2*Math.PI*(i-1)/ListAcount))*(2*r+length)+500);
CirSecEndY=(int)(400-Math.sin(2*Math.PI*(i-1)/ListAcount)*(2*r+length));

out.write("\n <line x1=\""+CirCenterX+"\" y1=\""+CirCenterY+"\" x2=\""+CirCenterX+"\" y2=\""+CirCenterY+"\" stroke-width=\"2\" stroke=\"blue\" >");
out.write("\n <animate attributeName=\"x2\" to=\""+LineEndX+"\" r=\"1s\" fill=\"freeze\"/>");
out.write("\n <animate attributeName=\"y2\" to=\""+LineEndY+"\" r=\"1s\" fill=\"freeze\"/>");

out.write("</line>");

//圆生成并且附带了连接和数组中的字符
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
// out.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
out.write("\n<g id=\"GLogy"+(i-1)+"\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\"> <a xlink:href=\""+NewDirectPage+"?Instance="+list.get(i-1)+"\">");
out.write("\n<g><use xlink:href=\"#CirSec\" x=\""+CirSecEndX+"\" y=\""+CirSecEndY+"\" /> </g> ");
out.write("<text id=\"TextLogy"+(i-1)+"\" x=\""+(CirSecEndX-25)+"\" y=\""+(CirSecEndY)+"\" visibility=\"hidden\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+list.get(i-1)+"");
out.write("\n <animate attributeName=\"visibility\" to=\"visible\" begin=\"2s\" r=\"1s\" fill=\"freeze\"/>");
out.write("</text></a></g>");

}

}
//尹福青2010-8-8号修改，在进入新的页面后将Instance的值动态传入。
//out.write("\n<g> <a xlink:href=\"http://www.baidu.com\">");
out.write("\n<g id=\"GLogyCenter\" onmouseover=\"changeDescriptionText(evt)\" onmouseout=\"resetText(evt)\" style=\"fill:blue\"> <a xlink:href=\""+NewDirectPage+"?Instance="+username+"\">");

out.write("\n <circle cx=\""+CirCenterX+"\" cy=\""+CirCenterY+"\" r=\""+r+"\" fill=\"blue\"></circle>");
out.write("<text x=\""+(CirCenterX-25)+"\" y=\""+(CirCenterY)+"\" id=\"ontology\" fill=\"red\" font-size=\"20\" style=\"fill:red\">"+username+"</text></a></g>");

}

out.write("\n</svg>");
out.close();
}
catch (java.io.IOException e){
System.out.println("IO Exception error caught");
e.printStackTrace();
}
catch (Exception e)
{
System.out.println("Unknown error caught");
e.printStackTrace();
}

}

}
好了试一下吧！看看是不是不用保存直接就可以浏览中文了！！！

热心网友

将前两行改为
<?xml version="1.0" encoding="GB2312"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1300" height="1300">

这样，在我这里是可以显示汉字的。
请在你那里测试。

声明声明：本网页内容为用户发布，旨在传播知识，不代表本网认同其观点，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。E-MAIL:11247931@qq.com