对URL查询字符串使用d3 [英] Using d3 with URL query strings

问题描述

我想要提供网址，以存取我建立的可视化的不同检视。例如，一些可视化对于每年或每个变量而改变。当用户更改所显示的年份或变量时，我想更新网址。例如，从

  index.html？year = 1790& variable = population 
  

至

  index.html？year = 1820& ; variable = populationdensity 
  

然后，当访问者访问其中一个URL时，

也许我必须自己编写，但是任何人都做了类似的事情，或者有如何做的示例代码。

$您可以在脚本上执行

 <$ c $ 
 c> var i = 0; 
 var tele; 
 var search_values = location.search.replace（'\？'，''）。split（'&'）; 
 var query = {} 
 for（i = 0; i  telem = search_values [i] .split（'='）; 
 query [telem [0]] = telem [1]; 
} 
 
 console.log（query）; 
  

之后，查询变量应该包含查询字符串的所有键：值。这应该包含在一个函数内，以避免污染全局范围

I'd like to be able to provide URLs to access different views of visualizations that I've created. For example, some of the visualizations change for each year or for each variable. When the user changes the year or the variable depicted, I'd like to update the URL. For example, from

index.html?year=1790&variable=population

to

index.html?year=1820&variable=populationdensity

Then, when a visitor comes to one of those URLs, to initialize the visualization using the query string.

Perhaps I'll have to write this myself, but has anyone done something similar or have sample code for how to do this?

解决方案

on your script you can do something like

var i=0;
var tele;
var search_values=location.search.replace('\?','').split('&');
var query={}
for(i=0;i<search_values.length;i++){
    telem=search_values[i].split('=');
    query[telem[0]]=telem[1];
}

console.log(query);

after this the query variable should hold all the key:values of your query string. this of should be contained inside a function to avoid polluting the global scope

这篇关于对URL查询字符串使用d3的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！