javascript - Image not showing on iPad d3js -
i'm using d3js along angularjs in ipad webapp. when running on safari/chrome looks good, when running on ipad images append d3js not show.
here js:
directive('zoomscreen', [function() { return{ restrict: 'e', link: function(scope, elm, attrs) { var width = 1024, height = 660; var offset= [{"xoff":-20,"yoff":10,"swipe_class":"left"},{"xoff":-80,"yoff":0,"swipe_class":"right"},{"xoff":0,"yoff":-80,"swipe_class":"left"},{"xoff":50,"yoff":0,"swipe_class":"left"}]; var svg = d3.select("svg") .attr("width", width) .attr("height", height) .append("g"); var = svg.append("image") .attr("class", "logo") .attr("x", 375) .attr("y", 175) .attr("xlink:href", "../images/brain-back.png") .attr("height", 300) .attr("width", 300) .style("fill", "transparent") .style("stroke", "black") .style("stroke-width", 1) .on("click", outclicked); var image = svg.append("image") .attr("class", "logo") .data([offset[0]]) .attr("x", 485) .attr("y", 175) .attr("height", 90).attr("width", 90) .attr("xlink:href", "../images/image1.png") .style("stroke", "black") .style("stroke-width", 1) .on("click", clicked); var image2 = svg.append("image") .attr("class", "logo") .data([offset[1]]) .attr("x", 545) .attr("y", 255) .attr("height", 90).attr("width", 90) .attr("xlink:href", "../images/image2.png") .style("stroke", "black") .style("stroke-width", 1) .on("click", clicked);
and html:
<zoom-screen> <svg class="accel"></svg> </zoom-screen>
the strange thing ipad knows there elements there, because allows me highlight , click them, doesn't show images.
turns out had convert image base 64 string. set string var , had xlink:href pointing var instead of location. ex:
var image1 = "data:foobase64stringhere"; .attr('xlink:href',image1)
Comments
Post a Comment