Published
Edited
Apr 20, 2018
1 star
function tableauInit() {
//Hit Shift-Enter to run this
const containerDiv = container,
url = "https://public.tableau.com/shared/4Z72K6GZC?:display_count=yes",
options = {
hideTabs: true,
onFirstInteractive: function () {
console.log("Run this code when the viz has finished loading.");
}
};
const viz = new window.tableau.Viz(containerDiv, url, options);
return viz;
}
viz = tableauInit()
workbookName = viz.getWorkbook().getName()
tableauMap = viz.getWorkbook().getActiveSheet().getWorksheets().get('Solar Map')
mapData = tableauMap.getUnderlyingDataAsync({includeAllColumns: true})
html`<link href='https://unpkg.com/mapbox-gl@0.43.0/dist/mapbox-gl.css' rel='stylesheet' />`
mapArray[0][18].value
mapArray[0][17].value
function buildPoints() {
let item = mapArray.map( point => {
let maximum = 10000;
return turf.helpers.point(
[
parseFloat(point[18].value),
parseFloat(point[17].value)
],
{
"ID": parseInt(point[0].value),
"1": scale(parseInt(point[2].value)/maximum).hex(),
"2": scale(parseInt(point[3].value)/maximum).hex(),
"3": scale(parseInt(point[4].value)/maximum).hex(),
"4": scale(parseInt(point[5].value)/maximum).hex(),
"5": scale(parseInt(point[6].value)/maximum).hex(),
"6": scale(parseInt(point[7].value)/maximum).hex(),
"7": scale(parseInt(point[8].value)/maximum).hex(),
"8": scale(parseInt(point[9].value)/maximum).hex(),
"9": scale(parseInt(point[10].value)/maximum).hex(),
"10": scale(parseInt(point[11].value)/maximum).hex(),
"11": scale(parseInt(point[12].value)/maximum).hex(),
"12": scale(parseInt(point[13].value)/maximum).hex(),
}
)
})
return item
}
geoJSON = turf.helpers.featureCollection(points)
map = {
let map = this;
if (!map) {
// Create the \`map\` object with the mapboxgl.Map constructor, referencing
// the container div
map = new mapboxgl.Map({
container: container2,
center: [
-98.19,
39.73
],
zoom: 2.5,
style: 'mapbox://styles/mapbox/light-v9'
});
map.on('load', () => {
map.addLayer({
"id": "points",
"type": "circle",
"source": {
"type": "geojson",
"data": geoJSON
},
"paint":{
'circle-color': ['get', String(time)],
'circle-radius': 1
}
})
});
}
// Wait until the map loads, then yield the container again.
yield new Promise(resolve => {
if (map.loaded()) resolve(map);
else map.on('load', () => resolve(map));
});
let expression = ['get', String(time)];
map.setPaintProperty('points', 'circle-color', expression);
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
