我希望我能在这里找到一些帮助,我一直在研究和尝试,但似乎无法找到解决方案。我正在使用处理2.0.3。
我有一个SVG文件,它是美国各州的地图。我有一个excel表保存为.csv,包含每个州的数据。我一直试图找到一种方法来点击显示的SVG文件中的状态,并让它显示excel表中数据的某种图形。
我的问题是:如何使SVG文件可以点击,以及如何将其链接到数据? 我在互联网上看到的解决方案是创建一个不可见的形状图层,所有状态的颜色略有不同,点击鼠标时检测到的颜色将确定颜色并从数据中读取颜色。我试图重新创建我发现的例子,但它们没有意义,我觉得我在墙上。如果有人有任何帮助或建议,这将有助于一吨!提前谢谢!
到目前为止,代码大部分改编自http://forum.processing.org/one/topic/need-help-with-mouse-over-text-box-display-on-us-map.html。它不起作用......:/
PShape states;
PShape buff;
Table crime;
PGraphics pg;
int rowCount;
int start = 100;
int yrButton = 0;
float crimeButton = 0;
boolean mouseShowText = false;
String[] textToShow = {"HI","RI","CT","MA","ME","NH","VT","NY","NJ","FL","NC","OH","IN","IA",
"CO","NV","PA","DE","MD","MI","WA","CA","OR","IL","MN","WI","DC","NM","VA","AK","GA","AL",
"TN","AZ","UT","ND","SD","NE","MS","MO","AR","OK","KS","LA"};
void setup(){
size(1000,700);
crime = loadTable("crime.csv");
states = loadShape("states.svg");
rowCount = crime.getRowCount();
pg = createGraphics(700,500);
pg.beginDraw();
pg.background(0);
makeHiddenMap(textToShow);
pg.endDraw();
noLoop();
}
void draw(){
background(222,250,248);
fill(200);
rect(0,0,575,400);
shape(states,0,0,700,500);
}
void makeHiddenMap(String[] states){
pg.stroke(255);
for(int i=0;i<states.length;i++){
PShape buff = states.getChild(states[i]);
buff.disableStyle();
pg.fill(count+10,0,0);
pg.noStroke();
pg.shape(buff,0,0);
textToShow[count] = states[i] + winText;
count++;
}
}
void showMouseOver(){
String textMouseOver=textToShow[numberOfState];
if (!textMouseOver.equals("")){
float posX=textX;
float posY=textY;
if (posX+textWidth(textMouseOver)+10 > width){
posX=width-textWidth(textMouseOver)-12;
}
fill(255,255,44);
rect(posX+14,posY+4,textWidth(textMouseOver)+5,20);
fill(0);
text(textMouseOver,posX+16,posY+4+16);
}
}