import io.data2viz.charts.* import io.data2viz.charts.dimension.* import io.data2viz.charts.chart.* import io.data2viz.charts.chart.mark.* import io.data2viz.charts.viz.* import io.data2viz.charts.layout.* import io.data2viz.geom.* import io.data2viz.shape.Symbols import io.data2viz.dsv.Dsv import org.w3c.fetch.Response import kotlinx.browser.window import kotlin.js.Promise val width = 700.0 val height = 500.0 // data class Storm(val name: String, val year: Int, val month: Int, val day: Int, val hour: Int, val status: String, val wind: Double, val pressure: Double) data class Storm(val name: String, val date: String, val hour: Int, val status: String, val wind: Double, val pressure: Double) //private fun parseStorm(row: List<String>) = Storm(row[1], row[2].toInt(), row[3].toInt(), row[4].toInt(), row[5].toInt(), row[8], row[10].toDouble(), row[11].toDouble()) private fun parseStorm(row: List<String>) = Storm(row[1], row[2]+"/"+row[3]+"/"+row[4], row[5].toInt(), row[8], row[10].toDouble(), row[11].toDouble()) fun main() { // Creating and sizing the VizContainer val vc = newVizContainer().apply { size = Size(width, height) } val request: Promise<Response> = window.fetch("https://vincentarelbundock.github.io/Rdatasets/csv/dplyr/storms.csv") request.then { it.text().then { val storms = Dsv() .parseRows(it) .drop(1) .map { parseStorm(it) }.sortedBy { it.date } vc.chart(storms) { title = "Storms data" // Create 2 continuous numeric dimensions val distance = discrete( { domain.date } ) { name = "Distance in miles" } val time = quantitative( { domain.pressure } ) { name = "Commute time in minutes" } // Split our dataset based on cities series = discrete( { domain.status } ) // Plot values plot(distance, time) { // size = constant(30.0) // symbol = constant(Symbols.Circle) } } } } }