Question

我希望这是一个简单的问题，

我只是想在我的svg上添加一个显示文本的div。我已经开发了这个代码，在DOM中它显示我的svg附加了类，里面有所需的文本。但是，页面上没有出现任何文字。

我希望有人能够指出我哪里出错了？

这是代码;

http://plnkr.co/edit/LxD1TarajR8dZUS7MbHg?p=preview

from Tkinter import *
import os

root = Tk()
root.title("MyPath")
#root.iconbitmap(default='SpSoLogo.png.ico')

class MainGui:
    def __init__(self, master):
        self.mypathLabel = Label(master, text="Copy and Paste (Ctrl-V) your filepath here:")
        self.mypathEntry = Entry(master, bg="black", fg="white", relief=SUNKEN)

        self.mypathSaveButton = Button(master, text="Save Path", bg="black", fg="white", command=self.save_path)
        self.mypathLoadButton = Button(master, text="Load Paths", bg="black", fg="white", command=self.load_paths)
        self.mypathClearButton = Button(master, text="Clear Path", bg="black", fg="white", command=self.clear_path)

        self.mypathList = Listbox(master, bg="black", fg="white")
        self.mypathScroll = Scrollbar(master, orient=HORIZONTAL, bg="black")

        self.mypathScroll.config(command=self.mypathList.xview)

        self.mypathLabel.pack()
        self.mypathEntry.pack()

        self.mypathSaveButton.pack()
        self.mypathLoadButton.pack()
        self.mypathClearButton.pack(side=BOTTOM)

        self.mypathList.pack()
        self.mypathList.bind("<Double-Button-1>", self.open_path, self.clear_path)

        self.mypathScroll.pack()

def load_paths(self):
    with open("favorites.txt", "r") as f:
        for line in f:
            self.mypathList.insert(END, line)

def clear_path(self):
    if self.mypathList.curselection():
        getOut = self.mypathList.curselection()
        self.mypathList.delete(getOut)
    else:
        self.mypathList.delete(0, 'end')

    #####Everything Erases from the text file#####

    badPath = [self.mypathList.curselection()]
    f = open("favorites.txt", "r")
    lines = f.readlines()
    f.close()

    f = open("favorites.txt", "w")
    for line in lines:
        if line == badPath:
            f.delete(line)
    f.close()

def save_path(self):
    fp = self.mypathEntry.get()
    scribe=open("favorites.txt", "a")
    scribe.write(fp + '\n')
    self.mypathEntry.delete(0, 'end')
    self.mypathList.insert(1, fp)


def open_path(self, event):
    list_item = self.mypathList.curselection()
    fp = self.mypathList.get(list_item[0])
    os.system('Explorer "%s"' % fp)
##        print(fp)
##        try:
##            with open(fp, 'r') as result:
##                print(result.read())
##        except Exception as e:
##            print(e)    

MainGui(root)
root.mainloop()

Answer 1

正如@RobertLongson所说，你只能将html放入带有foreignObject的svg（这在IE中不起作用）。

而不是这个，我建议采用svg方式

结果：http://plnkr.co/edit/rb18RQTT7tBeo8lJXVpO?p=preview

d3.selectAll(".svgCircle")
  .append("text")
  .text(function(d) {
    return d.label
  })
  .style("stroke","black")
  .attr("dy", "1em");

您可以控制文本的所有属性，而不是＆＃34; 我可以更好地控制文本的位置等＆＃34;评论。我刚刚提供了dy和stroke属性，但您可以按照自己喜欢的方式为文字着色和塑造

Answer 2

你不能将一个div放在一个svg元素中并让它显示出来。

您可能希望使用insert函数而不是append： https://github.com/d3/d3/wiki/Selections#insert

附加文本不会显示d3.js

2 个答案: