Struggling to create SVG shape using JavaScript
I have already read the other questions relating to SVG creation using JavaScript and followed any links, but I can't seem to get this to work. Maybe somebody here can spot where I'm going wrong.
EDIT: I currently have a div with the ID 'svgbasics' in the body of the document, and I'm trying to create an SVG shape using values I have retrieved from an XML document.
When I load the page, nothing appears.
Here's my code:
var questions = [];
for (j=0; j<arrayIds.length; j++)
{
$(xml).开发者_StackOverflow中文版find("C[ID='" + arrayIds[j] + "']").each(function(){
// pass values
questions[j] =
{
typ: $(this).attr('typ'),
width: $(this).find("I").attr('wid'),
height: $(this).find("I").attr('hei'),
x: $(this).find("I").attr('x'),
y: $(this).find("I").attr('x'),
baC: $(this).find("I").attr('baC'),
boC: $(this).find("I").attr('boC'),
boW: $(this).find("I").attr('boW')
}
if ($(this).attr('typ') == '3')
{
var shape = this.id;
var svg = $('#svgbasics').svg('get');
svg.rect(x($(this).find("I").attr('x')),
y($(this).find("I").attr('y')),
width($(this).find("I").attr('width')),
height($(this).find("I").attr('height')),
{fill: colours[$(this).find("I").attr('baC')]});
} else {
// Add here
alert($(this).find("I").attr('x'));
}
});
}
It's rather hard to say what's wrong without having the full context. I'd first suggest inspecting your content in a DOM/JS debugger, e.g Opera Dragonfly, Webkit Web Inspector or Mozilla Firebug. Verify that all your elements are created correctly, and that it looks like you expect in the DOM tree.
精彩评论